From a224c1681b5ac0573a59b2a911793ae1588fa727 Mon Sep 17 00:00:00 2001
From: Jeremiah Tabb <51095001+jollyjerr@users.noreply.github.com>
Date: Thu, 29 Apr 2021 18:28:47 -0600
Subject: [PATCH] add i18next mocks to tests (#470)

---
 .../web/src/components/__tests__/BackButton.test.tsx  |  9 ++++++++-
 .../web/src/components/__tests__/HomeButtons.test.tsx | 11 +++++++++++
 .../web/src/components/__tests__/Hotlines.test.tsx    | 11 +++++++++++
 .../web/src/components/__tests__/Resource.test.tsx    | 11 +++++++++++
 4 files changed, 41 insertions(+), 1 deletion(-)

diff --git a/packages/web/src/components/__tests__/BackButton.test.tsx b/packages/web/src/components/__tests__/BackButton.test.tsx
index 7fb418d11..c5446bffa 100644
--- a/packages/web/src/components/__tests__/BackButton.test.tsx
+++ b/packages/web/src/components/__tests__/BackButton.test.tsx
@@ -1,6 +1,9 @@
 import { fireEvent, render } from "@testing-library/react";
+
 import BackButton from "../BackButton";
+import { I18nextProvider } from "react-i18next";
 import React from "react";
+import i18n from "../../i18n";
 import { useHistory } from "react-router-dom";
 
 jest.mock("react-router-dom", () => ({
@@ -12,7 +15,11 @@ const mockUseHistory = useHistory as jest.Mock;
 
 describe("<BackButton/>", () => {
   const setup = (overrides = {}) => {
-    return render(<BackButton {...overrides} />);
+    return render(
+      <I18nextProvider i18n={i18n}>
+        <BackButton {...overrides} />
+      </I18nextProvider>
+    );
   };
 
   it("calls the passed action when clicked", () => {
diff --git a/packages/web/src/components/__tests__/HomeButtons.test.tsx b/packages/web/src/components/__tests__/HomeButtons.test.tsx
index 369c0fc2b..4180f8b3d 100644
--- a/packages/web/src/components/__tests__/HomeButtons.test.tsx
+++ b/packages/web/src/components/__tests__/HomeButtons.test.tsx
@@ -8,6 +8,17 @@ jest.mock("../HomeLink", () => ({
     <div>{children}</div>
   ),
 }));
+jest.mock("react-i18next", () => ({
+  // this mock makes sure any components using the translate hook can use it without a warning being shown
+  useTranslation: () => {
+    return {
+      t: (str: string) => str,
+      i18n: {
+        changeLanguage: () => new Promise(() => ({})),
+      },
+    };
+  },
+}));
 
 describe("<HomeButtons/>", () => {
   const routerLinkTexts = routerLinkButtons.map(
diff --git a/packages/web/src/components/__tests__/Hotlines.test.tsx b/packages/web/src/components/__tests__/Hotlines.test.tsx
index ac3fcf64e..d6061732b 100644
--- a/packages/web/src/components/__tests__/Hotlines.test.tsx
+++ b/packages/web/src/components/__tests__/Hotlines.test.tsx
@@ -1,9 +1,20 @@
 import Hotlines, { hotlineList } from "../Hotlines";
+
 import React from "react";
 import { render } from "@testing-library/react";
 
 jest.mock("../HotlineCard", () => () => <div data-test="TEST-hotline-card" />);
 jest.mock("../PageBanner", () => () => null);
+jest.mock("react-i18next", () => ({
+  useTranslation: () => {
+    return {
+      t: (str: string) => str,
+      i18n: {
+        changeLanguage: () => new Promise(() => ({})),
+      },
+    };
+  },
+}));
 
 describe("<Hotlines/>", () => {
   it("renders a hotline card for each hotline", () => {
diff --git a/packages/web/src/components/__tests__/Resource.test.tsx b/packages/web/src/components/__tests__/Resource.test.tsx
index 9114a5003..04a4afca5 100644
--- a/packages/web/src/components/__tests__/Resource.test.tsx
+++ b/packages/web/src/components/__tests__/Resource.test.tsx
@@ -35,6 +35,17 @@ jest.mock("../../App.styles", () => ({
     },
   },
 }));
+jest.mock("react-i18next", () => ({
+  // this mock makes sure any components using the translate hook can use it without a warning being shown
+  useTranslation: () => {
+    return {
+      t: (str: string) => str,
+      i18n: {
+        changeLanguage: () => new Promise(() => ({})),
+      },
+    };
+  },
+}));
 
 const mockUseResources = useResources as jest.Mock;