fix: fix tests

open-craft · Jul 29, 2024 · c2c470c · c2c470c
1 parent 72a4ba3
commit c2c470c
Show file tree

Hide file tree

Showing 6 changed files with 57 additions and 50 deletions.
diff --git a/src/course-rerun/CourseRerun.test.jsx b/src/course-rerun/CourseRerun.test.jsx
@@ -26,13 +26,6 @@ jest.mock('react-redux', () => ({
   useSelector: jest.fn(),
 }));
 
-jest.mock('react-router-dom', () => ({
-  ...jest.requireActual('react-router-dom'),
-  useLocation: () => ({
-    pathname: mockPathname,
-  }),
-}));
-
 const RootWrapper = () => (
   <MemoryRouter>
     <AppProvider store={store} wrapWithRouter={false}>
@@ -77,17 +70,21 @@ describe('<CourseRerun />', () => {
 
   it('shows the spinner before the query is complete', async () => {
     useSelector.mockReturnValue({ organizationLoadingStatus: RequestStatus.IN_PROGRESS });
+    const { getByRole } = render(<RootWrapper />);
 
     await act(async () => {
-      const { getByRole } = render(<RootWrapper />);
-      const spinner = getByRole('status');
-      expect(spinner.textContent).toEqual('Loading...');
+      await waitFor(() => {
+        const spinner = getByRole('status');
+        expect(spinner.textContent).toEqual('Loading...');
+      });
     });
   });
 
-  it('should show footer', () => {
+  it('should show footer', async () => {
     const { getByText } = render(<RootWrapper />);
-    expect(getByText('Looking for help with Studio?')).toBeInTheDocument();
-    expect(getByText('LMS')).toHaveAttribute('href', process.env.LMS_BASE_URL);
+    await waitFor(() => {
+      expect(getByText('Looking for help with Studio?')).toBeInTheDocument();
+      expect(getByText('LMS')).toHaveAttribute('href', process.env.LMS_BASE_URL);
+    });
   });
 });
diff --git a/src/files-and-videos/videos-page/VideosPage.test.jsx b/src/files-and-videos/videos-page/VideosPage.test.jsx
@@ -270,7 +270,7 @@ describe('Videos page', () => {
         uploadSpy.mockResolvedValue(new Promise(() => {}));
 
         const addFilesButton = screen.getAllByLabelText('file-input')[3];
-        act(async () => {
+        await act(async () => {
           userEvent.upload(addFilesButton, file);
         });
         await waitFor(() => {

diff --git a/src/pages-and-resources/discussions/DiscussionsSettings.test.jsx b/src/pages-and-resources/discussions/DiscussionsSettings.test.jsx
@@ -155,7 +155,7 @@ describe('DiscussionsSettings', () => {
 
       expect(queryByTestId(container, 'appConfigForm')).toBeInTheDocument();
 
-      await act(() => userEvent.click(queryByText(container, appMessages.backButton.defaultMessage)));
+      act(() => userEvent.click(queryByText(container, appMessages.backButton.defaultMessage)));
 
       await waitFor(() => {
         expect(queryByTestId(container, 'appList')).toBeInTheDocument();
@@ -185,7 +185,7 @@ describe('DiscussionsSettings', () => {
       // content has been loaded - prior to proceeding with our expectations.
       await waitForElementToBeRemoved(screen.getByRole('status'));
 
-      act(async () => {
+      await act(async () => {
         userEvent.click(queryByLabelText(container, 'Select Piazza'));
 
         userEvent.click(getByRole(container, 'button', { name: 'Next' }));
@@ -210,11 +210,17 @@ describe('DiscussionsSettings', () => {
       // content has been loaded - prior to proceeding with our expectations.
       await waitForElementToBeRemoved(screen.getByRole('status'));
 
-      act(async () => {
-        userEvent.click(getByRole(container, 'checkbox', { name: 'Select Discourse' }));
-        userEvent.click(getByRole(container, 'button', { name: 'Next' }));
+      const discourseBox = getByRole(container, 'checkbox', { name: 'Select Discourse' });
+      expect(discourseBox).not.toBeDisabled();
+      userEvent.click(discourseBox);
+
+      userEvent.click(getByRole(container, 'button', { name: 'Next' }));
+
+      await waitFor(() => expect(screen.queryByRole('status')).toBeNull());
+
+      await act(async () => {
+        expect(await findByRole(container, 'heading', { name: 'Discourse' })).toBeInTheDocument();
 
-        await findByRole(container, 'button', { name: 'Save' });
         userEvent.type(getByRole(container, 'textbox', { name: 'Consumer Key' }), 'key');
         userEvent.type(getByRole(container, 'textbox', { name: 'Consumer Secret' }), 'secret');
         userEvent.type(getByRole(container, 'textbox', { name: 'Launch URL' }), 'http://example.test');
@@ -241,15 +247,15 @@ describe('DiscussionsSettings', () => {
 
       await waitFor(() => expect(screen.queryByRole('status')).toBeNull());
 
-      act(async () => {
+      await act(async () => {
         expect(await findByRole(container, 'heading', { name: 'Discourse' })).toBeInTheDocument();
 
         userEvent.type(getByRole(container, 'textbox', { name: 'Consumer Key' }), 'a');
         userEvent.type(getByRole(container, 'textbox', { name: 'Consumer Secret' }), 'secret');
         userEvent.type(getByRole(container, 'textbox', { name: 'Launch URL' }), 'http://example.test');
         userEvent.click(getByRole(container, 'button', { name: 'Save' }));
 
-        waitFor(() => expect(getByRole(container, 'dialog', { name: 'OK' })).toBeInTheDocument());
+        await waitFor(() => expect(getByRole(container, 'dialog', { name: 'OK' })).toBeInTheDocument());
         userEvent.click(getByRole(container, 'button', { name: 'Cancel' }));
 
         expect(queryByRole(container, 'dialog', { name: 'Confirm' })).not.toBeInTheDocument();
@@ -305,7 +311,7 @@ describe('DiscussionsSettings', () => {
       await waitForElementToBeRemoved(screen.getByRole('status'));
 
       // Apply causes an async action to take place
-      act(async () => {
+      await act(async () => {
         userEvent.click(queryByText(container, appMessages.saveButton.defaultMessage));
         await waitFor(() => expect(axiosMock.history.post.length).toBe(1));
 
@@ -350,13 +356,15 @@ describe('DiscussionsSettings', () => {
       // content has been loaded - prior to proceeding with our expectations.
       await waitForElementToBeRemoved(screen.getByRole('status'));
 
-      act(async () => {
+      await act(async () => {
         userEvent.click(getByRole(container, 'button', { name: 'Save' }));
 
         await waitFor(() => expect(axiosMock.history.post.length).toBe(1));
 
-        expect(queryByTestId(container, 'appList')).not.toBeInTheDocument();
-        expect(queryByTestId(container, 'appConfigForm')).not.toBeInTheDocument();
+        await waitFor(() => {
+          expect(queryByTestId(container, 'appList')).not.toBeInTheDocument();
+          expect(queryByTestId(container, 'appConfigForm')).not.toBeInTheDocument();
+        });
 
         // We don't technically leave the route in this case, though the modal is hidden.
         expect(window.location.pathname).toEqual(`/course/${courseId}/pages-and-resources/discussion/configure/piazza`);
@@ -406,12 +414,12 @@ describe.each([
     renderComponent(`/course/${courseId}/pages-and-resources/discussion`);
     // This is an important line that ensures the spinner has been removed - and thus our main
     // content has been loaded - prior to proceeding with our expectations.
-    waitForElementToBeRemoved(screen.getByRole('status'));
+    await waitForElementToBeRemoved(screen.getByRole('status'));
 
-    act(async () => {
+    await act(async () => {
       userEvent.click(await screen.findByLabelText('Select Piazza'));
       userEvent.click(queryByText(container, messages.nextButton.defaultMessage));
-      waitForElementToBeRemoved(screen.getByRole('status'));
+      await waitFor(() => waitForElementToBeRemoved(screen.getByRole('status')));
 
       if (showLTIConfig) {
         expect(queryByText(container, ltiMessages.formInstructions.defaultMessage)).toBeInTheDocument();
@@ -460,13 +468,13 @@ describe.each([
     renderComponent(`/course/${courseId}/pages-and-resources/discussion`);
     // This is an important line that ensures the spinner has been removed - and thus our main
     // content has been loaded - prior to proceeding with our expectations.
-    waitForElementToBeRemoved(screen.getByRole('status'));
+    await waitForElementToBeRemoved(screen.getByRole('status'));
 
-    act(async () => {
+    await act(async () => {
       userEvent.click(await screen.findByLabelText('Select Piazza'));
       userEvent.click(await screen.findByText(messages.nextButton.defaultMessage));
 
-      waitForElementToBeRemoved(screen.getByRole('status'));
+      await waitFor(() => waitForElementToBeRemoved(screen.getByRole('status')));
       if (enablePIISharing) {
         expect(queryByTestId(container, 'piiSharingFields')).toBeInTheDocument();
       } else {

diff --git a/src/studio-home/StudioHome.test.jsx b/src/studio-home/StudioHome.test.jsx
@@ -137,8 +137,8 @@ describe('<StudioHome />', async () => {
         userIsActive: true,
       });
 
-      await act(async () => {
-        const { getByRole } = render(<RootWrapper />);
+      const { getByRole } = render(<RootWrapper />);
+      await waitFor(() => {
         const spinner = getByRole('status');
         expect(spinner.textContent).toEqual('Loading...');
       });

diff --git a/src/studio-home/tabs-section/courses-tab/courses-filters/__snapshots__/index.test.jsx.snap b/src/studio-home/tabs-section/courses-tab/courses-filters/__snapshots__/index.test.jsx.snap
@@ -26,15 +26,19 @@ exports[`CoursesFilters snapshot 1`] = `
               search
             </span>
           </label>
-          <input
-            class="form-control"
-            id="pgn-searchfield-input-1"
-            name="searchfield-input"
-            placeholder="Search"
-            role="searchbox"
-            type="text"
-            value=""
-          />
+          <div
+            class="pgn__form-control-decorator-group"
+          >
+            <input
+              class="form-control"
+              id="pgn-searchfield-input-1"
+              name="searchfield-input"
+              placeholder="Search"
+              role="searchbox"
+              type="text"
+              value=""
+            />
+          </div>
           <button
             aria-label="submit search"
             class="btn-icon btn-icon-primary btn-icon-sm pgn__searchfield__iconbutton-submit"

diff --git a/src/taxonomy/TaxonomyListPage.test.jsx b/src/taxonomy/TaxonomyListPage.test.jsx
@@ -86,20 +86,18 @@ describe('<TaxonomyListPage />', () => {
   it('shows the spinner before the query is complete', async () => {
     // Simulate an API request that times out:
     axiosMock.onGet(listTaxonomiesUrl).reply(new Promise(() => {}));
-    await act(async () => {
-      const { getByRole } = render(<RootWrapper />);
+    const { getByRole } = render(<RootWrapper />);
+    await waitFor(() => {
       const spinner = getByRole('status');
       expect(spinner.textContent).toEqual('Loading');
     });
   });
 
   it('shows the data table after the query is complete', async () => {
     axiosMock.onGet(listTaxonomiesUrl).reply(200, { results: taxonomies, canAddTaxonomy: false });
-    await act(async () => {
-      const { getByTestId, queryByText } = render(<RootWrapper />);
-      await waitFor(() => { expect(queryByText('Loading')).toEqual(null); });
-      expect(getByTestId('taxonomy-card-1')).toBeInTheDocument();
-    });
+    const { getByTestId, queryByText } = render(<RootWrapper />);
+    await waitFor(() => { expect(queryByText('Loading')).toEqual(null); });
+    expect(getByTestId('taxonomy-card-1')).toBeInTheDocument();
   });
 
   it.each(['CSV', 'JSON'])('downloads the taxonomy template %s', async (fileFormat) => {