mirrors/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2025-01-09 01:37:24 +03:00
Code Issues Projects Releases Packages Wiki Activity

Migrated NavPills test to react testing library

Browse source
This commit is contained in:
Alejandro Celaya 2022-06-11 09:14:51 +02:00
parent 84435714f5
commit 59087ced8a
1 changed files with 36 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

57
test/utils/NavPills.test.tsx
View file

@ -1,20 +1,28 @@
import { shallow } from 'enzyme';
import { Card, Nav } from 'reactstrap';
/* eslint-disable no-console */
import { render, screen } from '@testing-library/react';
import { MemoryRouter } from 'react-router-dom';
import { NavPillItem, NavPills } from '../../src/utils/NavPills';
describe('<NavPills />', () => {
let originalError: typeof console.error;
beforeEach(() => {
originalError = console.error;
console.error = () => {}; // Suppress errors logged during this test
});
afterEach(() => {
console.error = originalError;
});
it.each([
['Foo'],
[<span key="1">Hi!</span>],
[[<NavPillItem key="1" to="" />, <span key="2">Hi!</span>]],
])('throws error when any of the children is not a NavPillItem', (children) => {
expect.assertions(1);
try {
shallow(<NavPills>{children}</NavPills>);
} catch (e: any) {
expect(e.message).toEqual('Only NavPillItem children are allowed inside NavPills.');
}
expect(() => render(<NavPills>{children}</NavPills>)).toThrow(
'Only NavPillItem children are allowed inside NavPills.',
);
});
it.each([
@ -22,20 +30,27 @@ describe('<NavPills />', () => {
[true],
[false],
])('renders provided items', (fill) => {
const wrapper = shallow(
<NavPills fill={fill}>
<NavPillItem to="1">1</NavPillItem>
<NavPillItem to="2">2</NavPillItem>
<NavPillItem to="3">3</NavPillItem>
</NavPills>,
const { container } = render(
<MemoryRouter>
<NavPills fill={fill}>
<NavPillItem to="1">1</NavPillItem>
<NavPillItem to="2">2</NavPillItem>
<NavPillItem to="3">3</NavPillItem>
</NavPills>
</MemoryRouter>,
);
const card = wrapper.find(Card);
const nav = wrapper.find(Nav);
expect(card).toHaveLength(1);
expect(card.prop('body')).toEqual(true);
expect(nav).toHaveLength(1);
expect(nav.prop('pills')).toEqual(true);
expect(nav.prop('fill')).toEqual(!!fill);
const links = screen.getAllByRole('link');
expect(links).toHaveLength(3);
links.forEach((link, index) => {
expect(link).toHaveTextContent(`${index + 1}`);
expect(link).toHaveAttribute('href', `/${index + 1}`);
});
if (fill) {
expect(container.querySelector('.nav')).toHaveClass('nav-fill');
} else {
expect(container.querySelector('.nav')).not.toHaveClass('nav-fill');
}
});
});