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

Migrated TagsCards test to react testing library

Browse source
This commit is contained in:
Alejandro Celaya 2022-07-07 18:51:58 +02:00
parent 6af49a9945
commit 28b15e4a85
1 changed files with 9 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
test/tags/TagsCards.test.tsx
View file

@ -1,4 +1,5 @@
import { shallow, ShallowWrapper } from 'enzyme'; import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { Mock } from 'ts-mockery'; import { Mock } from 'ts-mockery';
import { TagsCards as createTagsCards } from '../../src/tags/TagsCards'; import { TagsCards as createTagsCards } from '../../src/tags/TagsCards';
import { SelectedServer } from '../../src/servers/data'; import { SelectedServer } from '../../src/servers/data';
@ -8,30 +9,19 @@ import { NormalizedTag } from '../../src/tags/data';
describe('<TagsCards />', () => { describe('<TagsCards />', () => {
const amountOfTags = 10; const amountOfTags = 10;
const sortedTags = rangeOf(amountOfTags, (i) => Mock.of<NormalizedTag>({ tag: `tag_${i}` })); const sortedTags = rangeOf(amountOfTags, (i) => Mock.of<NormalizedTag>({ tag: `tag_${i}` }));
const TagCard = () => null; const TagsCards = createTagsCards(() => <span>TagCard</span>);
const TagsCards = createTagsCards(TagCard); const setUp = () => ({
let wrapper: ShallowWrapper; user: userEvent.setup(),
...render(<TagsCards sortedTags={sortedTags} selectedServer={Mock.all<SelectedServer>()} />),
beforeEach(() => {
wrapper = shallow(<TagsCards sortedTags={sortedTags} selectedServer={Mock.all<SelectedServer>()} />);
}); });
afterEach(() => wrapper?.unmount());
it('renders the proper amount of groups and cards based on the amount of tags', () => { it('renders the proper amount of groups and cards based on the amount of tags', () => {
const { container } = setUp();
const amountOfGroups = 4; const amountOfGroups = 4;
const cards = wrapper.find(TagCard); const cards = screen.getAllByText('TagCard');
const groups = wrapper.find('.col-md-6'); const groups = container.querySelectorAll('.col-md-6');
expect(cards).toHaveLength(amountOfTags); expect(cards).toHaveLength(amountOfTags);
expect(groups).toHaveLength(amountOfGroups); expect(groups).toHaveLength(amountOfGroups);
}); });
it('displays card on toggle', () => {
const card = () => wrapper.find(TagCard).at(5);
expect(card().prop('displayed')).toEqual(false);
(card().prop('toggle') as Function)();
expect(card().prop('displayed')).toEqual(true);
});
}); });