richie-education 2.25.0-b2.dev148 → 2.25.0-b2.dev152

package/js/widgets/LtiConsumer/index.spec.tsx

@@ -1,14 +1,12 @@
 import { type PropsWithChildren } from 'react';
-import { act, render, renderHook, waitFor } from '@testing-library/react';
-import { IntlProvider } from 'react-intl';
+import { act, renderHook, waitFor } from '@testing-library/react';
 import fetchMock from 'fetch-mock';
-import { QueryClient, QueryClientProvider, QueryObserverOptions } from '@tanstack/react-query';
+import { QueryObserverOptions } from '@tanstack/react-query';
 import {
   RichieContextFactory as mockRichieContextFactory,
   UserFactory,
 } from 'utils/test/factories/richie';
 import { Deferred } from 'utils/test/deferred';
-import BaseSessionProvider from 'contexts/SessionContext/BaseSessionProvider';
 import { RICHIE_LTI_ANONYMOUS_USER_ID_CACHE_KEY } from 'settings';
 import { handle } from 'utils/errors/handle';
 import { resolveAll } from 'utils/resolveAll';
@@ -16,6 +14,8 @@ import { createTestQueryClient } from 'utils/test/createTestQueryClient';
 import { noop } from 'utils';
 import { useSession } from 'contexts/SessionContext';
 import { HttpError, HttpStatusCode } from 'utils/errors/HttpError';
