Migrated TagVisitsHeader test to react testing library

This commit is contained in:
Alejandro Celaya
2022-06-11 08:37:10 +02:00
parent 997f4a6bdc
commit 6bd628712e

View File

@@ -1,35 +1,27 @@
import { shallow, ShallowWrapper } from 'enzyme'; import { render, screen } from '@testing-library/react';
import { Mock } from 'ts-mockery'; import { Mock } from 'ts-mockery';
import { Tag } from '../../src/tags/helpers/Tag';
import { TagVisitsHeader } from '../../src/visits/TagVisitsHeader'; import { TagVisitsHeader } from '../../src/visits/TagVisitsHeader';
import { TagVisits } from '../../src/visits/reducers/tagVisits'; import { TagVisits } from '../../src/visits/reducers/tagVisits';
import { ColorGenerator } from '../../src/utils/services/ColorGenerator'; import { ColorGenerator } from '../../src/utils/services/ColorGenerator';
describe('<TagVisitsHeader />', () => { describe('<TagVisitsHeader />', () => {
let wrapper: ShallowWrapper;
const tagVisits = Mock.of<TagVisits>({ const tagVisits = Mock.of<TagVisits>({
tag: 'foo', tag: 'foo',
visits: [{}, {}, {}], visits: [{}, {}, {}, {}],
}); });
const goBack = jest.fn(); const goBack = jest.fn();
const colorGenerator = Mock.of<ColorGenerator>({ isColorLightForKey: () => false, getColorForKey: () => 'red' });
beforeEach(() => { const setUp = () => render(<TagVisitsHeader tagVisits={tagVisits} goBack={goBack} colorGenerator={colorGenerator} />);
wrapper = shallow(
<TagVisitsHeader tagVisits={tagVisits} goBack={goBack} colorGenerator={Mock.all<ColorGenerator>()} />,
);
});
afterEach(() => wrapper.unmount());
it('shows expected visits', () => { it('shows expected visits', () => {
expect(wrapper.prop('visits')).toEqual(tagVisits.visits); const { container } = setUp();
expect(screen.getAllByText('Visits for')).toHaveLength(2);
expect(container.querySelector('.badge:not(.tag)')).toHaveTextContent(`Visits: ${tagVisits.visits.length}`);
}); });
it('shows title for tag', () => { it('shows title for tag', () => {
const title = shallow(wrapper.prop('title')); const { container } = setUp();
const tag = title.find(Tag).first(); expect(container.querySelector('.badge.tag')).toHaveTextContent(tagVisits.tag);
expect(tag.prop('text')).toEqual(tagVisits.tag);
title.unmount();
}); });
}); });