test: fix test code improperly using/missing 'await'

Author: bradenmacdonald

plugins/course-apps/ora_settings/Settings.test.jsx

@@ -128,7 +128,7 @@ describe('ORASettings', () => {
     renderComponent();
     await mockStore({ apiStatus: 200, enabled: true });
 
-    waitFor(() => {
+    await waitFor(() => {
       const label = screen.getByText(messages.enableFlexPeerGradeLabel.defaultMessage);
       const enableBadge = screen.getByTestId('enable-badge');
 

src/course-outline/OutlineAddChildButtons.test.tsx

@@ -33,10 +33,10 @@ jest.mock('react-redux', () => ({
       expect(newBtn).toBeInTheDocument();
       const useBtn = await screen.findByRole('button', { name: `Use ${containerType} from library` });
       expect(useBtn).toBeInTheDocument();
-      userEvent.click(newBtn);
-      waitFor(() => expect(newClickHandler).toHaveBeenCalled());
-      userEvent.click(useBtn);
-      waitFor(() => expect(useFromLibClickHandler).toHaveBeenCalled());
+      await userEvent.click(newBtn);
+      await waitFor(() => expect(newClickHandler).toHaveBeenCalled());
+      await userEvent.click(useBtn);
+      await waitFor(() => expect(useFromLibClickHandler).toHaveBeenCalled());
     });
   });
 });

src/custom-pages/CustomPages.test.jsx

@@ -100,7 +100,7 @@ describe('CustomPages', () => {
   it('should update page order on drag', async () => {
     renderComponent();
     await mockStore(RequestStatus.SUCCESSFUL);
-    const buttons = await screen.queryAllByRole('button');
+    const buttons = screen.queryAllByRole('button');
     const draggableButton = buttons[9];
     expect(draggableButton).toBeVisible();
     await act(async () => {

src/editors/data/services/cms/api.test.ts

@@ -470,9 +470,9 @@ describe('cms api', () => {
       });
     });
     describe('transcript get', () => {
-      it('should call get with urls.videoTranscripts and transcript data', () => {
+      it('should call get with urls.videoTranscripts and transcript data', async () => {
         const mockJSON = { data: { lang: language, edx_video_id: videoId } };
-        apiMethods.getTranscript({
+        await apiMethods.getTranscript({
           blockId,
           studioEndpointUrl,
           videoId,

src/files-and-videos/videos-page/info-sidebar/TranscriptTab.test.jsx

@@ -196,7 +196,7 @@ describe('TranscriptTab', () => {
         axiosMock.onDelete(`${getApiBaseUrl()}/transcript_delete/${courseId}/mOckID0/ar`).reply(204);
         await act(async () => {
           fireEvent.click(confirmButton);
-          executeThunk(deleteVideoTranscript({
+          await executeThunk(deleteVideoTranscript({
             language: 'ar',
             videoId: updatedProps.id,
             transcripts: updatedProps.transcripts,
@@ -215,7 +215,7 @@ describe('TranscriptTab', () => {
         axiosMock.onDelete(`${getApiBaseUrl()}/transcript_delete/${courseId}/mOckID0/ar`).reply(404);
         await act(async () => {
           fireEvent.click(confirmButton);
-          executeThunk(deleteVideoTranscript({
+          await executeThunk(deleteVideoTranscript({
             language: 'ar',
             videoId: updatedProps.id,
             transcripts: updatedProps.transcripts,

src/generic/course-upload-image/CourseUploadImage.test.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { AppProvider } from '@edx/frontend-platform/react';
-import { fireEvent, render, act } from '@testing-library/react';
+import { fireEvent, render } from '@testing-library/react';
 import { initializeMockApp } from '@edx/frontend-platform';
 import { IntlProvider } from '@edx/frontend-platform/i18n';
 
@@ -57,9 +57,7 @@ describe('<CourseUploadImage />', () => {
   it('should call onChange if input value changed', async () => {
     const { getByPlaceholderText } = render(<RootWrapper {...props} />);
     const input = getByPlaceholderText(props.customInputPlaceholder);
-    await act(() => {
-      fireEvent.change(input, { target: { value: '/assets' } });
-    });
+    fireEvent.change(input, { target: { value: '/assets' } });
     expect(onChangeMock).toHaveBeenCalledWith(
       '/assets',
       props.assetImageField,

src/library-authoring/containers/ContainerCard.test.tsx

@@ -486,7 +486,7 @@ describe('<ContainerCard />', () => {
     // Click on Copy Item
     const copyMenuItem = screen.getByRole('button', { name: 'Copy to clipboard' });
     expect(copyMenuItem).toBeInTheDocument();
-    user.click(copyMenuItem);
+    await user.click(copyMenuItem);
 
     await waitFor(() => {
       expect(axiosMock.history.post.length).toBe(1);

src/library-authoring/containers/ContainerInfo.test.tsx

@@ -211,7 +211,7 @@ let mockShowToast: { (message: string, action?: ToastActionData | undefined): vo
       // Click on Copy Item
       const copyMenuItem = await screen.findByRole('button', { name: 'Copy to clipboard' });
       expect(copyMenuItem).toBeInTheDocument();
-      user.click(copyMenuItem);
+      await user.click(copyMenuItem);
 
       await waitFor(() => {
         expect(axiosMock.history.post.length).toBe(1);

src/pages-and-resources/pages/PageCard.test.jsx

@@ -60,15 +60,15 @@ describe('LiveSettings', () => {
 
   it('should render three cards', async () => {
     renderComponent();
-    waitFor(() => {
+    await waitFor(() => {
       expect(screen.queryAllByRole(container, 'button')).toHaveLength(3);
     });
   });
 
   it('should navigate to legacyLink', async () => {
     renderComponent();
     const textbookPagePath = mockPageConfig[0][1];
-    waitFor(() => {
+    await waitFor(() => {
       const textbookSettingsButton = screen.queryAllByRole(container, 'link')[1];
       expect(textbookSettingsButton).toHaveAttribute('href', textbookPagePath);
     });

src/schedule-and-details/details-section/DetailsSection.test.jsx

@@ -32,7 +32,7 @@ describe('<DetailsSection />', () => {
     ).toBeInTheDocument();
   });
 
-  it('should call onChange if dropdown value changed', () => {
+  it('should call onChange if dropdown value changed', async () => {
     const { getByRole } = render(<RootWrapper {...props} />);
     const option = getByRole('button', {
       name: courseSettingsMock.languageOptions[1][1],
@@ -42,7 +42,7 @@ describe('<DetailsSection />', () => {
       name: courseSettingsMock.languageOptions[0][1],
     });
 
-    waitFor(() => expect(anotherOption));
+    await waitFor(() => expect(anotherOption));
     fireEvent.click(anotherOption);
     expect(onChangeMock).toHaveBeenCalledWith(
       courseSettingsMock.languageOptions[0][0],