Andal.LND/frontend-app-learner-dashboard
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

test: Deprecate react-unit-test-utils 8/15 (#664)

Browse Source
This commit is contained in:
Diana Villalvazo
2025-06-24 11:38:13 -05:00
committed by GitHub
parent ab0f139d75
commit 6ae8180f99
10 changed files with 178 additions and 643 deletions
Download Patch File Download Diff File Expand all files Collapse all files

133
src/containers/EmailSettingsModal/__snapshots__/index.test.jsx.snap
View File

@@ -1,133 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`EmailSettingsModal render snapshot: emails disabled, show: false 1`] = `
<ModalDialog
hasCloseButton={false}
isOpen={false}
onClose={[MockFunction utils.nullMethod]}
title=""
>
<div
className="bg-white p-3 rounded shadow"
style={
{
"textAlign": "start",
}
}
>
<h4>
Receive course emails?
</h4>
<Form.Switch
checked={false}
onChange={[MockFunction hooks.onToggle]}
>
Course emails are off
</Form.Switch>
<p>
Course emails include important information about your course from instructors.
</p>
<ActionRow>
<Button
onClick={[MockFunction closeModal]}
variant="tertiary"
>
Never mind
</Button>
<Button
onClick={[MockFunction hooks.save]}
>
Save settings
</Button>
</ActionRow>
</div>
</ModalDialog>
`;
exports[`EmailSettingsModal render snapshot: emails disabled, show: true 1`] = `
<ModalDialog
hasCloseButton={false}
isOpen={true}
onClose={[MockFunction utils.nullMethod]}
title=""
>
<div
className="bg-white p-3 rounded shadow"
style={
{
"textAlign": "start",
}
}
>
<h4>
Receive course emails?
</h4>
<Form.Switch
checked={false}
onChange={[MockFunction hooks.onToggle]}
>
Course emails are off
</Form.Switch>
<p>
Course emails include important information about your course from instructors.
</p>
<ActionRow>
<Button
onClick={[MockFunction closeModal]}
variant="tertiary"
>
Never mind
</Button>
<Button
onClick={[MockFunction hooks.save]}
>
Save settings
</Button>
</ActionRow>
</div>
</ModalDialog>
`;
exports[`EmailSettingsModal render snapshot: emails enabled, show: true 1`] = `
<ModalDialog
hasCloseButton={false}
isOpen={true}
onClose={[MockFunction utils.nullMethod]}
title=""
>
<div
className="bg-white p-3 rounded shadow"
style={
{
"textAlign": "start",
}
}
>
<h4>
Receive course emails?
</h4>
<Form.Switch
checked={true}
onChange={[MockFunction hooks.onToggle]}
>
Course emails are on
</Form.Switch>
<p>
Course emails include important information about your course from instructors.
</p>
<ActionRow>
<Button
onClick={[MockFunction closeModal]}
variant="tertiary"
>
Never mind
</Button>
<Button
onClick={[MockFunction hooks.save]}
>
Save settings
</Button>
</ActionRow>
</div>
</ModalDialog>
`;

41
src/containers/EmailSettingsModal/index.test.jsx
View File

@@ -1,14 +1,19 @@
import React from 'react';
import { shallow } from '@edx/react-unit-test-utils';
import { render, screen } from '@testing-library/react';
import { IntlProvider } from '@edx/frontend-platform/i18n';
import hooks from './hooks';
import EmailSettingsModal from '.';
import messages from './messages';
jest.mock('./hooks', () => ({
__esModule: true,
default: jest.fn(),
}));
jest.unmock('@edx/frontend-platform/i18n');
jest.unmock('@openedx/paragon');
jest.unmock('react');
const hookProps = {
isOptedOut: true,
onToggle: jest.fn().mockName('hooks.onToggle'),
@@ -28,7 +33,7 @@ describe('EmailSettingsModal', () => {
describe('behavior', () => {
beforeEach(() => {
hooks.mockReturnValueOnce(hookProps);
shallow(<EmailSettingsModal {...props} />);
render(<IntlProvider locale="en"><EmailSettingsModal {...props} /></IntlProvider>);
});
it('calls hook w/ closeModal and cardId from props', () => {
expect(hooks).toHaveBeenCalledWith({
@@ -38,20 +43,36 @@ describe('EmailSettingsModal', () => {
});
});
describe('render', () => {
test('snapshot: emails disabled, show: false', () => {
hooks.mockReturnValueOnce(hookProps);
expect(shallow(<EmailSettingsModal {...props} show={false} />).snapshot).toMatchSnapshot();
it('emails disabled, show: false', () => {
hooks.mockReturnValue(hookProps);
render(<IntlProvider locale="en"><EmailSettingsModal {...props} show={false} /></IntlProvider>);
const modal = screen.queryByRole('dialog');
expect(modal).toBeNull();
});
test('snapshot: emails disabled, show: true', () => {
it('emails disabled, show: true', () => {
hooks.mockReturnValueOnce(hookProps);
expect(shallow(<EmailSettingsModal {...props} />).snapshot).toMatchSnapshot();
render(<IntlProvider locale="en"><EmailSettingsModal {...props} /></IntlProvider>);
const modal = screen.getByRole('dialog');
const heading = screen.getByText(messages.header.defaultMessage);
const emailsMsg = screen.getByText(messages.emailsOff.defaultMessage);
expect(modal).toBeInTheDocument();
expect(heading).toBeInTheDocument();
expect(emailsMsg).toBeInTheDocument();
});
test('snapshot: emails enabled, show: true', () => {
it('emails enabled, show: true', () => {
hooks.mockReturnValueOnce({
...hookProps,
isOptedOut: false,
});
expect(shallow(<EmailSettingsModal {...props} />).snapshot).toMatchSnapshot();
render(<IntlProvider locale="en"><EmailSettingsModal {...props} /></IntlProvider>);
const emailsMsg = screen.getByText(messages.emailsOn.defaultMessage);
const description = screen.getByText(messages.description.defaultMessage);
const buttonNeverMind = screen.getByRole('button', { name: messages.nevermind.defaultMessage });
const buttonSave = screen.getByRole('button', { name: messages.save.defaultMessage });
expect(emailsMsg).toBeInTheDocument();
expect(description).toBeInTheDocument();
expect(buttonNeverMind).toBeInTheDocument();
expect(buttonSave).toBeInTheDocument();
});
});
});