+import { render } from 'utils/test/render';
+import { BaseAppWrapper } from 'utils/test/wrappers/BaseAppWrapper';
 import {
   LtiConsumerContentParameters,
   LtiConsumerContext,
@@ -35,8 +35,6 @@ jest.mock('uuid', () => ({
 
 describe('widgets/LtiConsumer', () => {
   afterEach(() => {
-    fetchMock.restore();
-    jest.resetAllMocks();
     sessionStorage.clear();
     delete window.CMS;
   });
@@ -55,13 +53,13 @@ describe('widgets/LtiConsumer', () => {
   });
   HTMLFormElement.prototype.submit = mockSubmit;
 
-  const Wrapper = ({ client, children }: PropsWithChildren<{ client: QueryClient }>) => (
-    <IntlProvider locale="en">
-      <QueryClientProvider client={client}>
-        <BaseSessionProvider>{children}</BaseSessionProvider>
-      </QueryClientProvider>
-    </IntlProvider>
-  );
+  // const Wrapper = ({ client, children }: PropsWithChildren<{ client: QueryClient }>) => (
+  //   <IntlProvider locale="en">
+  //     <QueryClientProvider client={client}>
+  //       <BaseSessionProvider>{children}</BaseSessionProvider>
+  //     </QueryClientProvider>
+  //   </IntlProvider>
+  // );
 
   it('renders an auto-resized iframe with a LTI content', async () => {
     const contentParameters = {
@@ -96,11 +94,10 @@ describe('widgets/LtiConsumer', () => {
       ltiContextDeferred.promise,
     );
 
-    const { container } = render(
-      <Wrapper client={createTestQueryClient({ user: null })}>
-        <LtiConsumer {...ltiConsumerProps} />
-      </Wrapper>,
-    );
+    const { container } = render(<LtiConsumer {...ltiConsumerProps} />, {
+      wrapper: BaseAppWrapper,
+      queryOptions: { client: createTestQueryClient({ user: null }) },
+    });
 
     await act(async () => ltiContextDeferred.resolve(ltiContextResponse));
 
@@ -163,11 +160,10 @@ describe('widgets/LtiConsumer', () => {
       ltiContextDeferred.promise,
     );
 
-    const { container } = render(
-      <Wrapper client={createTestQueryClient({ user: null })}>
-        <LtiConsumer {...ltiConsumerProps} />
-      </Wrapper>,
-    );
+    const { container } = render(<LtiConsumer {...ltiConsumerProps} />, {
+      wrapper: BaseAppWrapper,
+      queryOptions: { client: createTestQueryClient({ user: null }) },
+    });
 
     await act(async () => ltiContextDeferred.resolve(ltiContextResponse));
 
@@ -205,11 +201,10 @@ describe('widgets/LtiConsumer', () => {
       HttpStatusCode.INTERNAL_SERVER_ERROR,
     );
 
-    const { container } = render(
-      <Wrapper client={createTestQueryClient({ user: null })}>
-        <LtiConsumer {...ltiConsumerProps} />
-      </Wrapper>,
-    );
+    const { container } = render(<LtiConsumer {...ltiConsumerProps} />, {
+      wrapper: BaseAppWrapper,
+      queryOptions: { client: createTestQueryClient({ user: null }) },
+    });
 
     await waitFor(() =>
       expect(mockHandle).toHaveBeenCalledWith(new HttpError(500, 'Internal Server Error')),
@@ -233,15 +228,14 @@ describe('widgets/LtiConsumer', () => {
       },
     });
 
-    render(
-      <Wrapper
-        client={createTestQueryClient({
+    render(<LtiConsumer id={1337} />, {
+      wrapper: BaseAppWrapper,
+      queryOptions: {
+        client: createTestQueryClient({
           user: { username: 'johndoe', email: 'johndoe@example.com' },
-        })}
-      >
-        <LtiConsumer id={1337} />
-      </Wrapper>,
-    );
+        }),
+      },
+    });
 
     expect(fetchMock.calls()).toHaveLength(1);
     expect(
@@ -265,11 +259,14 @@ describe('widgets/LtiConsumer', () => {
       ltiContextDeferred.promise,
     );
 
-    render(
-      <Wrapper client={createTestQueryClient({ user: null })}>
-        <LtiConsumer id={1337} />
-      </Wrapper>,
-    );
+    render(<LtiConsumer id={1337} />, {
+      wrapper: BaseAppWrapper,
+      queryOptions: {
+        client: createTestQueryClient({
+          user: null,
+        }),
+      },
+    });
 
     expect(fetchMock.calls()).toHaveLength(1);
     expect(
@@ -300,11 +297,12 @@ describe('widgets/LtiConsumer', () => {
     );
     const client = createTestQueryClient({ user: null });
 
-    render(
-      <Wrapper client={client}>
-        <LtiConsumer id={1337} />
-      </Wrapper>,
-    );
+    render(<LtiConsumer id={1337} />, {
+      wrapper: BaseAppWrapper,
+      queryOptions: {
+        client,
+      },
+    });
 
     await act(async () =>
       ltiContextDeferred.resolve({
@@ -368,10 +366,10 @@ describe('widgets/LtiConsumer', () => {
 
     const { result } = renderHook(useSession, {
       wrapper: ({ children }: PropsWithChildren) => (
-        <Wrapper client={client}>
+        <BaseAppWrapper queryOptions={{ client }}>
           <LtiConsumer id={1337} />
           {children}
-        </Wrapper>
+        </BaseAppWrapper>
       ),
     });
 

package/js/widgets/RootSearchSuggestField/index.spec.tsx

@@ -1,10 +1,11 @@
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { fireEvent, screen, waitFor } from '@testing-library/react';
 import fetchMock from 'fetch-mock';
 import { IntlProvider } from 'react-intl';
 
 import { location } from 'utils/indirection/window';
 import { RichieContextFactory as mockRichieContextFactory } from 'utils/test/factories/richie';
 import context from 'utils/context';
+import { render } from 'utils/test/render';
 import RootSearchSuggestField from '.';
 
 jest.mock('settings', () => ({
@@ -33,11 +34,6 @@ describe('<RootSearchSuggestField />', () => {
     values: [],
   };
 
-  afterEach(() => {
-    fetchMock.restore();
-    jest.resetAllMocks();
-  });
-
   it('renders', () => {
     fetchMock.get('/api/v1.0/filter-definitions/', {
       subjects,
@@ -47,6 +43,7 @@ describe('<RootSearchSuggestField />', () => {
       <IntlProvider locale="en">
         <RootSearchSuggestField courseSearchPageUrl="/en/courses/" context={context} />
       </IntlProvider>,
+      { wrapper: null },
     );
 
     // The placeholder text is shown in the input
@@ -74,6 +71,7 @@ describe('<RootSearchSuggestField />', () => {
       <IntlProvider locale="en">
         <RootSearchSuggestField courseSearchPageUrl="/en/courses/" context={context} />
       </IntlProvider>,
+      { wrapper: null },
     );
 
     const field = screen.getByPlaceholderText('Search for courses');
@@ -118,6 +116,7 @@ describe('<RootSearchSuggestField />', () => {
       <IntlProvider locale="en">
         <RootSearchSuggestField courseSearchPageUrl="/en/courses/" context={context} />
       </IntlProvider>,
+      { wrapper: null },
     );
 
     const field = screen.getByPlaceholderText('Search for courses');
@@ -158,6 +157,7 @@ describe('<RootSearchSuggestField />', () => {
       <IntlProvider locale="en">
         <RootSearchSuggestField courseSearchPageUrl="/en/courses/" context={context} />
       </IntlProvider>,
+      { wrapper: null },
     );
 
     const field = screen.getByPlaceholderText('Search for courses');
@@ -195,6 +195,7 @@ describe('<RootSearchSuggestField />', () => {
       <IntlProvider locale="en">
         <RootSearchSuggestField courseSearchPageUrl="/en/courses/" context={context} />
       </IntlProvider>,
+      { wrapper: null },
     );
 
     const field = screen.getByPlaceholderText('Search for courses');
@@ -231,6 +232,7 @@ describe('<RootSearchSuggestField />', () => {
       <IntlProvider locale="en">
         <RootSearchSuggestField courseSearchPageUrl="/en/courses/" context={context} />
       </IntlProvider>,
+      { wrapper: null },
     );
 
     const field = screen.getByPlaceholderText('Search for courses');

package/js/widgets/Search/components/PaginateCourseSearch/index.spec.tsx

@@ -1,8 +1,9 @@
-import { fireEvent, render, screen } from '@testing-library/react';
+import { fireEvent, screen } from '@testing-library/react';
 import queryString from 'query-string';
 import { IntlProvider } from 'react-intl';
 
 import { History, HistoryContext } from 'hooks/useHistory';
+import { render } from 'utils/test/render';
 import { PaginateCourseSearch } from '.';
 
 describe('<PaginateCourseSearch />', () => {
@@ -18,8 +19,6 @@ describe('<PaginateCourseSearch />', () => {
     historyReplaceState,
   ];
 
-  beforeEach(jest.resetAllMocks);
-
   it('shows a pagination for course search (when on page 1)', () => {
     render(
       <IntlProvider locale="en">
@@ -27,6 +26,7 @@ describe('<PaginateCourseSearch />', () => {
           <PaginateCourseSearch courseSearchTotalCount={200} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     screen.getByRole('navigation', { name: 'Pagination' });
@@ -49,6 +49,7 @@ describe('<PaginateCourseSearch />', () => {
           <PaginateCourseSearch courseSearchTotalCount={211} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     screen.getByRole('navigation', { name: 'Pagination' });
@@ -71,6 +72,7 @@ describe('<PaginateCourseSearch />', () => {
           <PaginateCourseSearch courseSearchTotalCount={40} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
     expect(screen.queryByRole('button')).toBeNull();
     const nextPageAnchor = screen.getByRole('link');
@@ -84,6 +86,7 @@ describe('<PaginateCourseSearch />', () => {
           <PaginateCourseSearch courseSearchTotalCount={345} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     screen.getByRole('navigation', { name: 'Pagination' });
@@ -113,6 +116,7 @@ describe('<PaginateCourseSearch />', () => {
           <PaginateCourseSearch courseSearchTotalCount={101} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     screen.getByRole('navigation', { name: 'Pagination' });
@@ -141,6 +145,7 @@ describe('<PaginateCourseSearch />', () => {
           <PaginateCourseSearch courseSearchTotalCount={14} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     expect(screen.queryByRole('pagination', { name: 'Pagination' })).toEqual(null);
@@ -153,6 +158,7 @@ describe('<PaginateCourseSearch />', () => {
           <PaginateCourseSearch courseSearchTotalCount={200} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     screen.getByRole('navigation', { name: 'Pagination' });
@@ -183,6 +189,7 @@ describe('<PaginateCourseSearch />', () => {
           <PaginateCourseSearch courseSearchTotalCount={200} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     screen.getByRole('navigation', { name: 'Pagination' });

package/js/widgets/Search/components/SearchFilterGroup/index.spec.tsx

@@ -1,8 +1,9 @@
-import { render, screen } from '@testing-library/react';
+import { screen } from '@testing-library/react';
 import queryString from 'query-string';
 import { IntlProvider } from 'react-intl';
 
 import { History, HistoryContext } from 'hooks/useHistory';
+import { render } from 'utils/test/render';
 import { SearchFilterGroup } from '.';
 
 jest.mock('../SearchFilterValueLeaf', () => ({
@@ -52,8 +53,6 @@ describe('widgets/Search/components/SearchFilterGroup', () => {
     ],
   };
 
-  beforeEach(jest.resetAllMocks);
-
   it('renders the name of the filter with the values as SearchFilters', () => {
     render(
       <IntlProvider locale="en">
@@ -61,6 +60,7 @@ describe('widgets/Search/components/SearchFilterGroup', () => {
           <SearchFilterGroup filter={filter} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
     // The filter group title and all filters are shown
     screen.getByRole('group', { name: 'Organizations' });
@@ -76,6 +76,7 @@ describe('widgets/Search/components/SearchFilterGroup', () => {
           <SearchFilterGroup filter={{ ...filter, is_searchable: false }} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     expect(screen.queryByRole('button', { name: 'More options' })).toEqual(null);
@@ -88,6 +89,7 @@ describe('widgets/Search/components/SearchFilterGroup', () => {
           <SearchFilterGroup filter={{ ...filter, has_more_values: false }} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     expect(screen.queryByRole('button', { name: 'More options' })).toEqual(null);

package/js/widgets/Search/components/SearchFilterGroupModal/index.spec.tsx

@@ -1,4 +1,4 @@
-import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { act, fireEvent, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import fetchMock from 'fetch-mock';
 import { range } from 'lodash-es';
@@ -9,6 +9,7 @@ import { History, HistoryContext } from 'hooks/useHistory';
 import { Deferred } from 'utils/test/deferred';
 import { resolveAll } from 'utils/resolveAll';
 import { createTestQueryClient } from 'utils/test/createTestQueryClient';
+import { render } from 'utils/test/render';
 import { SearchFilterGroupModal } from '.';
 
 jest.mock('utils/errors/handle', () => ({ handle: jest.fn() }));
@@ -61,9 +62,6 @@ describe('<SearchFilterGroupModal />', () => {
     historyReplaceState,
   ];
 
-  beforeEach(() => fetchMock.restore());
-  beforeEach(jest.resetAllMocks);
-
   it('renders a button with a modal to search values for a given filter', async () => {
     {
       const universitiesDeferred = new Deferred();
@@ -83,6 +81,7 @@ describe('<SearchFilterGroupModal />', () => {
             </QueryClientProvider>
           </HistoryContext.Provider>
         </IntlProvider>,
+        { wrapper: null },
       );
 
       // The modal is not rendered
@@ -242,6 +241,7 @@ describe('<SearchFilterGroupModal />', () => {
             </QueryClientProvider>
           </HistoryContext.Provider>
         </IntlProvider>,
+        { wrapper: null },
       );
 
       // The modal is rendered
@@ -419,6 +419,7 @@ describe('<SearchFilterGroupModal />', () => {
           </QueryClientProvider>
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     // The modal is not rendered
@@ -477,6 +478,7 @@ describe('<SearchFilterGroupModal />', () => {
           </QueryClientProvider>
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     // The modal is not rendered
@@ -559,6 +561,7 @@ describe('<SearchFilterGroupModal />', () => {
           </QueryClientProvider>
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     // The modal is not rendered
@@ -592,6 +595,7 @@ describe('<SearchFilterGroupModal />', () => {
           </QueryClientProvider>
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     // The modal is not rendered

package/js/widgets/Search/components/SearchFilterValueLeaf/index.spec.tsx

@@ -1,8 +1,9 @@
-import { fireEvent, render } from '@testing-library/react';
+import { fireEvent } from '@testing-library/react';
 import queryString from 'query-string';
 import { IntlProvider } from 'react-intl';
 
 import { History, HistoryContext } from 'hooks/useHistory';
+import { render } from 'utils/test/render';
 import { SearchFilterValueLeaf } from '.';
 
 describe('widgets/Search/components/SearchFilterValueLeaf', () => {
@@ -18,8 +19,6 @@ describe('widgets/Search/components/SearchFilterValueLeaf', () => {
     historyReplaceState,
   ];
 
-  beforeEach(jest.resetAllMocks);
-
   it('renders the name of the filter value', () => {
     const { getByLabelText } = render(
       <IntlProvider locale="en">
@@ -43,6 +42,7 @@ describe('widgets/Search/components/SearchFilterValueLeaf', () => {
           />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     // The filter value is displayed with its facet count
@@ -82,6 +82,7 @@ describe('widgets/Search/components/SearchFilterValueLeaf', () => {
           />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     // The filter shows its active state
@@ -113,6 +114,7 @@ describe('widgets/Search/components/SearchFilterValueLeaf', () => {
           />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     // The filter shows its active state
@@ -145,6 +147,7 @@ describe('widgets/Search/components/SearchFilterValueLeaf', () => {
           />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     fireEvent.click(getByLabelText((content) => content.includes('Human name')));
@@ -190,6 +193,7 @@ describe('widgets/Search/components/SearchFilterValueLeaf', () => {
           />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     fireEvent.click(getByLabelText((content) => content.includes('Human name')));

package/js/widgets/Search/components/SearchFilterValueParent/index.spec.tsx

@@ -1,4 +1,4 @@
-import { fireEvent, render, screen } from '@testing-library/react';
+import { fireEvent, screen } from '@testing-library/react';
 import queryString from 'query-string';
 import { IntlProvider } from 'react-intl';
 import { QueryClientProvider } from '@tanstack/react-query';
@@ -6,6 +6,7 @@ import { QueryClientProvider } from '@tanstack/react-query';
 import { History, HistoryContext } from 'hooks/useHistory';
 import { APIListRequestParams } from 'types/api';
 import { createTestQueryClient } from 'utils/test/createTestQueryClient';
+import { render } from 'utils/test/render';
 import { fetchList } from '../../utils/getResourceList';
 import { RequestStatus } from '../../types/api';
 
@@ -31,10 +32,6 @@ describe('<SearchFilterValueParent />', () => {
     historyReplaceState,
   ];
 
-  afterEach(() => {
-    jest.resetAllMocks();
-  });
-
   it('renders the parent filter value and a button to show the children', () => {
     const { getByLabelText, queryByLabelText } = render(
       <QueryClientProvider client={createTestQueryClient()}>
@@ -60,6 +57,7 @@ describe('<SearchFilterValueParent />', () => {
           </HistoryContext.Provider>
         </IntlProvider>
       </QueryClientProvider>,
+      { wrapper: null },
     );
 
     getByLabelText((content) => content.startsWith('Literature'));
@@ -122,13 +120,14 @@ describe('<SearchFilterValueParent />', () => {
     );
     const { getByLabelText, queryByLabelText, rerender } = render(
       getElement({ limit: '999', offset: '0', subjects: [] }),
+      { wrapper: null },
     );
 
     // Children filters are not shown
     getByLabelText((content) => content.startsWith('Literature'));
     expect(queryByLabelText('Hide additional filters for Literature')).toEqual(null);
-    queryByLabelText((content) => content.startsWith('Classical Literature'));
-    queryByLabelText((content) => content.startsWith('Modern Literature'));
+    expect(queryByLabelText((content) => content.startsWith('Classical Literature'))).toEqual(null);
+    expect(queryByLabelText((content) => content.startsWith('Modern Literature'))).toEqual(null);
 
     // The params are updated, now include a child filter of Literature
     rerender(getElement({ limit: '999', offset: '0', subjects: ['L-000400050004'] }));
@@ -194,6 +193,7 @@ describe('<SearchFilterValueParent />', () => {
           </HistoryContext.Provider>
         </IntlProvider>
       </QueryClientProvider>,
+      { wrapper: null },
     );
 
     getByLabelText((content) => content.startsWith('Literature'));
@@ -268,6 +268,7 @@ describe('<SearchFilterValueParent />', () => {
           </HistoryContext.Provider>
         </IntlProvider>
       </QueryClientProvider>,
+      { wrapper: null },
     );
 
     // The filter value is displayed with its facet count
@@ -303,6 +304,7 @@ describe('<SearchFilterValueParent />', () => {
           </HistoryContext.Provider>
         </IntlProvider>
       </QueryClientProvider>,
+      { wrapper: null },
     );
 
     // The filter shows its active state
@@ -342,6 +344,7 @@ describe('<SearchFilterValueParent />', () => {
           </HistoryContext.Provider>
         </IntlProvider>
       </QueryClientProvider>,
+      { wrapper: null },
     );
 
     const checkbox = getByLabelText((content) => content.startsWith('Human name'));
@@ -375,6 +378,7 @@ describe('<SearchFilterValueParent />', () => {
           </HistoryContext.Provider>
         </IntlProvider>
       </QueryClientProvider>,
+      { wrapper: null },
     );
 
     fireEvent.click(getByLabelText((content) => content.startsWith('Human name')));
@@ -422,6 +426,7 @@ describe('<SearchFilterValueParent />', () => {
           </HistoryContext.Provider>
         </IntlProvider>
       </QueryClientProvider>,
+      { wrapper: null },
     );
 
     fireEvent.click(getByLabelText((content) => content.startsWith('Human name')));

package/js/widgets/Search/components/SearchFiltersPane/index.spec.tsx

@@ -1,8 +1,9 @@
-import { fireEvent, render } from '@testing-library/react';
+import { fireEvent } from '@testing-library/react';
 import queryString from 'query-string';
 import { IntlProvider } from 'react-intl';
 
 import { History, HistoryContext } from 'hooks/useHistory';
+import { render } from 'utils/test/render';
 import { SearchFiltersPane } from '.';
 
 jest.mock('../SearchFilterGroup', () => ({
@@ -68,6 +69,7 @@ describe('widgets/Search/components/SearchFiltersPane', () => {
           />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     // The pane's title is shown along with filter groups in the order defined by their position
@@ -87,6 +89,7 @@ describe('widgets/Search/components/SearchFiltersPane', () => {
           <SearchFiltersPane filters={null} />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
     getByText('Filter courses');
   });
@@ -140,6 +143,7 @@ describe('widgets/Search/components/SearchFiltersPane', () => {
           />
         </HistoryContext.Provider>
       </IntlProvider>,
+      { wrapper: null },
     );
 
     const clearButton = getByText('Clear 2 active filters');

package/js/widgets/Search/hooks/useCourseSearch/index.spec.tsx

@@ -1,11 +1,9 @@
 import { act, renderHook, waitFor } from '@testing-library/react';
-import { PropsWithChildren } from 'react';
-import { IntlProvider } from 'react-intl';
-import { QueryClientProvider } from '@tanstack/react-query';
 
+import { PropsWithChildren } from 'react';
 import { APIListRequestParams } from 'types/api';
 import { Deferred } from 'utils/test/deferred';
-import { createTestQueryClient } from 'utils/test/createTestQueryClient';
+import { ReactQueryAppWrapper } from 'utils/test/wrappers/ReactQueryAppWrapper';
 import { fetchList } from '../../utils/getResourceList';
 import { useCourseSearch } from '.';
 
@@ -17,16 +15,10 @@ const mockFetchList = fetchList as jest.MockedFunction<typeof fetchList>;
 
 describe('widgets/Search/hooks/useCourseSearch', () => {
   let locale: string;
-  const wrapper = ({ children }: PropsWithChildren<any>) => (
-    <IntlProvider locale={locale || 'en'}>
-      <QueryClientProvider client={createTestQueryClient()}>{children}</QueryClientProvider>
-    </IntlProvider>
+  const wrapper = ({ children }: PropsWithChildren) => (
+    <ReactQueryAppWrapper intlOptions={{ locale }}>{children}</ReactQueryAppWrapper>
   );
 
-  afterEach(() => {
-    jest.resetAllMocks();
-  });
-
   it('gets the courses with the passed params', async () => {
     const deferred = new Deferred<any>();
     let params: APIListRequestParams = { limit: '999', offset: '0' };

package/js/widgets/Search/hooks/useFilterValue/index.spec.tsx

@@ -24,8 +24,6 @@ describe('widgets/Search/hooks/useFilterValue', () => {
       <HistoryContext.Provider value={history}>{children}</HistoryContext.Provider>
     );
 
-  beforeEach(jest.resetAllMocks);
-
   it('returns the active [false] status of the filter value and a function to toggle it', () => {
     const props: [FacetedFilterDefinition, FilterValue] = [
       // filter: FacetedFilterDefinition