Migrated ShlinkApiError test from enzyme to react testing library

This commit is contained in:
Alejandro Celaya 2022-05-02 19:34:33 +02:00
parent 337bfc47c1
commit e8a5eadd2b

View file

@ -1,26 +1,20 @@
import { shallow, ShallowWrapper } from 'enzyme'; import { render, screen } from '@testing-library/react';
import { Mock } from 'ts-mockery'; import { Mock } from 'ts-mockery';
import { ShlinkApiError, ShlinkApiErrorProps } from '../../src/api/ShlinkApiError'; import { ShlinkApiError, ShlinkApiErrorProps } from '../../src/api/ShlinkApiError';
import { InvalidArgumentError, ProblemDetailsError } from '../../src/api/types'; import { InvalidArgumentError, ProblemDetailsError } from '../../src/api/types';
describe('<ShlinkApiError />', () => { describe('<ShlinkApiError />', () => {
let commonWrapper: ShallowWrapper; const setUp = (props: ShlinkApiErrorProps) => render(<ShlinkApiError {...props} />);
const createWrapper = (props: ShlinkApiErrorProps) => {
commonWrapper = shallow(<ShlinkApiError {...props} />);
return commonWrapper;
};
afterEach(() => commonWrapper?.unmount());
it.each([ it.each([
[undefined, 'the fallback', 'the fallback'], [undefined, 'the fallback', 'the fallback'],
[Mock.all<ProblemDetailsError>(), 'the fallback', 'the fallback'], [Mock.all<ProblemDetailsError>(), 'the fallback', 'the fallback'],
[Mock.of<ProblemDetailsError>({ detail: 'the detail' }), 'the fallback', 'the detail'], [Mock.of<ProblemDetailsError>({ detail: 'the detail' }), 'the fallback', 'the detail'],
])('renders proper message', (errorData, fallbackMessage, expectedMessage) => { ])('renders proper message', (errorData, fallbackMessage, expectedMessage) => {
const wrapper = createWrapper({ errorData, fallbackMessage }); const { container } = setUp({ errorData, fallbackMessage });
expect(wrapper.text()).toContain(expectedMessage); expect(container.firstChild).toHaveTextContent(expectedMessage);
expect(screen.queryByRole('paragraph')).not.toBeInTheDocument();
}); });
it.each([ it.each([
@ -28,9 +22,7 @@ describe('<ShlinkApiError />', () => {
[Mock.all<ProblemDetailsError>(), 0], [Mock.all<ProblemDetailsError>(), 0],
[Mock.of<InvalidArgumentError>({ type: 'INVALID_ARGUMENT', invalidElements: [] }), 1], [Mock.of<InvalidArgumentError>({ type: 'INVALID_ARGUMENT', invalidElements: [] }), 1],
])('renders list of invalid elements when provided error is an InvalidError', (errorData, expectedElementsCount) => { ])('renders list of invalid elements when provided error is an InvalidError', (errorData, expectedElementsCount) => {
const wrapper = createWrapper({ errorData }); setUp({ errorData });
const p = wrapper.find('p'); expect(screen.queryAllByText(/^Invalid elements/)).toHaveLength(expectedElementsCount);
expect(p).toHaveLength(expectedElementsCount);
}); });
}); });