Deprecate react-unit-test-utils and cleanup

package.json

@@ -14,7 +14,6 @@
     "i18n_extract": "fedx-scripts formatjs extract",
     "lint": "fedx-scripts eslint --ext .js --ext .jsx .",
     "lint:fix": "fedx-scripts eslint --fix --ext .js --ext .jsx .",
-    "snapshot": "fedx-scripts jest --updateSnapshot",
     "start": "fedx-scripts webpack-dev-server --progress",
     "test": "fedx-scripts jest --coverage --passWithNoTests",
     "test:debug": "node --inspect-brk node_modules/.bin/fedx-scripts jest --runInBand --watch"
@@ -38,7 +37,6 @@
     "@edx/frontend-lib-special-exams": "^3.4.0",
     "@edx/frontend-platform": "8.5.1",
     "@edx/openedx-atlas": "^0.7.0",
-    "@edx/react-unit-test-utils": "^4.0.0",
     "@edx/tinymce-language-selector": "1.1.0",
     "@fortawesome/fontawesome-svg-core": "1.2.36",
     "@fortawesome/free-brands-svg-icons": "5.15.4",

src/App.test.jsx

@@ -1,18 +1,12 @@
-import React from 'react';
 import { render, screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import { IntlProvider } from '@edx/frontend-platform/i18n';
 import { MemoryRouter } from 'react-router-dom';
 import { useHandleModalCloseEvent } from 'hooks/modal';
 
 import App from './App';
-
 /* eslint-disable react/prop-types */
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 jest.mock('hooks/modal', () => ({
   useHandleModalCloseEvent: jest.fn(),
 }));

src/components/ActionButton.test.jsx

@@ -3,10 +3,6 @@ import '@testing-library/jest-dom';
 
 import ActionButton from './ActionButton';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 describe('<ActionButton />', () => {
   const props = {
     state: 'arbitraryState',

src/components/AppContainer/index.test.jsx

@@ -1,20 +1,14 @@
-import { render, screen } from '@testing-library/react';
+import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
-import { IntlProvider } from '@edx/frontend-platform/i18n';
-
 import {
   useIsPageDataLoaded,
   useIsORAConfigLoaded,
   usePageDataError,
   useORAConfigDataError,
 } from 'hooks/app';
-
+import { renderWithIntl } from '../../testUtils';
 import AppContainer from '.';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 jest.mock('@edx/frontend-platform/i18n', () => ({
   ...jest.requireActual('@edx/frontend-platform/i18n'),
   getLocale: jest.fn().mockReturnValue('en'),
@@ -39,8 +33,6 @@ describe('<AppContainer />', () => {
     children: <div>Test children content</div>,
   };
 
-  const renderWithIntl = (component) => render(<IntlProvider locale="en">{component}</IntlProvider>);
-
   beforeEach(() => {
     useIsPageDataLoaded.mockReturnValue(true);
     useIsORAConfigLoaded.mockReturnValue(true);

src/components/Assessment/EditableAssessment/AssessmentActions.test.jsx

@@ -1,14 +1,10 @@
-import { render, screen } from '@testing-library/react';
+import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import { useExitWithoutSavingAction, useSubmitAssessmentAction } from 'hooks/actions';
-import { IntlProvider } from '@edx/frontend-platform/i18n';
 import userEvent from '@testing-library/user-event';
+import { renderWithIntl } from 'testUtils';
 import AssessmentActions from './AssessmentActions';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 jest.mock('hooks/actions', () => ({
   useExitWithoutSavingAction: jest.fn(),
   useSubmitAssessmentAction: jest.fn(),
@@ -55,7 +51,7 @@ describe('AssessmentActions', () => {
   });
 
   it('renders both action buttons and confirm dialogs', () => {
-    render(<IntlProvider locale="en"><AssessmentActions /></IntlProvider>);
+    renderWithIntl(<AssessmentActions />);
     const exitWithoutSavingButton = screen.getByText('Exit without saving');
     expect(exitWithoutSavingButton).toBeInTheDocument();
 
@@ -97,7 +93,7 @@ describe('AssessmentActions', () => {
       },
     });
 
-    render(<IntlProvider locale="en"><AssessmentActions /></IntlProvider>);
+    renderWithIntl(<AssessmentActions />);
 
     const confirmDialogExit = screen.getByLabelText('mock exit title');
     expect(confirmDialogExit).toBeInTheDocument();
@@ -111,13 +107,13 @@ describe('AssessmentActions', () => {
       action: null,
       confirmProps: null,
     });
-    render(<IntlProvider locale="en"><AssessmentActions /></IntlProvider>);
+    renderWithIntl(<AssessmentActions />);
     expect(screen.queryByText(/Submit assessment/)).toBeNull();
   });
 
   it('calls the correct handlers when buttons are clicked', async () => {
     const user = userEvent.setup();
-    render(<IntlProvider locale="en"><AssessmentActions /></IntlProvider>);
+    renderWithIntl(<AssessmentActions />);
     const submitAssessmentButton = screen.getByText('Submit assessment');
     await user.click(submitAssessmentButton);
     expect(mockSubmitAssessmentAction.action.onClick).toHaveBeenCalled();

src/components/Assessment/EditableAssessment/OverallFeedback/index.test.jsx

@@ -1,17 +1,11 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
+import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
-import { IntlProvider } from '@edx/frontend-platform/i18n';
-
 import { useOverallFeedbackPrompt, useOverallFeedbackFormFields } from 'hooks/assessment';
 import { useViewStep } from 'hooks/routing';
 import { stepNames } from 'constants/index';
+import { renderWithIntl } from '../../../../testUtils';
 import OverallFeedback from '.';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 jest.mock('hooks/assessment', () => ({
   useOverallFeedbackPrompt: jest.fn(),
   useOverallFeedbackFormFields: jest.fn(),
@@ -30,18 +24,7 @@ jest.mock('hooks/routing', () => ({
   useViewStep: jest.fn(),
 }));
 
-const messages = {
-  'frontend-app-ora.EditableAssessment.overallComments': 'Overall comments',
-  'frontend-app-ora.EditableAssessment.addComments': 'Add comments (Optional)',
-};
-
 describe('<OverallFeedback />', () => {
-  const renderWithIntl = (component) => render(
-    <IntlProvider locale="en" messages={messages}>
-      {component}
-    </IntlProvider>,
-  );
-
   const mockOnChange = jest.fn();
   const mockFeedbackValue = 'Test feedback content';
   const mockPrompt = 'Please provide overall feedback';

src/components/Assessment/EditableAssessment/index.test.jsx

@@ -1,15 +1,9 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
+import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
-import { IntlProvider } from '@edx/frontend-platform/i18n';
-
 import { useCriteriaConfig } from 'hooks/assessment';
+import { renderWithIntl } from '../../../testUtils';
 import EditableAssessment from '.';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 jest.mock('hooks/assessment', () => ({
   useCriteriaConfig: jest.fn(),
 }));
@@ -24,17 +18,7 @@ jest.mock('./AssessmentActions', () => () => (
   <div role="group" aria-label="Assessment Actions">Assessment Actions</div>
 ));
 
-const messages = {
-  'frontend-app-ora.EditableAssessment.rubric': 'Rubric',
-};
-
 describe('<EditableAssessment />', () => {
-  const renderWithIntl = (component) => render(
-    <IntlProvider locale="en" messages={messages}>
-      {component}
-    </IntlProvider>,
-  );
-
   beforeEach(() => {
     jest.clearAllMocks();
   });

src/components/Assessment/ReadonlyAssessment/AssessmentCriteria.test.jsx

@@ -1,15 +1,10 @@
-import React from 'react';
 import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 
 import { useCriteriaConfig } from 'hooks/assessment';
 import AssessmentCriteria from './AssessmentCriteria';
 import { renderWithIntl } from '../../../testUtils';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 jest.mock('hooks/assessment', () => ({
   useCriteriaConfig: jest.fn(),
 }));

src/components/Assessment/ReadonlyAssessment/CollapsibleAssessment.test.jsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 
@@ -8,10 +7,6 @@ import messages from './messages';
 
 import CollapsibleAssessment from './CollapsibleAssessment';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 describe('<CollapsibleAssessment />', () => {
   const defaultProps = {
     stepScore: {

src/components/Assessment/ReadonlyAssessment/Feedback.test.jsx

@@ -1,14 +1,9 @@
-import React from 'react';
 import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import { renderWithIntl } from '../../../testUtils';
 
 import Feedback from './Feedback';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 jest.mock('components/InfoPopover', () => {
   // eslint-disable-next-line react/prop-types
   const MockInfoPopover = ({ children }) => <div>{children}</div>;

src/components/Assessment/ReadonlyAssessment/ReadOnlyAssessment.test.jsx

@@ -1,14 +1,9 @@
-import React from 'react';
 import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import { renderWithProviders } from 'testUtils';
 
 import ReadOnlyAssessment from './ReadOnlyAssessment';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 jest.mock('hooks/assessment', () => ({
   useCriteriaConfig: () => ([
     {

src/components/Assessment/ReadonlyAssessment/index.test.jsx

@@ -1,15 +1,10 @@
-import React from 'react';
 import { renderWithProviders } from 'testUtils';
 import '@testing-library/jest-dom';
 
 import { useHasSubmitted } from 'hooks/app';
 import { useSubmittedAssessment } from 'hooks/assessment';
 import ReadOnlyAssessmentContainer from '.';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 const mockRefreshPageData = jest.fn();
 
 const mockReadOnlyMultipleAssessmentsProps = {

src/components/Assessment/index.test.jsx

@@ -1,14 +1,9 @@
-import { render, screen } from '@testing-library/react';
+import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
-import { IntlProvider } from '@edx/frontend-platform/i18n';
-
+import { renderWithIntl } from '../../testUtils';
 import Assessment from './index';
 import { useAssessmentData } from './useAssessmentData';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 jest.mock('./useAssessmentData', () => ({
   useAssessmentData: jest.fn(),
 }));
@@ -17,8 +12,6 @@ jest.mock('./EditableAssessment', () => () => <div>Editable Assessment</div>);
 
 jest.mock('./ReadonlyAssessment', () => () => <div>Readonly Assessment</div>);
 
-const renderWithIntl = (component) => render(<IntlProvider locale="en">{component}</IntlProvider>);
-
 describe('<Assessment />', () => {
   beforeEach(() => {
     jest.clearAllMocks();

src/components/Assessment/useAssessmentData.test.js

@@ -9,6 +9,11 @@ jest.mock('hooks/assessment', () => ({
   useInitializeAssessment: jest.fn(),
 }));
 
+jest.mock('react', () => ({
+  ...jest.requireActual('react'),
+  useEffect: jest.fn((cb, prereqs) => ({ useEffect: { cb, prereqs } })),
+}));
+
 describe('useAssessmentData', () => {
   let setStateSpy;
   const setValue = jest.fn();

src/components/ConfirmDialog/index.test.jsx

@@ -1,14 +1,9 @@
-import { render, screen } from '@testing-library/react';
+import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import userEvent from '@testing-library/user-event';
-import { IntlProvider } from '@edx/frontend-platform/i18n';
-
+import { renderWithIntl } from '../../testUtils';
 import ConfirmDialog from './index';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 describe('<ConfirmDialog />', () => {
   const props = {
     title: 'Test Title',
@@ -20,8 +15,6 @@ describe('<ConfirmDialog />', () => {
     close: jest.fn(),
   };
 
-  const renderWithIntl = (component) => render(<IntlProvider locale="en">{component}</IntlProvider>);
-
   it('renders title and description when isOpen is true', () => {
     renderWithIntl(<ConfirmDialog {...props} />);
 

src/components/CriterionContainer/CriterionFeedback.test.jsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 
@@ -14,10 +13,6 @@ import { renderWithIntl } from 'testUtils';
 import CriterionFeedback from './CriterionFeedback';
 import messages from './messages';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 jest.mock('hooks/assessment');
 jest.mock('hooks/routing');
 

src/components/CriterionContainer/GradedCriterion.test.jsx

@@ -4,10 +4,6 @@ import { IntlProvider } from '@edx/frontend-platform/i18n';
 
 import GradedCriterion from './GradedCriterion';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 const renderComponent = (props = {}) => render(
   <IntlProvider
     messages={{

src/components/CriterionContainer/RadioCriterion.test.jsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import { renderWithIntl } from 'testUtils';
@@ -11,10 +10,6 @@ import {
 import RadioCriterion from './RadioCriterion';
 import messages, { trainingMessages } from './messages';
 
-jest.unmock('@openedx/paragon');
-jest.unmock('react');
-jest.unmock('@edx/frontend-platform/i18n');
-
 jest.mock('hooks/assessment');
 
 describe('<RadioCriterion />', () => {