test: deprecate react-unit-test-utils part-5 (#439)
* test: deprecate react-unit-test-utils part-5 * test: fixes due to rebase * test: change fireEvent to userEvent * test: improve tests and address feedback --------- Co-authored-by: diana-villalvazo-wgu <diana.villalvazo@wgu.edu>
This commit is contained in:
Victor Navarro
@@ -1,23 +1,21 @@
|
||||
import React from 'react';
|
||||
import { shallow } from '@edx/react-unit-test-utils';
|
||||
|
||||
import { Hyperlink } from '@openedx/paragon';
|
||||
|
||||
import * as constants from 'data/constants/app';
|
||||
import urls from 'data/services/lms/urls';
|
||||
import { render } from '@testing-library/react';
|
||||
import { IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import { selectors } from 'data/redux';
|
||||
|
||||
import {
|
||||
ListViewBreadcrumb,
|
||||
mapStateToProps,
|
||||
} from './ListViewBreadcrumb';
|
||||
|
||||
jest.unmock('@openedx/paragon');
|
||||
jest.unmock('react');
|
||||
jest.unmock('@edx/frontend-platform/i18n');
|
||||
|
||||
jest.mock('data/redux', () => ({
|
||||
selectors: {
|
||||
app: {
|
||||
courseId: (...args) => ({ courseId: args }),
|
||||
courseId: jest.fn((state) => state.courseId || 'test-course-id'),
|
||||
ora: {
|
||||
name: (...args) => ({ oraName: args }),
|
||||
name: jest.fn((state) => state.oraName || 'test-ora-name'),
|
||||
},
|
||||
},
|
||||
},
|
||||
@@ -28,41 +26,64 @@ jest.mock('data/services/lms/urls', () => ({
|
||||
ora: (courseId, locationId) => `oraUrl(${courseId}, ${locationId})`,
|
||||
}));
|
||||
|
||||
let el;
|
||||
jest.mock('data/constants/app', () => ({
|
||||
locationId: () => 'test-location-id',
|
||||
}));
|
||||
|
||||
describe('ListViewBreadcrumb component', () => {
|
||||
describe('component', () => {
|
||||
const props = {
|
||||
courseId: 'test-course-id',
|
||||
oraName: 'fake-ora-name',
|
||||
};
|
||||
beforeEach(() => {
|
||||
el = shallow(<ListViewBreadcrumb {...props} />);
|
||||
const props = {
|
||||
courseId: 'test-course-id',
|
||||
oraName: 'fake-ora-name',
|
||||
};
|
||||
|
||||
const renderWithIntl = (component) => render(
|
||||
<IntlProvider locale="en" messages={{}}>
|
||||
{component}
|
||||
</IntlProvider>,
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
});
|
||||
|
||||
describe('behavior', () => {
|
||||
it('renders back to responses link with correct destination', () => {
|
||||
const { container } = renderWithIntl(<ListViewBreadcrumb {...props} />);
|
||||
const backLink = container.querySelector('a[href*="openResponseUrl"]');
|
||||
expect(backLink).toBeInTheDocument();
|
||||
expect(backLink).toHaveAttribute('href', `openResponseUrl(${props.courseId})`);
|
||||
});
|
||||
test('snapshot: empty (no list data)', () => {
|
||||
expect(el.snapshot).toMatchSnapshot();
|
||||
|
||||
it('displays ORA name in heading', () => {
|
||||
const { getByText } = renderWithIntl(<ListViewBreadcrumb {...props} />);
|
||||
const heading = getByText(props.oraName);
|
||||
expect(heading).toBeInTheDocument();
|
||||
expect(heading).toHaveClass('h3');
|
||||
});
|
||||
test('openResponse destination', () => {
|
||||
expect(
|
||||
el.instance.findByType(Hyperlink)[0].props.destination,
|
||||
).toEqual(urls.openResponse(props.courseId));
|
||||
|
||||
it('renders ORA link with correct destination', () => {
|
||||
const { container } = renderWithIntl(<ListViewBreadcrumb {...props} />);
|
||||
const oraLink = container.querySelector('a[href*="oraUrl"]');
|
||||
expect(oraLink).toBeInTheDocument();
|
||||
expect(oraLink).toHaveAttribute('href', `oraUrl(${props.courseId}, test-location-id)`);
|
||||
});
|
||||
test('ora destination', () => {
|
||||
expect(
|
||||
el.instance.findByType(Hyperlink)[1].props.destination,
|
||||
).toEqual(urls.ora(props.courseId, constants.locationId()));
|
||||
|
||||
it('displays back to responses text', () => {
|
||||
const { getByText } = renderWithIntl(<ListViewBreadcrumb {...props} />);
|
||||
expect(getByText('Back to all open responses')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
describe('mapStateToProps', () => {
|
||||
let mapped;
|
||||
const testState = { some: 'test-state' };
|
||||
beforeEach(() => {
|
||||
mapped = mapStateToProps(testState);
|
||||
});
|
||||
test('courseId loads from app.courseId', () => {
|
||||
|
||||
it('maps courseId from app.courseId selector', () => {
|
||||
const mapped = mapStateToProps(testState);
|
||||
expect(mapped.courseId).toEqual(selectors.app.courseId(testState));
|
||||
});
|
||||
test('oraName loads from app.ora.name', () => {
|
||||
|
||||
it('maps oraName from app.ora.name selector', () => {
|
||||
const mapped = mapStateToProps(testState);
|
||||
expect(mapped.oraName).toEqual(selectors.app.ora.name(testState));
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,20 +1,37 @@
|
||||
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 { SelectedBulkAction } from './SelectedBulkAction';
|
||||
|
||||
jest.unmock('@openedx/paragon');
|
||||
jest.unmock('react');
|
||||
jest.unmock('@edx/frontend-platform/i18n');
|
||||
|
||||
describe('SelectedBulkAction component', () => {
|
||||
const props = {
|
||||
selectedFlatRows: [{ id: 1 }, { id: 2 }],
|
||||
handleClick: jest.fn(),
|
||||
handleClick: jest.fn(() => () => {}),
|
||||
};
|
||||
test('snapshots', () => {
|
||||
const el = shallow(<SelectedBulkAction {...props} handleClick={() => jest.fn()} />);
|
||||
expect(el.snapshot).toMatchSnapshot();
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
});
|
||||
|
||||
test('handleClick', () => {
|
||||
shallow(<SelectedBulkAction {...props} />);
|
||||
it('renders button with correct text and selected count', () => {
|
||||
render(<IntlProvider locale="en" messages={{}}><SelectedBulkAction {...props} /></IntlProvider>);
|
||||
const button = screen.getByRole('button');
|
||||
expect(button).toBeInTheDocument();
|
||||
expect(button).toHaveTextContent(`View selected responses (${props.selectedFlatRows.length})`);
|
||||
});
|
||||
|
||||
it('applies correct CSS class to button', () => {
|
||||
render(<IntlProvider locale="en" messages={{}}><SelectedBulkAction {...props} /></IntlProvider>);
|
||||
const button = screen.getByRole('button');
|
||||
expect(button).toHaveClass('view-selected-responses-btn');
|
||||
expect(button).toHaveClass('btn-primary');
|
||||
});
|
||||
|
||||
it('calls handleClick with selectedFlatRows on render', () => {
|
||||
render(<IntlProvider locale="en" messages={{}}><SelectedBulkAction {...props} /></IntlProvider>);
|
||||
expect(props.handleClick).toHaveBeenCalledWith(props.selectedFlatRows);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,47 +1,35 @@
|
||||
import React from 'react';
|
||||
import { shallow } from '@edx/react-unit-test-utils';
|
||||
|
||||
import {
|
||||
MultiSelectDropdownFilter,
|
||||
TextFilter,
|
||||
} from '@openedx/paragon';
|
||||
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import { IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import { selectors, thunkActions } from 'data/redux';
|
||||
import { gradingStatuses as statuses, submissionFields } from 'data/services/lms/constants';
|
||||
|
||||
import StatusBadge from 'components/StatusBadge';
|
||||
import messages from './messages';
|
||||
import { gradingStatuses as statuses } from 'data/services/lms/constants';
|
||||
import {
|
||||
SubmissionsTable,
|
||||
mapStateToProps,
|
||||
mapDispatchToProps,
|
||||
} from './SubmissionsTable';
|
||||
|
||||
jest.mock('./FilterStatusComponent', () => jest.fn().mockName('FilterStatusComponent'));
|
||||
jest.mock('./TableAction', () => jest.fn().mockName('TableAction'));
|
||||
jest.mock('./SelectedBulkAction', () => jest.fn().mockName('SelectedBulkAction'));
|
||||
jest.unmock('@openedx/paragon');
|
||||
jest.unmock('react');
|
||||
jest.unmock('@edx/frontend-platform/i18n');
|
||||
|
||||
jest.mock('data/redux', () => ({
|
||||
selectors: {
|
||||
app: {
|
||||
ora: {
|
||||
isIndividual: (...args) => ({ isIndividual: args }),
|
||||
isIndividual: jest.fn((state) => state.isIndividual || true),
|
||||
},
|
||||
},
|
||||
submissions: {
|
||||
listData: (...args) => ({ listData: args }),
|
||||
listData: jest.fn((state) => state.listData || []),
|
||||
},
|
||||
},
|
||||
thunkActions: {
|
||||
grading: {
|
||||
loadSelectionForReview: (...args) => ({ loadSelectionForReview: args }),
|
||||
loadSelectionForReview: jest.fn(),
|
||||
},
|
||||
},
|
||||
}));
|
||||
|
||||
let el;
|
||||
jest.useFakeTimers('modern');
|
||||
|
||||
const dates = [
|
||||
'2021-12-08 09:06:15.319213+00:00',
|
||||
'2021-12-10 18:06:15.319213+00:00',
|
||||
@@ -63,18 +51,15 @@ const individualData = [
|
||||
dateSubmitted: dates[1],
|
||||
gradingStatus: statuses.graded,
|
||||
score: {
|
||||
pointsEarned: 2,
|
||||
pointsEarned: 9,
|
||||
pointsPossible: 10,
|
||||
},
|
||||
},
|
||||
{
|
||||
username: 'username-3',
|
||||
dateSubmitted: dates[2],
|
||||
gradingStatus: statuses.inProgress,
|
||||
score: {
|
||||
pointsEarned: 3,
|
||||
pointsPossible: 10,
|
||||
},
|
||||
username: 'username-2',
|
||||
dateSubmitted: dates[1],
|
||||
gradingStatus: statuses.ungraded,
|
||||
score: null,
|
||||
},
|
||||
];
|
||||
|
||||
@@ -97,218 +82,94 @@ const teamData = [
|
||||
pointsPossible: 10,
|
||||
},
|
||||
},
|
||||
{
|
||||
teamName: 'teamName-3',
|
||||
dateSubmitted: dates[2],
|
||||
gradingStatus: statuses.inProgress,
|
||||
score: {
|
||||
pointsEarned: 3,
|
||||
pointsPossible: 10,
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
describe('SubmissionsTable component', () => {
|
||||
describe('component', () => {
|
||||
const props = {
|
||||
isIndividual: true,
|
||||
listData: [...individualData],
|
||||
};
|
||||
beforeEach(() => {
|
||||
props.loadSelectionForReview = jest.fn();
|
||||
const defaultProps = {
|
||||
isIndividual: true,
|
||||
listData: [...individualData],
|
||||
loadSelectionForReview: jest.fn(),
|
||||
};
|
||||
|
||||
const renderWithIntl = (component) => render(
|
||||
<IntlProvider locale="en" messages={{}}>
|
||||
{component}
|
||||
</IntlProvider>,
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
});
|
||||
|
||||
describe('behavior', () => {
|
||||
it('renders DataTable component', () => {
|
||||
const { container } = renderWithIntl(<SubmissionsTable {...defaultProps} />);
|
||||
const submissionsTable = container.querySelector('.submissions-table');
|
||||
expect(submissionsTable).toBeInTheDocument();
|
||||
});
|
||||
describe('render tests', () => {
|
||||
const mockMethod = (methodName) => {
|
||||
el.instance[methodName] = jest.fn().mockName(`this.${methodName}`);
|
||||
};
|
||||
beforeEach(() => {
|
||||
el = shallow(<SubmissionsTable {...props} />);
|
||||
});
|
||||
describe('snapshots', () => {
|
||||
beforeEach(() => {
|
||||
mockMethod('handleViewAllResponsesClick');
|
||||
mockMethod('formatDate');
|
||||
mockMethod('formatGrade');
|
||||
mockMethod('formatStatus');
|
||||
});
|
||||
test('snapshot: empty (no list data)', () => {
|
||||
el = shallow(<SubmissionsTable {...props} listData={[]} />);
|
||||
expect(el.snapshot).toMatchSnapshot();
|
||||
expect(el.isEmptyRender()).toEqual(true);
|
||||
});
|
||||
test('snapshot: happy path', () => {
|
||||
expect(el.snapshot).toMatchSnapshot();
|
||||
});
|
||||
test('snapshot: team happy path', () => {
|
||||
el = shallow(<SubmissionsTable {...props} isIndividual={false} listData={[...teamData]} />);
|
||||
expect(el.snapshot).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
describe('DataTable', () => {
|
||||
let tableProps;
|
||||
beforeEach(() => {
|
||||
tableProps = el.instance.findByTestId('data-table')[0].props;
|
||||
});
|
||||
test.each([
|
||||
'isFilterable',
|
||||
'isSelectable',
|
||||
'isSortable',
|
||||
'isPaginated',
|
||||
])('%s', key => expect(tableProps[key]).toEqual(true));
|
||||
test.each([
|
||||
['numBreakoutFilters', 2],
|
||||
['defaultColumnValues', { Filter: TextFilter }],
|
||||
['itemCount', 3],
|
||||
['initialState', { pageSize: 10, pageIndex: 0 }],
|
||||
])('%s = %p', (key, value) => expect(tableProps[key]).toEqual(value));
|
||||
describe('individual columns', () => {
|
||||
let columns;
|
||||
beforeEach(() => {
|
||||
columns = tableProps.columns;
|
||||
});
|
||||
test('username column', () => {
|
||||
expect(columns[0]).toEqual({
|
||||
Header: messages.username.defaultMessage,
|
||||
accessor: submissionFields.username,
|
||||
});
|
||||
});
|
||||
test('submission date column', () => {
|
||||
expect(columns[1]).toEqual({
|
||||
Header: messages.learnerSubmissionDate.defaultMessage,
|
||||
accessor: submissionFields.dateSubmitted,
|
||||
Cell: el.instance.children[0].props.columns[1].Cell,
|
||||
disableFilters: true,
|
||||
});
|
||||
});
|
||||
test('grade column', () => {
|
||||
expect(columns[2]).toEqual({
|
||||
Header: messages.grade.defaultMessage,
|
||||
accessor: submissionFields.score,
|
||||
Cell: el.instance.children[0].props.columns[2].Cell,
|
||||
disableFilters: true,
|
||||
});
|
||||
});
|
||||
test('grading status column', () => {
|
||||
expect(columns[3]).toEqual({
|
||||
Header: messages.gradingStatus.defaultMessage,
|
||||
accessor: submissionFields.gradingStatus,
|
||||
Cell: el.instance.children[0].props.columns[3].Cell,
|
||||
Filter: MultiSelectDropdownFilter,
|
||||
filter: 'includesValue',
|
||||
filterChoices: el.instance.children[0].props.columns[3].filterChoices,
|
||||
});
|
||||
});
|
||||
});
|
||||
describe('team columns', () => {
|
||||
let columns;
|
||||
beforeEach(() => {
|
||||
el = shallow(<SubmissionsTable {...props} isIndividual={false} listData={[...teamData]} />);
|
||||
columns = el.instance.findByTestId('data-table')[0].props.columns;
|
||||
});
|
||||
test('teamName column', () => {
|
||||
expect(columns[0]).toEqual({
|
||||
Header: messages.teamName.defaultMessage,
|
||||
accessor: submissionFields.teamName,
|
||||
});
|
||||
});
|
||||
test('submission date column', () => {
|
||||
expect(columns[1]).toEqual({
|
||||
Header: messages.teamSubmissionDate.defaultMessage,
|
||||
accessor: submissionFields.dateSubmitted,
|
||||
Cell: el.instance.children[0].props.columns[1].Cell,
|
||||
disableFilters: true,
|
||||
});
|
||||
});
|
||||
test('grade column', () => {
|
||||
expect(columns[2]).toEqual({
|
||||
Header: messages.grade.defaultMessage,
|
||||
accessor: submissionFields.score,
|
||||
Cell: el.instance.children[0].props.columns[2].Cell,
|
||||
disableFilters: true,
|
||||
});
|
||||
});
|
||||
test('grading status column', () => {
|
||||
expect(columns[3]).toEqual({
|
||||
Header: messages.gradingStatus.defaultMessage,
|
||||
accessor: submissionFields.gradingStatus,
|
||||
Cell: el.instance.children[0].props.columns[3].Cell,
|
||||
Filter: MultiSelectDropdownFilter,
|
||||
filter: 'includesValue',
|
||||
filterChoices: el.instance.children[0].props.columns[3].filterChoices,
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('returns empty render when no list data provided', () => {
|
||||
const { container } = renderWithIntl(<SubmissionsTable {...defaultProps} listData={[]} />);
|
||||
expect(container.firstChild).toBeNull();
|
||||
});
|
||||
describe('behavior', () => {
|
||||
describe('formatDate method', () => {
|
||||
it('returns the date in locale time string', () => {
|
||||
const fakeDate = 16131215154955;
|
||||
const fakeDateString = 'test-date-string';
|
||||
const mock = jest.spyOn(Date.prototype, 'toLocaleString').mockReturnValue(fakeDateString);
|
||||
expect(el.instance.children[0].props.columns[1].Cell({ value: fakeDate })).toEqual(fakeDateString);
|
||||
mock.mockRestore();
|
||||
});
|
||||
});
|
||||
describe('formatGrade method', () => {
|
||||
it('returns "-" if grade is null', () => {
|
||||
expect(el.instance.children[0].props.columns[2].Cell({ value: null })).toEqual('-');
|
||||
});
|
||||
it('returns <pointsEarned>/<pointsPossible> if grade exists', () => {
|
||||
expect(
|
||||
el.instance.children[0].props.columns[2].Cell({ value: { pointsEarned: 1, pointsPossible: 10 } }),
|
||||
).toEqual('1/10');
|
||||
});
|
||||
});
|
||||
describe('formatStatus method', () => {
|
||||
it('returns a StatusBadge with the given status', () => {
|
||||
const status = 'graded';
|
||||
expect(el.instance.children[0].props.columns[3].Cell({ value: 'graded' })).toEqual(
|
||||
<StatusBadge status={status} />,
|
||||
);
|
||||
});
|
||||
});
|
||||
describe('handleViewAllResponsesClick', () => {
|
||||
it('calls loadSelectionForReview with submissionUUID from all rows if there are no selectedRows', () => {
|
||||
// Test the integration by simulating the function call directly
|
||||
// Since handleViewAllResponsesClick is internal to the functional component,
|
||||
// we test through the component behavior
|
||||
const data = [
|
||||
{ original: { submissionUUID: '123' } },
|
||||
{ original: { submissionUUID: '456' } },
|
||||
{ original: { submissionUUID: '789' } },
|
||||
];
|
||||
|
||||
// Create a test instance that we can call the function on
|
||||
const testEl = shallow(<SubmissionsTable {...props} />);
|
||||
const tableProps = testEl.instance.findByTestId('data-table')[0].props;
|
||||
it('renders individual columns for individual submissions', () => {
|
||||
renderWithIntl(<SubmissionsTable {...defaultProps} />);
|
||||
expect(screen.getByText('Username')).toBeInTheDocument();
|
||||
expect(screen.getByText('Learner submission date')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
// Get the handleClick function from the TableAction props
|
||||
const handleClickFunction = tableProps.tableActions[0].props.handleClick;
|
||||
it('renders team columns for team submissions', () => {
|
||||
renderWithIntl(<SubmissionsTable {...defaultProps} isIndividual={false} listData={teamData} />);
|
||||
expect(screen.getByText('Team name')).toBeInTheDocument();
|
||||
expect(screen.getByText('Team submission date')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
// Call the function as TableAction would call it
|
||||
handleClickFunction(data)();
|
||||
it('formats date correctly', () => {
|
||||
renderWithIntl(<SubmissionsTable {...defaultProps} />);
|
||||
const formattedDate = screen.getAllByText('12/10/2021, 6:06:15 PM');
|
||||
expect(formattedDate.length).toBeGreaterThan(0);
|
||||
});
|
||||
|
||||
expect(props.loadSelectionForReview).toHaveBeenCalledWith(['123', '456', '789']);
|
||||
});
|
||||
});
|
||||
it('formats grade as dash when null', () => {
|
||||
renderWithIntl(<SubmissionsTable {...defaultProps} />);
|
||||
const ungradedBadge = screen.getAllByText('Ungraded')[1].parentElement;
|
||||
const score = ungradedBadge.previousSibling;
|
||||
expect(score).toHaveTextContent('-');
|
||||
});
|
||||
|
||||
it('formats grade as points earned over points possible', () => {
|
||||
renderWithIntl(<SubmissionsTable {...defaultProps} />);
|
||||
const scored = screen.getByText('9/10');
|
||||
expect(scored).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('formats status as StatusBadge component', () => {
|
||||
renderWithIntl(<SubmissionsTable {...defaultProps} />);
|
||||
const gradedBadge = screen.getByText('Grading Completed');
|
||||
expect(gradedBadge).toHaveClass('badge-success');
|
||||
const ungradedBadge = screen.getAllByText('Ungraded')[0];
|
||||
expect(ungradedBadge).toHaveClass('badge-primary');
|
||||
});
|
||||
});
|
||||
|
||||
describe('mapStateToProps', () => {
|
||||
let mapped;
|
||||
const testState = { some: 'test-state' };
|
||||
beforeEach(() => {
|
||||
mapped = mapStateToProps(testState);
|
||||
});
|
||||
test('listData loads from submissions.listData', () => {
|
||||
|
||||
it('maps listData from submissions.listData selector', () => {
|
||||
const mapped = mapStateToProps(testState);
|
||||
expect(mapped.listData).toEqual(selectors.submissions.listData(testState));
|
||||
});
|
||||
|
||||
it('maps isIndividual from app.ora.isIndividual selector', () => {
|
||||
const mapped = mapStateToProps(testState);
|
||||
expect(mapped.isIndividual).toEqual(selectors.app.ora.isIndividual(testState));
|
||||
});
|
||||
});
|
||||
|
||||
describe('mapDispatchToProps', () => {
|
||||
it('loads loadSelectionForReview from thunkActions.grading.loadSelectionForReview', () => {
|
||||
expect(
|
||||
mapDispatchToProps.loadSelectionForReview,
|
||||
).toEqual(thunkActions.grading.loadSelectionForReview);
|
||||
it('maps loadSelectionForReview from thunkActions', () => {
|
||||
expect(mapDispatchToProps.loadSelectionForReview).toEqual(thunkActions.grading.loadSelectionForReview);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,29 +1,54 @@
|
||||
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 { TableAction } from './TableAction';
|
||||
import messages from './messages';
|
||||
|
||||
jest.unmock('@openedx/paragon');
|
||||
jest.unmock('react');
|
||||
jest.unmock('@edx/frontend-platform/i18n');
|
||||
|
||||
describe('TableAction component', () => {
|
||||
const props = {
|
||||
tableInstance: { rows: [{ id: 1 }, { id: 2 }] },
|
||||
handleClick: jest.fn(),
|
||||
handleClick: jest.fn(() => () => {}),
|
||||
};
|
||||
test('snapshots', () => {
|
||||
const el = shallow(<TableAction {...props} handleClick={() => jest.fn()} />);
|
||||
expect(el.snapshot).toMatchSnapshot();
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
});
|
||||
|
||||
test('Inactive Button "View All Responses"', () => {
|
||||
it('renders button with correct text', () => {
|
||||
render(<IntlProvider locale="en" messages={{}}><TableAction {...props} /></IntlProvider>);
|
||||
const button = screen.getByRole('button');
|
||||
expect(button).toBeInTheDocument();
|
||||
expect(button).toHaveTextContent(messages.viewAllResponses.defaultMessage);
|
||||
});
|
||||
|
||||
it('applies correct CSS class to button', () => {
|
||||
render(<IntlProvider locale="en" messages={{}}><TableAction {...props} /></IntlProvider>);
|
||||
const button = screen.getByRole('button');
|
||||
expect(button).toHaveClass('view-all-responses-btn');
|
||||
expect(button).toHaveClass('btn-primary');
|
||||
});
|
||||
|
||||
it('enables button when rows are present', () => {
|
||||
render(<IntlProvider locale="en" messages={{}}><TableAction {...props} /></IntlProvider>);
|
||||
const button = screen.getByRole('button');
|
||||
expect(button).not.toBeDisabled();
|
||||
});
|
||||
|
||||
it('disables button when no rows are present', () => {
|
||||
const emptyProps = {
|
||||
tableInstance: { rows: [] },
|
||||
handleClick: jest.fn(),
|
||||
handleClick: jest.fn(() => () => {}),
|
||||
};
|
||||
const el = shallow(<TableAction {...emptyProps} />);
|
||||
expect(el.snapshot).toMatchSnapshot();
|
||||
render(<IntlProvider locale="en" messages={{}}><TableAction {...emptyProps} /></IntlProvider>);
|
||||
const button = screen.getByRole('button');
|
||||
expect(button).toBeDisabled();
|
||||
});
|
||||
|
||||
test('handleClick', () => {
|
||||
shallow(<TableAction {...props} />);
|
||||
it('calls handleClick with table rows on render', () => {
|
||||
render(<IntlProvider locale="en" messages={{}}><TableAction {...props} /></IntlProvider>);
|
||||
expect(props.handleClick).toHaveBeenCalledWith(props.tableInstance.rows);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,38 +0,0 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`ListViewBreadcrumb component component snapshot: empty (no list data) 1`] = `
|
||||
<Fragment>
|
||||
<Hyperlink
|
||||
className="py-4"
|
||||
destination="openResponseUrl(test-course-id)"
|
||||
>
|
||||
<Icon
|
||||
className="d-inline-block mr-3 breadcrumb-arrow"
|
||||
src={[MockFunction icons.ArrowBack]}
|
||||
/>
|
||||
<FormattedMessage
|
||||
defaultMessage="Back to all open responses"
|
||||
description="Breadcrumbs link text to return to ORA list in LMS"
|
||||
id="ora-grading.ListView.ListViewBreadcrumbs.backToResponses"
|
||||
/>
|
||||
</Hyperlink>
|
||||
<p
|
||||
className="py-4"
|
||||
>
|
||||
<span
|
||||
className="h3"
|
||||
>
|
||||
fake-ora-name
|
||||
</span>
|
||||
<Hyperlink
|
||||
className="align-middle"
|
||||
destination="oraUrl(test-course-id, fake-location-id)"
|
||||
>
|
||||
<Icon
|
||||
className="d-inline-block"
|
||||
src={[MockFunction icons.Launch]}
|
||||
/>
|
||||
</Hyperlink>
|
||||
</p>
|
||||
</Fragment>
|
||||
`;
|
||||
@@ -1,20 +0,0 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`SelectedBulkAction component snapshots 1`] = `
|
||||
<Button
|
||||
className="view-selected-responses-btn"
|
||||
onClick={[MockFunction]}
|
||||
variant="primary"
|
||||
>
|
||||
<FormattedMessage
|
||||
defaultMessage="View selected responses ({value})"
|
||||
description="Button text to load selected responses for review/grading"
|
||||
id="ora-grading.ListView.viewSelectedResponses"
|
||||
values={
|
||||
{
|
||||
"value": 2,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</Button>
|
||||
`;
|
||||
@@ -1,247 +0,0 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`SubmissionsTable component component render tests snapshots snapshot: empty (no list data) 1`] = `null`;
|
||||
|
||||
exports[`SubmissionsTable component component render tests snapshots snapshot: happy path 1`] = `
|
||||
<div
|
||||
className="submissions-table"
|
||||
>
|
||||
<DataTable
|
||||
FilterStatusComponent={[MockFunction FilterStatusComponent]}
|
||||
bulkActions={
|
||||
[
|
||||
<mockConstructor
|
||||
handleClick={[Function]}
|
||||
/>,
|
||||
]
|
||||
}
|
||||
columns={
|
||||
[
|
||||
{
|
||||
"Header": "Username",
|
||||
"accessor": "username",
|
||||
},
|
||||
{
|
||||
"Cell": [Function],
|
||||
"Header": "Learner submission date",
|
||||
"accessor": "dateSubmitted",
|
||||
"disableFilters": true,
|
||||
},
|
||||
{
|
||||
"Cell": [Function],
|
||||
"Header": "Grade",
|
||||
"accessor": "score",
|
||||
"disableFilters": true,
|
||||
},
|
||||
{
|
||||
"Cell": [Function],
|
||||
"Filter": "MultiSelectDropdownFilter",
|
||||
"Header": "Grading status",
|
||||
"accessor": "gradingStatus",
|
||||
"filter": "includesValue",
|
||||
"filterChoices": [
|
||||
{
|
||||
"name": "Ungraded",
|
||||
"value": "ungraded",
|
||||
},
|
||||
{
|
||||
"name": "Grading Completed",
|
||||
"value": "graded",
|
||||
},
|
||||
{
|
||||
"name": "Currently being graded by someone else",
|
||||
"value": "locked",
|
||||
},
|
||||
{
|
||||
"name": "You are currently grading this response",
|
||||
"value": "in-progress",
|
||||
},
|
||||
],
|
||||
},
|
||||
]
|
||||
}
|
||||
data={
|
||||
[
|
||||
{
|
||||
"dateSubmitted": "2021-12-08 09:06:15.319213+00:00",
|
||||
"gradingStatus": "ungraded",
|
||||
"score": {
|
||||
"pointsEarned": 1,
|
||||
"pointsPossible": 10,
|
||||
},
|
||||
"username": "username-1",
|
||||
},
|
||||
{
|
||||
"dateSubmitted": "2021-12-10 18:06:15.319213+00:00",
|
||||
"gradingStatus": "graded",
|
||||
"score": {
|
||||
"pointsEarned": 2,
|
||||
"pointsPossible": 10,
|
||||
},
|
||||
"username": "username-2",
|
||||
},
|
||||
{
|
||||
"dateSubmitted": "2021-12-11 07:06:15.319213+00:00",
|
||||
"gradingStatus": "in-progress",
|
||||
"score": {
|
||||
"pointsEarned": 3,
|
||||
"pointsPossible": 10,
|
||||
},
|
||||
"username": "username-3",
|
||||
},
|
||||
]
|
||||
}
|
||||
data-testid="data-table"
|
||||
defaultColumnValues={
|
||||
{
|
||||
"Filter": "TextFilter",
|
||||
}
|
||||
}
|
||||
initialState={
|
||||
{
|
||||
"pageIndex": 0,
|
||||
"pageSize": 10,
|
||||
}
|
||||
}
|
||||
isFilterable={true}
|
||||
isPaginated={true}
|
||||
isSelectable={true}
|
||||
isSortable={true}
|
||||
itemCount={3}
|
||||
numBreakoutFilters={2}
|
||||
tableActions={
|
||||
[
|
||||
<mockConstructor
|
||||
handleClick={[Function]}
|
||||
/>,
|
||||
]
|
||||
}
|
||||
>
|
||||
<DataTable.TableControlBar />
|
||||
<DataTable.Table />
|
||||
<DataTable.TableFooter />
|
||||
</DataTable>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`SubmissionsTable component component render tests snapshots snapshot: team happy path 1`] = `
|
||||
<div
|
||||
className="submissions-table"
|
||||
>
|
||||
<DataTable
|
||||
FilterStatusComponent={[MockFunction FilterStatusComponent]}
|
||||
bulkActions={
|
||||
[
|
||||
<mockConstructor
|
||||
handleClick={[Function]}
|
||||
/>,
|
||||
]
|
||||
}
|
||||
columns={
|
||||
[
|
||||
{
|
||||
"Header": "Team name",
|
||||
"accessor": "teamName",
|
||||
},
|
||||
{
|
||||
"Cell": [Function],
|
||||
"Header": "Team submission date",
|
||||
"accessor": "dateSubmitted",
|
||||
"disableFilters": true,
|
||||
},
|
||||
{
|
||||
"Cell": [Function],
|
||||
"Header": "Grade",
|
||||
"accessor": "score",
|
||||
"disableFilters": true,
|
||||
},
|
||||
{
|
||||
"Cell": [Function],
|
||||
"Filter": "MultiSelectDropdownFilter",
|
||||
"Header": "Grading status",
|
||||
"accessor": "gradingStatus",
|
||||
"filter": "includesValue",
|
||||
"filterChoices": [
|
||||
{
|
||||
"name": "Ungraded",
|
||||
"value": "ungraded",
|
||||
},
|
||||
{
|
||||
"name": "Grading Completed",
|
||||
"value": "graded",
|
||||
},
|
||||
{
|
||||
"name": "Currently being graded by someone else",
|
||||
"value": "locked",
|
||||
},
|
||||
{
|
||||
"name": "You are currently grading this response",
|
||||
"value": "in-progress",
|
||||
},
|
||||
],
|
||||
},
|
||||
]
|
||||
}
|
||||
data={
|
||||
[
|
||||
{
|
||||
"dateSubmitted": "2021-12-08 09:06:15.319213+00:00",
|
||||
"gradingStatus": "ungraded",
|
||||
"score": {
|
||||
"pointsEarned": 1,
|
||||
"pointsPossible": 10,
|
||||
},
|
||||
"teamName": "teamName-1",
|
||||
},
|
||||
{
|
||||
"dateSubmitted": "2021-12-10 18:06:15.319213+00:00",
|
||||
"gradingStatus": "graded",
|
||||
"score": {
|
||||
"pointsEarned": 2,
|
||||
"pointsPossible": 10,
|
||||
},
|
||||
"teamName": "teamName-2",
|
||||
},
|
||||
{
|
||||
"dateSubmitted": "2021-12-11 07:06:15.319213+00:00",
|
||||
"gradingStatus": "in-progress",
|
||||
"score": {
|
||||
"pointsEarned": 3,
|
||||
"pointsPossible": 10,
|
||||
},
|
||||
"teamName": "teamName-3",
|
||||
},
|
||||
]
|
||||
}
|
||||
data-testid="data-table"
|
||||
defaultColumnValues={
|
||||
{
|
||||
"Filter": "TextFilter",
|
||||
}
|
||||
}
|
||||
initialState={
|
||||
{
|
||||
"pageIndex": 0,
|
||||
"pageSize": 10,
|
||||
}
|
||||
}
|
||||
isFilterable={true}
|
||||
isPaginated={true}
|
||||
isSelectable={true}
|
||||
isSortable={true}
|
||||
itemCount={3}
|
||||
numBreakoutFilters={2}
|
||||
tableActions={
|
||||
[
|
||||
<mockConstructor
|
||||
handleClick={[Function]}
|
||||
/>,
|
||||
]
|
||||
}
|
||||
>
|
||||
<DataTable.TableControlBar />
|
||||
<DataTable.Table />
|
||||
<DataTable.TableFooter />
|
||||
</DataTable>
|
||||
</div>
|
||||
`;
|
||||
@@ -1,30 +0,0 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`TableAction component Inactive Button "View All Responses" 1`] = `
|
||||
<Button
|
||||
className="view-all-responses-btn"
|
||||
disabled={true}
|
||||
variant="primary"
|
||||
>
|
||||
<FormattedMessage
|
||||
defaultMessage="View all responses"
|
||||
description="Button text to load all responses for review/grading"
|
||||
id="ora-grading.ListView.viewAllResponses"
|
||||
/>
|
||||
</Button>
|
||||
`;
|
||||
|
||||
exports[`TableAction component snapshots 1`] = `
|
||||
<Button
|
||||
className="view-all-responses-btn"
|
||||
disabled={false}
|
||||
onClick={[MockFunction]}
|
||||
variant="primary"
|
||||
>
|
||||
<FormattedMessage
|
||||
defaultMessage="View all responses"
|
||||
description="Button text to load all responses for review/grading"
|
||||
id="ora-grading.ListView.viewAllResponses"
|
||||
/>
|
||||
</Button>
|
||||
`;
|
||||
@@ -1,6 +1,6 @@
|
||||
import React from 'react';
|
||||
import { shallow } from '@edx/react-unit-test-utils';
|
||||
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import { IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import { RequestKeys, RequestStates } from 'data/constants/requests';
|
||||
import { selectors, thunkActions } from 'data/redux';
|
||||
import {
|
||||
@@ -9,10 +9,15 @@ import {
|
||||
FileDownload,
|
||||
statusMapping,
|
||||
} from './FileDownload';
|
||||
import messages from './messages';
|
||||
|
||||
jest.unmock('@openedx/paragon');
|
||||
jest.unmock('react');
|
||||
jest.unmock('@edx/frontend-platform/i18n');
|
||||
|
||||
jest.mock('data/redux', () => ({
|
||||
selectors: {
|
||||
requests: { requestStatus: (...args) => ({ requestStatus: args }) },
|
||||
requests: { requestStatus: jest.fn((state, { requestKey }) => ({ status: 'inactive', requestKey })) },
|
||||
},
|
||||
thunkActions: {
|
||||
download: { downloadFiles: jest.fn() },
|
||||
@@ -20,50 +25,77 @@ jest.mock('data/redux', () => ({
|
||||
}));
|
||||
|
||||
describe('FileDownload', () => {
|
||||
describe('component', () => {
|
||||
const props = {
|
||||
requestStatus: { status: RequestStates.inactive },
|
||||
};
|
||||
let el;
|
||||
beforeEach(() => {
|
||||
props.downloadFiles = jest.fn().mockName('this.props.downloadFiles');
|
||||
el = shallow(<FileDownload {...props} />);
|
||||
const defaultProps = {
|
||||
requestStatus: { status: RequestStates.inactive },
|
||||
downloadFiles: jest.fn(),
|
||||
};
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
});
|
||||
|
||||
describe('behavior', () => {
|
||||
it('renders StatefulButton with default state when inactive', () => {
|
||||
render(<IntlProvider locale="en" messages={{}}><FileDownload {...defaultProps} /></IntlProvider>);
|
||||
const button = screen.getByRole('button');
|
||||
expect(button).toBeInTheDocument();
|
||||
expect(button).toHaveTextContent(messages.downloadFiles.defaultMessage);
|
||||
});
|
||||
describe('snapshot', () => {
|
||||
test('download is inactive', () => {
|
||||
expect(el.snapshot).toMatchSnapshot();
|
||||
expect(el.instance.props.state).toEqual(statusMapping[RequestStates.inactive]);
|
||||
});
|
||||
test('download is pending', () => {
|
||||
el = shallow(<FileDownload {...props} requestStatus={{ status: RequestStates.pending }} />);
|
||||
expect(el.snapshot).toMatchSnapshot();
|
||||
expect(el.instance.props.state).toEqual(statusMapping[RequestStates.pending]);
|
||||
});
|
||||
test('download is completed', () => {
|
||||
el = shallow(<FileDownload {...props} requestStatus={{ status: RequestStates.completed }} />);
|
||||
expect(el.snapshot).toMatchSnapshot();
|
||||
expect(el.instance.props.state).toEqual(statusMapping[RequestStates.completed]);
|
||||
});
|
||||
test('download is failed', () => {
|
||||
el = shallow(<FileDownload {...props} requestStatus={{ status: RequestStates.failed }} />);
|
||||
expect(el.snapshot).toMatchSnapshot();
|
||||
expect(el.instance.props.state).toEqual(statusMapping[RequestStates.failed]);
|
||||
});
|
||||
|
||||
it('renders with pending state when download is pending', () => {
|
||||
const props = { ...defaultProps, requestStatus: { status: RequestStates.pending } };
|
||||
render(<IntlProvider locale="en" messages={{}}><FileDownload {...props} /></IntlProvider>);
|
||||
const button = screen.getByRole('button');
|
||||
screen.debug();
|
||||
expect(button).toHaveClass('pgn__stateful-btn-state-pending');
|
||||
expect(button).toHaveAttribute('aria-disabled', 'true');
|
||||
expect(button).toHaveTextContent(messages.downloading.defaultMessage);
|
||||
});
|
||||
|
||||
it('renders with completed state when download is completed', () => {
|
||||
const props = { ...defaultProps, requestStatus: { status: RequestStates.completed } };
|
||||
render(<IntlProvider locale="en" messages={{}}><FileDownload {...props} /></IntlProvider>);
|
||||
const button = screen.getByRole('button');
|
||||
expect(button).toHaveClass('pgn__stateful-btn-state-completed');
|
||||
});
|
||||
|
||||
it('renders with failed state when download fails', () => {
|
||||
const props = { ...defaultProps, requestStatus: { status: RequestStates.failed } };
|
||||
render(<IntlProvider locale="en" messages={{}}><FileDownload {...props} /></IntlProvider>);
|
||||
const button = screen.getByRole('button');
|
||||
expect(button).toBeInTheDocument();
|
||||
expect(button).toHaveClass('pgn__stateful-btn-state-failed');
|
||||
expect(button).toHaveTextContent(messages.retryDownload.defaultMessage);
|
||||
});
|
||||
|
||||
it('calls downloadFiles when button is clicked', async () => {
|
||||
render(<IntlProvider locale="en" messages={{}}><FileDownload {...defaultProps} /></IntlProvider>);
|
||||
const user = userEvent.setup();
|
||||
const button = screen.getByRole('button');
|
||||
await user.click(button);
|
||||
expect(defaultProps.downloadFiles).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('maps request states to button states correctly', () => {
|
||||
expect(statusMapping[RequestStates.inactive]).toBe('default');
|
||||
expect(statusMapping[RequestStates.pending]).toBe('pending');
|
||||
expect(statusMapping[RequestStates.completed]).toBe('completed');
|
||||
expect(statusMapping[RequestStates.failed]).toBe('failed');
|
||||
});
|
||||
});
|
||||
|
||||
describe('mapStateToProps', () => {
|
||||
let mapped;
|
||||
const requestKey = RequestKeys.downloadFiles;
|
||||
const testState = { some: 'test-state' };
|
||||
beforeEach(() => {
|
||||
mapped = mapStateToProps(testState);
|
||||
});
|
||||
test('requestStatus loads from requests.requestStatus(downloadFiles)', () => {
|
||||
expect(mapped.requestStatus).toEqual(selectors.requests.requestStatus(testState, { requestKey }));
|
||||
|
||||
it('maps requestStatus from requests.requestStatus selector', () => {
|
||||
const mapped = mapStateToProps(testState);
|
||||
const expectedResult = selectors.requests.requestStatus(testState, { requestKey: RequestKeys.downloadFiles });
|
||||
expect(mapped.requestStatus).toEqual(expectedResult);
|
||||
});
|
||||
});
|
||||
|
||||
describe('mapDispatchToProps', () => {
|
||||
it('loads downloadFiles from thunkActions.download.downloadFiles', () => {
|
||||
it('maps downloadFiles from thunkActions', () => {
|
||||
expect(mapDispatchToProps.downloadFiles).toEqual(thunkActions.download.downloadFiles);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,213 +0,0 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`FileDownload component snapshot download is completed 1`] = `
|
||||
<StatefulButton
|
||||
disabledStates={
|
||||
[
|
||||
"pending",
|
||||
"complete",
|
||||
]
|
||||
}
|
||||
icons={
|
||||
{
|
||||
"complete": <Icon
|
||||
className="fa fa-check"
|
||||
/>,
|
||||
"default": <Icon
|
||||
className="fa fa-download"
|
||||
/>,
|
||||
"failed": <Icon
|
||||
className="fa fa-refresh"
|
||||
/>,
|
||||
"pending": <Icon
|
||||
className="fa fa-spinner fa-spin"
|
||||
/>,
|
||||
}
|
||||
}
|
||||
labels={
|
||||
{
|
||||
"complete": <FormattedMessage
|
||||
defaultMessage="Downloaded!"
|
||||
description="Download files completed state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloaded"
|
||||
/>,
|
||||
"default": <FormattedMessage
|
||||
defaultMessage="Download files"
|
||||
description="Download files inactive state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloadFiles"
|
||||
/>,
|
||||
"failed": <FormattedMessage
|
||||
defaultMessage="Retry download"
|
||||
description="Download files failed state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.retryDownload"
|
||||
/>,
|
||||
"pending": <FormattedMessage
|
||||
defaultMessage="Downloading"
|
||||
description="Download files pending state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloading"
|
||||
/>,
|
||||
}
|
||||
}
|
||||
onClick={[MockFunction this.props.downloadFiles]}
|
||||
state="completed"
|
||||
/>
|
||||
`;
|
||||
|
||||
exports[`FileDownload component snapshot download is failed 1`] = `
|
||||
<StatefulButton
|
||||
disabledStates={
|
||||
[
|
||||
"pending",
|
||||
"complete",
|
||||
]
|
||||
}
|
||||
icons={
|
||||
{
|
||||
"complete": <Icon
|
||||
className="fa fa-check"
|
||||
/>,
|
||||
"default": <Icon
|
||||
className="fa fa-download"
|
||||
/>,
|
||||
"failed": <Icon
|
||||
className="fa fa-refresh"
|
||||
/>,
|
||||
"pending": <Icon
|
||||
className="fa fa-spinner fa-spin"
|
||||
/>,
|
||||
}
|
||||
}
|
||||
labels={
|
||||
{
|
||||
"complete": <FormattedMessage
|
||||
defaultMessage="Downloaded!"
|
||||
description="Download files completed state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloaded"
|
||||
/>,
|
||||
"default": <FormattedMessage
|
||||
defaultMessage="Download files"
|
||||
description="Download files inactive state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloadFiles"
|
||||
/>,
|
||||
"failed": <FormattedMessage
|
||||
defaultMessage="Retry download"
|
||||
description="Download files failed state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.retryDownload"
|
||||
/>,
|
||||
"pending": <FormattedMessage
|
||||
defaultMessage="Downloading"
|
||||
description="Download files pending state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloading"
|
||||
/>,
|
||||
}
|
||||
}
|
||||
onClick={[MockFunction this.props.downloadFiles]}
|
||||
state="failed"
|
||||
/>
|
||||
`;
|
||||
|
||||
exports[`FileDownload component snapshot download is inactive 1`] = `
|
||||
<StatefulButton
|
||||
disabledStates={
|
||||
[
|
||||
"pending",
|
||||
"complete",
|
||||
]
|
||||
}
|
||||
icons={
|
||||
{
|
||||
"complete": <Icon
|
||||
className="fa fa-check"
|
||||
/>,
|
||||
"default": <Icon
|
||||
className="fa fa-download"
|
||||
/>,
|
||||
"failed": <Icon
|
||||
className="fa fa-refresh"
|
||||
/>,
|
||||
"pending": <Icon
|
||||
className="fa fa-spinner fa-spin"
|
||||
/>,
|
||||
}
|
||||
}
|
||||
labels={
|
||||
{
|
||||
"complete": <FormattedMessage
|
||||
defaultMessage="Downloaded!"
|
||||
description="Download files completed state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloaded"
|
||||
/>,
|
||||
"default": <FormattedMessage
|
||||
defaultMessage="Download files"
|
||||
description="Download files inactive state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloadFiles"
|
||||
/>,
|
||||
"failed": <FormattedMessage
|
||||
defaultMessage="Retry download"
|
||||
description="Download files failed state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.retryDownload"
|
||||
/>,
|
||||
"pending": <FormattedMessage
|
||||
defaultMessage="Downloading"
|
||||
description="Download files pending state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloading"
|
||||
/>,
|
||||
}
|
||||
}
|
||||
onClick={[MockFunction this.props.downloadFiles]}
|
||||
state="default"
|
||||
/>
|
||||
`;
|
||||
|
||||
exports[`FileDownload component snapshot download is pending 1`] = `
|
||||
<StatefulButton
|
||||
disabledStates={
|
||||
[
|
||||
"pending",
|
||||
"complete",
|
||||
]
|
||||
}
|
||||
icons={
|
||||
{
|
||||
"complete": <Icon
|
||||
className="fa fa-check"
|
||||
/>,
|
||||
"default": <Icon
|
||||
className="fa fa-download"
|
||||
/>,
|
||||
"failed": <Icon
|
||||
className="fa fa-refresh"
|
||||
/>,
|
||||
"pending": <Icon
|
||||
className="fa fa-spinner fa-spin"
|
||||
/>,
|
||||
}
|
||||
}
|
||||
labels={
|
||||
{
|
||||
"complete": <FormattedMessage
|
||||
defaultMessage="Downloaded!"
|
||||
description="Download files completed state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloaded"
|
||||
/>,
|
||||
"default": <FormattedMessage
|
||||
defaultMessage="Download files"
|
||||
description="Download files inactive state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloadFiles"
|
||||
/>,
|
||||
"failed": <FormattedMessage
|
||||
defaultMessage="Retry download"
|
||||
description="Download files failed state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.retryDownload"
|
||||
/>,
|
||||
"pending": <FormattedMessage
|
||||
defaultMessage="Downloading"
|
||||
description="Download files pending state label"
|
||||
id="ora-grading.ResponseDisplay.SubmissionFiles.downloading"
|
||||
/>,
|
||||
}
|
||||
}
|
||||
onClick={[MockFunction this.props.downloadFiles]}
|
||||
state="pending"
|
||||
/>
|
||||
`;
|
||||
@@ -81,7 +81,6 @@ describe('ReviewModal', () => {
|
||||
});
|
||||
|
||||
render(<IntlProvider locale="en" messages={{}}><ReviewModal /></IntlProvider>);
|
||||
screen.debug();
|
||||
expect(useDispatch).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
@@ -126,7 +125,6 @@ describe('ReviewModal', () => {
|
||||
});
|
||||
|
||||
render(<IntlProvider locale="en" messages={{}}><ReviewModal /></IntlProvider>);
|
||||
screen.debug();
|
||||
const loadingMessage = screen.getByText(messages.loadingResponse.defaultMessage);
|
||||
expect(loadingMessage).toBeInTheDocument();
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user