Merge pull request #76 from apollographql/lh/fix-tests

fix tests
apollographql · Jul 10, 2023 · 09b4e30 · 09b4e30
2 parents 4a8b1cb + fac4ad6
commit 09b4e30
Show file tree

Hide file tree

Showing 10 changed files with 34 additions and 16 deletions.
diff --git a/client/src/components/__tests__/module-detail.js b/client/src/components/__tests__/module-detail.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { render, cleanup } from '../../utils/test-utils';
+import { renderWithRouter, cleanup } from '../../utils/test-utils';
 import ModuleDetail from '../module-detail';
 
 const mockModule = {
@@ -41,6 +41,6 @@ describe('Module Detail View', () => {
   afterEach(cleanup);
 
   it('renders without error', () => {
-    render(<ModuleDetail module={mockModule} track={mockParentTrack} />);
+    renderWithRouter(<ModuleDetail module={mockModule} track={mockParentTrack} />);
   });
 });
diff --git a/client/src/components/__tests__/modules-navigation.js b/client/src/components/__tests__/modules-navigation.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { render, cleanup } from '../../utils/test-utils';
+import { renderWithRouter, cleanup } from '../../utils/test-utils';
 import ModuleNav from '../modules-navigation';
 
 const mockModule = {
@@ -41,6 +41,6 @@ describe('Modules Navigation View', () => {
   afterEach(cleanup);
 
   it('renders without error', () => {
-    render(<ModuleNav module={mockModule} track={mockParentTrack} />);
+    renderWithRouter(<ModuleNav module={mockModule} track={mockParentTrack} />);
   });
 });
diff --git a/client/src/components/__tests__/track-detail.js b/client/src/components/__tests__/track-detail.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { render, cleanup } from '../../utils/test-utils';
+import { renderWithRouter, cleanup } from '../../utils/test-utils';
 import TrackDetail from '../track-detail';
 
 const mockTrack = {
@@ -32,6 +32,6 @@ describe('Module Detail View', () => {
   afterEach(cleanup);
 
   it('renders without error', () => {
-    render(<TrackDetail {...mockTrack} />);
+    renderWithRouter(<TrackDetail {...mockTrack} />);
   });
 });
diff --git a/client/src/containers/__tests__/track-card.js b/client/src/containers/__tests__/track-card.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { renderApollo, cleanup, waitForElement } from '../../utils/test-utils';
+import { renderApolloWithRouter, cleanup, waitForElement } from '../../utils/test-utils';
 import TrackCard from '../track-card';
 
 const mockTrackCardData = {
@@ -21,7 +21,7 @@ describe('Track Card', () => {
 
   it('renders track Card', async () => {
     const mocks = [];
-    const { getByText } = await renderApollo(
+    const { getByText } = await renderApolloWithRouter(
       <TrackCard track={mockTrackCardData} />,
       {
         mocks,

diff --git a/client/src/utils/test-utils.js b/client/src/utils/test-utils.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
+import { BrowserRouter } from 'react-router-dom'
 import '@testing-library/jest-dom/extend-expect';
 import { MockedProvider } from '@apollo/client/testing';
 
@@ -22,5 +23,13 @@ const renderApollo = (
   );
 };
 
+export const renderWithRouterGenerator = (renderer) => (node, options) => {
+  return renderer(<BrowserRouter>{node}</BrowserRouter>, options)
+}
+
+export const renderWithRouter = renderWithRouterGenerator(render)
+
+export const renderApolloWithRouter = renderWithRouterGenerator(renderApollo)
+
 export * from '@testing-library/react';
 export { renderApollo };
diff --git a/final/client/src/components/__tests__/module-detail.js b/final/client/src/components/__tests__/module-detail.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { render, cleanup } from '../../utils/test-utils';
+import { renderWithRouter, cleanup } from '../../utils/test-utils';
 import ModuleDetail from '../module-detail';
 
 const mockModule = {
@@ -41,6 +41,6 @@ describe('Module Detail View', () => {
   afterEach(cleanup);
 
   it('renders without error', () => {
-    render(<ModuleDetail module={mockModule} track={mockParentTrack} />);
+    renderWithRouter(<ModuleDetail module={mockModule} track={mockParentTrack} />);
   });
 });
diff --git a/final/client/src/components/__tests__/modules-navigation.js b/final/client/src/components/__tests__/modules-navigation.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { render, cleanup } from '../../utils/test-utils';
+import { renderWithRouter, cleanup } from '../../utils/test-utils';
 import ModuleNav from '../modules-navigation';
 
 const mockModule = {
@@ -41,6 +41,6 @@ describe('Modules Navigation View', () => {
   afterEach(cleanup);
 
   it('renders without error', () => {
-    render(<ModuleNav module={mockModule} track={mockParentTrack} />);
+    renderWithRouter(<ModuleNav module={mockModule} track={mockParentTrack} />);
   });
 });
diff --git a/final/client/src/components/__tests__/track-detail.js b/final/client/src/components/__tests__/track-detail.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { render, cleanup } from '../../utils/test-utils';
+import { renderWithRouter, cleanup } from '../../utils/test-utils';
 import TrackDetail from '../track-detail';
 
 const mockTrack = {
@@ -32,6 +32,6 @@ describe('Module Detail View', () => {
   afterEach(cleanup);
 
   it('renders without error', () => {
-    render(<TrackDetail {...mockTrack} />);
+    renderWithRouter(<TrackDetail {...mockTrack} />);
   });
 });
diff --git a/final/client/src/containers/__tests__/track-card.js b/final/client/src/containers/__tests__/track-card.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { renderApollo, cleanup, waitForElement } from '../../utils/test-utils';
+import { renderApolloWithRouter, cleanup, waitForElement } from '../../utils/test-utils';
 import TrackCard from '../track-card';
 
 const mockTrackCardData = {
@@ -21,7 +21,7 @@ describe('Track Card', () => {
 
   it('renders track Card', async () => {
     const mocks = [];
-    const { getByText } = await renderApollo(
+    const { getByText } = await renderApolloWithRouter(
       <TrackCard track={mockTrackCardData} />,
       {
         mocks,

diff --git a/final/client/src/utils/test-utils.js b/final/client/src/utils/test-utils.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
+import { BrowserRouter } from 'react-router-dom'
 import '@testing-library/jest-dom/extend-expect';
 import { MockedProvider } from '@apollo/client/testing';
 
@@ -22,5 +23,13 @@ const renderApollo = (
   );
 };
 
+export const renderWithRouterGenerator = (renderer) => (node, options) => {
+  return renderer(<BrowserRouter>{node}</BrowserRouter>, options)
+}
+
+export const renderWithRouter = renderWithRouterGenerator(render)
+
+export const renderApolloWithRouter = renderWithRouterGenerator(renderApollo)
+
 export * from '@testing-library/react';
 export { renderApollo };