Merge pull request #27 from muselesscreator/mock-paragon

refactor: centralize paragon mocking
This commit is contained in:
Ben Warzeski
2021-11-05 16:06:11 -04:00
committed by GitHub
34 changed files with 168 additions and 233 deletions

View File

@@ -2,12 +2,6 @@ import { shallow } from 'enzyme';
import { ConfirmModal } from './ConfirmModal';
jest.mock('@edx/paragon', () => ({
ActionRow: () => 'ActionRow',
AlertModal: () => 'AlertModal',
Button: () => 'Button',
}));
describe('ConfirmModal', () => {
const props = {
isOpen: false,

View File

@@ -7,11 +7,11 @@ exports[`Info Popover Component snapshot 1`] = `
<Popover
className="overlay-help-popover"
>
<PopoverContent>
<Popover.Content>
<div>
Children component
</div>
</PopoverContent>
</Popover.Content>
</Popover>
}
placement="right-end"
@@ -20,7 +20,7 @@ exports[`Info Popover Component snapshot 1`] = `
<IconButton
alt="Display more info"
className="esg-help-icon"
iconAs={[MockFunction Icon]}
iconAs="Icon"
onClick={[Function]}
src={[MockFunction icons.InfoOutline]}
/>

View File

@@ -6,7 +6,6 @@ import {
Popover,
Icon,
IconButton,
PopoverContent,
} from '@edx/paragon';
import { InfoOutline } from '@edx/paragon/icons';
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
@@ -23,7 +22,7 @@ export const InfoPopover = ({ children, intl }) => (
flip
overlay={(
<Popover className="overlay-help-popover">
<PopoverContent>{children}</PopoverContent>
<Popover.Content>{children}</Popover.Content>
</Popover>
)}
>

View File

@@ -4,18 +4,6 @@ import { shallow } from 'enzyme';
import { formatMessage } from 'testUtils';
import { InfoPopover } from '.';
jest.mock('@edx/paragon', () => ({
OverlayTrigger: () => 'OverlayTrigger',
Icon: jest.fn().mockName('Icon'),
IconButton: () => 'IconButton',
Popover: () => 'Popover',
PopoverContent: () => 'PopoverContent',
}));
jest.mock('@edx/paragon/icons', () => ({
InfoOutline: jest.fn().mockName('icons.InfoOutline'),
}));
describe('Info Popover Component', () => {
const child = <div>Children component</div>;
test('snapshot', () => {

View File

@@ -11,9 +11,6 @@ jest.mock('@edx/frontend-platform', () => ({
jest.mock('@edx/frontend-platform/auth', () => ({
getLoginRedirectUrl: (url) => `redirect:${url}`,
}));
jest.mock('@edx/paragon', () => ({
Button: () => 'Button',
}));
describe('Header AnonymousUserMenu component', () => {
const props = {

View File

@@ -10,15 +10,6 @@ jest.mock('@edx/frontend-platform', () => ({
SUPPORT_URL: '<SUPPORT_URL>',
}),
}));
jest.mock('@edx/paragon', () => ({
Dropdown: {
Toggle: () => 'Dropdown.Toggle',
Item: () => 'Dropdown.Item',
},
}));
jest.mock('@fortawesome/react-fontawesome', () => ({
FontAwesomeIcon: () => 'FontAwesomeIcon',
}));
describe('Header AuthenticatedUserDropdown UserAvatar component', () => {
const props = {

View File

@@ -10,19 +10,6 @@ jest.mock('@edx/frontend-platform', () => ({
SUPPORT_URL: '<SUPPORT_URL>',
}),
}));
jest.mock('@edx/paragon', () => {
const Dropdown = () => 'Dropdown';
Dropdown.Toggle = () => 'Dropdown.Toggle';
Dropdown.Menu = () => 'Dropdown.Menu';
Dropdown.Item = () => 'Dropdown.Item';
return { Dropdown };
});
jest.mock('@fortawesome/react-fontawesome', () => ({
FontAwesomeIcon: () => 'FontAwesomeIcon',
}));
jest.mock('@fortawesome/free-solid-svg-icons', () => ({
faUserCircle: 'fa-user-circle-icon',
}));
describe('Header AuthenticatedUserDropdown UserMenu component', () => {
const props = {

View File

@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Header AuthenticatedUserDropdown UserAvatar component snapshot 1`] = `
<Toggle
<Dropdown.Toggle
variant="outline-primary"
>
<FontAwesomeIcon
@@ -27,5 +27,5 @@ exports[`Header AuthenticatedUserDropdown UserAvatar component snapshot 1`] = `
>
test-username
</span>
</Toggle>
</Dropdown.Toggle>
`;

View File

@@ -1,28 +1,28 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Header AuthenticatedUserDropdown UserMenu component snapshot 1`] = `
<Component
<Dropdown.Menu
className="dropdown-menu-right"
>
<Component
<Dropdown.Item
href="<LMS_BASE_URL>/dashboard"
>
Dashboard
</Component>
<Component
</Dropdown.Item>
<Dropdown.Item
href="<LMS_BASE_URL>/u/test-username"
>
Profile
</Component>
<Component
</Dropdown.Item>
<Dropdown.Item
href="<LMS_BASE_URL>/account/settings"
>
Account
</Component>
<Component
</Dropdown.Item>
<Dropdown.Item
href="<LOGOUT_URL>"
>
Sign Out
</Component>
</Component>
</Dropdown.Item>
</Dropdown.Menu>
`;

View File

@@ -8,9 +8,6 @@ jest.mock('@edx/frontend-platform', () => ({
SUPPORT_URL: '<SUPPORT_URL>',
}),
}));
jest.mock('@edx/paragon', () => ({
Dropdown: () => 'Dropdown',
}));
jest.mock('./UserAvatar', () => 'UserAvatar');
jest.mock('./UserMenu', () => 'UserMenu');

View File

@@ -13,12 +13,6 @@ import {
mapDispatchToProps,
} from './CriterionFeedback';
jest.mock('@edx/paragon', () => ({
Form: {
Control: () => 'Form.Control',
},
}));
jest.mock('data/redux/app/selectors', () => ({
rubric: {
criterionFeedbackConfig: jest.fn((...args) => ({

View File

@@ -9,13 +9,6 @@ import {
mapStateToProps,
} from './RadioCriterion';
jest.mock('@edx/paragon', () => ({
Form: {
RadioSet: () => 'Form.RadioSet',
Radio: () => 'Form.Radio',
},
}));
jest.mock('data/redux/app/selectors', () => ({
rubric: {
criterionConfig: jest.fn((...args) => ({

View File

@@ -5,13 +5,6 @@ import { selectors } from 'data/redux';
import { ReviewCriterion, mapStateToProps } from './ReviewCriterion';
import messages from './messages';
jest.mock('@edx/paragon', () => ({
Form: {
Label: () => 'Form.Label',
},
FormControlFeedback: () => 'FormControlFeedback',
}));
jest.mock('data/redux/app/selectors', () => ({
rubric: {
criterionConfig: jest.fn((...args) => ({

View File

@@ -3,7 +3,7 @@
exports[`Criterion Feedback snapshot is configure to disabled 1`] = `null`;
exports[`Criterion Feedback snapshot is graded 1`] = `
<Control
<Form.Control
as="input"
className="criterion-feedback feedback-input"
disabled={true}
@@ -14,7 +14,7 @@ exports[`Criterion Feedback snapshot is graded 1`] = `
`;
exports[`Criterion Feedback snapshot is grading 1`] = `
<Control
<Form.Control
as="input"
className="criterion-feedback feedback-input"
disabled={false}

View File

@@ -2,11 +2,11 @@
exports[`Radio Criterion Container snapshot is grading 1`] = `
<React.Fragment>
<RadioSet
<Form.RadioSet
name="random name"
value="selected option"
>
<Radio
<Form.Radio
className="criteria-option"
description="1 points"
disabled={false}
@@ -14,8 +14,8 @@ exports[`Radio Criterion Container snapshot is grading 1`] = `
value="option name"
>
this label
</Radio>
<Radio
</Form.Radio>
<Form.Radio
className="criteria-option"
description="2 points"
disabled={false}
@@ -23,18 +23,18 @@ exports[`Radio Criterion Container snapshot is grading 1`] = `
value="option name 2"
>
this label 2
</Radio>
</RadioSet>
</Form.Radio>
</Form.RadioSet>
</React.Fragment>
`;
exports[`Radio Criterion Container snapshot is not grading 1`] = `
<React.Fragment>
<RadioSet
<Form.RadioSet
name="random name"
value="selected option"
>
<Radio
<Form.Radio
className="criteria-option"
description="1 points"
disabled={true}
@@ -42,8 +42,8 @@ exports[`Radio Criterion Container snapshot is not grading 1`] = `
value="option name"
>
this label
</Radio>
<Radio
</Form.Radio>
<Form.Radio
className="criteria-option"
description="2 points"
disabled={true}
@@ -51,7 +51,7 @@ exports[`Radio Criterion Container snapshot is not grading 1`] = `
value="option name 2"
>
this label 2
</Radio>
</RadioSet>
</Form.Radio>
</Form.RadioSet>
</React.Fragment>
`;

View File

@@ -9,11 +9,11 @@ exports[`Review Crition Container snapshot 1`] = `
key="option name"
>
<div>
<Label
<Form.Label
className="option-label"
>
this label
</Label>
</Form.Label>
<FormControlFeedback
className="option-points"
>
@@ -35,11 +35,11 @@ exports[`Review Crition Container snapshot 1`] = `
key="option name 2"
>
<div>
<Label
<Form.Label
className="option-label"
>
this label 2
</Label>
</Form.Label>
<FormControlFeedback
className="option-points"
>

View File

@@ -1,8 +1,8 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Criterion Container snapshot is graded and is not grading 1`] = `
<Group>
<Label
<Form.Group>
<Form.Label
className="criteria-label"
>
<span
@@ -32,7 +32,7 @@ exports[`Criterion Container snapshot is graded and is not grading 1`] = `
explaination 2
</div>
</InfoPopover>
</Label>
</Form.Label>
<div
className="rubric-criteria"
>
@@ -45,12 +45,12 @@ exports[`Criterion Container snapshot is graded and is not grading 1`] = `
isGrading={false}
orderNum={1}
/>
</Group>
</Form.Group>
`;
exports[`Criterion Container snapshot is ungraded and is grading 1`] = `
<Group>
<Label
<Form.Group>
<Form.Label
className="criteria-label"
>
<span
@@ -80,7 +80,7 @@ exports[`Criterion Container snapshot is ungraded and is grading 1`] = `
explaination 2
</div>
</InfoPopover>
</Label>
</Form.Label>
<div
className="rubric-criteria"
>
@@ -93,12 +93,12 @@ exports[`Criterion Container snapshot is ungraded and is grading 1`] = `
isGrading={true}
orderNum={1}
/>
</Group>
</Form.Group>
`;
exports[`Criterion Container snapshot is ungraded and is not grading 1`] = `
<Group>
<Label
<Form.Group>
<Form.Label
className="criteria-label"
>
<span
@@ -128,7 +128,7 @@ exports[`Criterion Container snapshot is ungraded and is not grading 1`] = `
explaination 2
</div>
</InfoPopover>
</Label>
</Form.Label>
<div
className="rubric-criteria"
>
@@ -140,5 +140,5 @@ exports[`Criterion Container snapshot is ungraded and is not grading 1`] = `
isGrading={false}
orderNum={1}
/>
</Group>
</Form.Group>
`;

View File

@@ -11,13 +11,6 @@ jest.mock('./RadioCriterion', () => 'RadioCriterion');
jest.mock('./CriterionFeedback', () => 'CriterionFeedback');
jest.mock('./ReviewCriterion', () => 'ReviewCriterion');
jest.mock('@edx/paragon', () => ({
Form: {
Group: () => 'Form.Group',
Label: () => 'Form.Label',
},
}));
jest.mock('data/redux/app/selectors', () => ({
rubric: {
criterionConfig: jest.fn((...args) => ({

View File

@@ -1,9 +1,7 @@
import React from 'react';
import { shallow } from 'enzyme';
import {
Hyperlink,
} from '@edx/paragon';
import { Hyperlink } from '@edx/paragon';
import * as constants from 'data/constants/app';
import urls from 'data/services/lms/urls';
@@ -14,15 +12,6 @@ import {
mapStateToProps,
} from './ListViewBreadcrumb';
jest.mock('@edx/paragon', () => ({
Hyperlink: () => 'Hyperlink',
Icon: () => 'Icon',
}));
jest.mock('@edx/paragon/icons', () => ({
ArrowBack: 'icons.ArrowBack',
Launch: 'icons.Launch',
}));
jest.mock('data/redux/app/selectors', () => ({
courseId: (...args) => ({ courseId: args }),
ora: {

View File

@@ -8,7 +8,7 @@ exports[`ListViewBreadcrumb component component snapshot: empty (no list data) 1
>
<Icon
className="mr-3"
icon="icons.ArrowBack"
icon={[MockFunction icons.ArrowBack]}
/>
<FormattedMessage
defaultMessage="Back to all open responses"
@@ -25,7 +25,7 @@ exports[`ListViewBreadcrumb component component snapshot: empty (no list data) 1
target="_blank"
>
<Icon
icon="icons.Launch"
icon={[MockFunction icons.Launch]}
/>
</Hyperlink>
</p>

View File

@@ -19,20 +19,6 @@ import {
mapDispatchToProps,
} from '.';
jest.mock('@edx/paragon', () => {
const mockDataTable = () => 'DataTable';
Object.defineProperty(mockDataTable, 'name', { value: 'DataTable' });
mockDataTable.TableControlBar = 'DataTable.TableControlBar';
mockDataTable.Table = 'DataTable.Table';
mockDataTable.EmptyTable = 'DataTable.EmptyTable';
mockDataTable.TableFooter = 'DataTable.TableFooter';
return {
DataTable: mockDataTable,
TextFilter: 'TextFilter',
MultiSelectDropdownFilter: 'MultiSelectDropdownFilter',
Container: () => 'Container',
};
});
jest.mock('components/StatusBadge', () => 'StatusBadge');
jest.mock('containers/ReviewModal', () => 'ReviewModal');
jest.mock('./ListViewBreadcrumb', () => 'ListViewBreadcrumb');

View File

@@ -4,33 +4,6 @@ import { shallow } from 'enzyme';
import { formatMessage } from 'testUtils';
import { SubmissionFiles } from './SubmissionFiles';
jest.mock('@edx/paragon', () => {
const Card = () => 'Card';
const Collapsible = {};
Collapsible.Advanced = 'Collapsible.Advanced';
Collapsible.Trigger = 'Collapsible.Trigger';
Collapsible.Visible = 'Collapsible.Visible';
Collapsible.Body = 'Collapsible.Body';
const Button = () => 'Button';
const Icon = () => 'Icon';
const DataTable = () => 'DataTable';
DataTable.Table = 'DataTable.Table';
return {
Card,
Collapsible,
Button,
Icon,
DataTable,
};
});
jest.mock('@edx/paragon/icons', () => ({
ArrowDropDown: jest.fn().mockName('Icons.ArrowDropDown'),
ArrowDropUp: jest.fn().mockName('Icons.ArrowDropUp'),
}));
jest.mock('./components/FileNameCell', () => jest.fn().mockName('FileNameCell'));
jest.mock('./components/FileExtensionCell', () => jest.fn().mockName('FileExtensionCell'));
jest.mock('./components/FilePopoverCell', () => jest.fn().mockName('FilePopoverCell'));

View File

@@ -31,14 +31,14 @@ exports[`SubmissionFiles component snapshot files exited for props 1`] = `
whenClosed={true}
>
<Icon
src={[MockFunction Icons.ArrowDropDown]}
src={[MockFunction icons.ArrowDropDown]}
/>
</Collapsible.Visible>
<Collapsible.Visible
whenOpen={true}
>
<Icon
src={[MockFunction Icons.ArrowDropUp]}
src={[MockFunction icons.ArrowDropUp]}
/>
</Collapsible.Visible>
</Collapsible.Trigger>

View File

@@ -9,14 +9,6 @@ import { selectors } from 'data/redux';
import { ResponseDisplay, mapStateToProps } from '.';
jest.mock('@edx/paragon', () => {
const Card = () => 'Card';
Card.Body = 'Card.Body';
return {
Card,
};
});
jest.mock('data/redux', () => ({
selectors: {
grading: {

View File

@@ -10,13 +10,6 @@ import {
mapDispatchToProps,
} from './StartGradingButton';
jest.mock('@edx/paragon', () => ({
Button: () => 'Button',
}));
jest.mock('@edx/paragon/icons', () => ({
Cancel: 'Cancel',
Highlight: 'Highlight',
}));
jest.mock('data/redux/grading/selectors', () => ({
selected: {
gradeStatus: (state) => ({ gradeStatus: state }),

View File

@@ -11,14 +11,6 @@ import {
mapDispatchToProps,
} from './SubmissionNavigation';
jest.mock('@edx/paragon', () => ({
Icon: () => 'Icon',
IconButton: () => 'IconButton',
}));
jest.mock('@edx/paragon/icons', () => ({
ChevronLeft: 'ChevronLeft',
ChevronRight: 'ChevronRight',
}));
jest.mock('data/redux/grading/selectors', () => ({
prev: {
doesExist: (state) => ({ prevDoesExist: state }),

View File

@@ -3,7 +3,7 @@
exports[`StartGradingButton component component snapshotes snapshot: graded, confirmOverride (startGrading callback) 1`] = `
<React.Fragment>
<Button
iconAfter="Highlight"
iconAfter={[MockFunction icons.Highlight]}
onClick={[MockFunction this.handleClick]}
variant="primary"
>
@@ -30,7 +30,7 @@ exports[`StartGradingButton component component snapshotes snapshot: graded, con
exports[`StartGradingButton component component snapshotes snapshot: inProgress, isOverride, confirmStop (stopGrading callback) 1`] = `
<React.Fragment>
<Button
iconAfter="Cancel"
iconAfter={[MockFunction icons.Cancel]}
onClick={[MockFunction this.handleClick]}
variant="primary"
>
@@ -59,7 +59,7 @@ exports[`StartGradingButton component component snapshotes snapshot: locked (nul
exports[`StartGradingButton component component snapshotes snapshot: ungraded (startGrading callback) 1`] = `
<React.Fragment>
<Button
iconAfter="Highlight"
iconAfter={[MockFunction icons.Highlight]}
onClick={[MockFunction this.handleClick]}
variant="primary"
>

View File

@@ -8,10 +8,10 @@ exports[`SubmissionNavigation component component snapshot: no next submission (
alt="Load previous submission"
className="ml-1"
disabled={false}
iconAs={[Function]}
iconAs="Icon"
onClick={[MockFunction this.props.loadPrev]}
size="inline"
src="ChevronLeft"
src={[MockFunction icons.ChevronLeft]}
/>
<span
className="ml-1"
@@ -32,10 +32,10 @@ exports[`SubmissionNavigation component component snapshot: no next submission (
alt="Load next submission"
className="ml-1"
disabled={true}
iconAs={[Function]}
iconAs="Icon"
onClick={[MockFunction this.props.loadNext]}
size="inline"
src="ChevronRight"
src={[MockFunction icons.ChevronRight]}
/>
</span>
`;
@@ -48,10 +48,10 @@ exports[`SubmissionNavigation component component snapshot: no prev submission (
alt="Load previous submission"
className="ml-1"
disabled={true}
iconAs={[Function]}
iconAs="Icon"
onClick={[MockFunction this.props.loadPrev]}
size="inline"
src="ChevronLeft"
src={[MockFunction icons.ChevronLeft]}
/>
<span
className="ml-1"
@@ -72,10 +72,10 @@ exports[`SubmissionNavigation component component snapshot: no prev submission (
alt="Load next submission"
className="ml-1"
disabled={false}
iconAs={[Function]}
iconAs="Icon"
onClick={[MockFunction this.props.loadNext]}
size="inline"
src="ChevronRight"
src={[MockFunction icons.ChevronRight]}
/>
</span>
`;

View File

@@ -5,10 +5,6 @@ import { actions, selectors } from 'data/redux';
import { ReviewActions, mapStateToProps, mapDispatchToProps } from '.';
jest.mock('@edx/paragon', () => ({
ActionRow: () => 'ActionRow',
Button: () => 'Button',
}));
jest.mock('data/redux/app/selectors', () => ({
showRubric: (state) => ({ showRubric: state }),
}));

View File

@@ -17,15 +17,6 @@ import {
jest.mock('components/InfoPopover', () => 'InfoPopover');
jest.mock('@edx/paragon', () => {
const Form = () => 'Form';
Object.defineProperty(Form, 'name', { value: 'Form' });
Form.Group = 'Form.Group';
Form.Label = 'Form.Label';
Form.Control = 'Form.Control';
return { Form };
});
jest.mock('data/redux/app/selectors', () => ({
isGrading: jest.fn((...args) => ({ isGragrding: args })),
rubric: {

View File

@@ -7,13 +7,6 @@ import { Rubric, mapStateToProps } from '.';
jest.mock('containers/CriterionContainer', () => 'CriterionContainer');
jest.mock('./RubricFeedback', () => 'RubricFeedback');
jest.mock('@edx/paragon', () => {
const Card = () => 'Card';
Card.Body = 'Card.Body';
const Button = () => 'Button';
return { Button, Card };
});
jest.mock('data/redux/app/selectors', () => ({
isGrading: jest.fn((...args) => ({ isGragrding: args })),
rubric: {

View File

@@ -19,3 +19,68 @@ jest.mock('@edx/frontend-platform/i18n', () => {
FormattedMessage: () => 'FormattedMessage',
};
});
jest.mock('@edx/paragon', () => jest.requireActual('testUtils').mockNestedComponents({
AlertModal: 'AlertModal',
ActionRow: 'ActionRow',
Badge: 'Badge',
Button: 'Button',
Card: {
Body: 'Card.Body',
},
Collapsible: {
Advanced: 'Collapsible.Advanced',
Body: 'Collapsible.Body',
Trigger: 'Collapsible.Trigger',
Visible: 'Collapsible.Visible',
},
Container: 'Container',
DataTable: {
EmptyTable: 'DataTable.EmptyTable',
Table: 'DataTable.Table',
TableControlBar: 'DataTable.TableControlBar',
TableController: 'DataTable.TableController',
TableFooter: 'DataTable.TableFooter',
},
Dropdown: {
Item: 'Dropdown.Item',
Menu: 'Dropdown.Menu',
Toggle: 'Dropdown.Toggle',
},
Form: {
Control: 'Form.Control',
Group: 'Form.Group',
Label: 'Form.Label',
Radio: 'Form.Radio',
RadioSet: 'Form.RadioSet',
},
FormControlFeedback: 'FormControlFeedback',
Hyperlink: 'Hyperlink',
Icon: 'Icon',
IconButton: 'IconButton',
MultiSelectDropdownFilter: 'MultiSelectDropdownFilter',
OverlayTrigger: 'OverlayTrigger',
Popover: {
Content: 'Popover.Content',
},
TextFilter: 'TextFilter',
}));
jest.mock('@fortawesome/react-fontawesome', () => ({
FontAwesomeIcon: 'FontAwesomeIcon',
}));
jest.mock('@fortawesome/free-solid-svg-icons', () => ({
faUserCircle: jest.fn().mockName('fa-user-circle-icon'),
}));
jest.mock('@edx/paragon/icons', () => ({
ArrowBack: jest.fn().mockName('icons.ArrowBack'),
ArrowDropDown: jest.fn().mockName('icons.ArrowDropDown'),
ArrowDropUp: jest.fn().mockName('icons.ArrowDropUp'),
Cancel: jest.fn().mockName('icons.Cancel'),
ChevronLeft: jest.fn().mockName('icons.ChevronLeft'),
ChevronRight: jest.fn().mockName('icons.ChevronRight'),
Highlight: jest.fn().mockName('icons.Highlight'),
InfoOutline: jest.fn().mockName('icons.InfoOutline'),
Launch: jest.fn().mockName('icons.Launch'),
}));

View File

@@ -21,7 +21,9 @@ import reviewActionsMessages from 'containers/ReviewActions/messages';
import App from 'App';
jest.mock('@edx/frontend-platform/i18n', () => jest.requireActual('@edx/frontend-platform/i18n'));
jest.unmock('@edx/paragon');
jest.unmock('@edx/paragon/icons');
jest.unmock('@edx/frontend-platform/i18n');
jest.mock('@edx/frontend-platform/auth', () => ({
getAuthenticatedHttpClient: jest.fn(),

View File

@@ -1,4 +1,6 @@
// eslint-disable-next-line import/prefer-default-export
/**
* Mocked formatMessage provided by react-intl
*/
export const formatMessage = (msg, values) => {
let message = msg.defaultMessage;
if (values === undefined) { return message; }
@@ -8,3 +10,38 @@ export const formatMessage = (msg, values) => {
});
return message;
};
/**
* Mock a single component, or a nested component so that its children render nicely
* in snapshots.
* @param {string} name - parent component name
* @param {obj} contents - object of child components with intended component
* render name.
* @return {func} - mock component with nested children.
*
* usage:
* mockNestedComponent('Card', { Body: 'Card.Body', ... });
* mockNestedComponent('IconButton', 'IconButton');
*/
export const mockNestedComponent = (name, contents) => {
if (typeof contents !== 'object') { return contents; }
const fn = () => name;
Object.defineProperty(fn, 'name', { value: name });
Object.keys(contents).forEach(nestedName => { fn[nestedName] = contents[nestedName]; });
return fn;
};
/**
* Mock a module of components. nested components will be rendered nicely in snapshots.
* @param {obj} mapping - component module mock config.
* @return {obj} - module of flat and nested components that will render nicely in snapshots.
* usage:
* mockNestedComponents({
* Card: { Body: 'Card.Body' },
* IconButton: 'IconButton',
* })
*/
export const mockNestedComponents = (mapping) => Object.entries(mapping).reduce(
(obj, [name, value]) => ({ ...obj, [name]: mockNestedComponent(name, value) }),
{},
);