87 lines
2.5 KiB
JavaScript
87 lines
2.5 KiB
JavaScript
import { shallowMount } from '@vue/test-utils';
|
|
import GroupedIssuesList from '~/reports/components/grouped_issues_list.vue';
|
|
import ReportItem from '~/reports/components/report_item.vue';
|
|
import SmartVirtualList from '~/vue_shared/components/smart_virtual_list.vue';
|
|
|
|
describe('Grouped Issues List', () => {
|
|
let wrapper;
|
|
|
|
const createComponent = ({ propsData = {}, stubs = {} } = {}) => {
|
|
wrapper = shallowMount(GroupedIssuesList, {
|
|
propsData,
|
|
stubs,
|
|
});
|
|
};
|
|
|
|
const findHeading = groupName => wrapper.find(`[data-testid="${groupName}Heading"`);
|
|
|
|
afterEach(() => {
|
|
wrapper.destroy();
|
|
wrapper = null;
|
|
});
|
|
|
|
it('renders a smart virtual list with the correct props', () => {
|
|
createComponent({
|
|
propsData: {
|
|
resolvedIssues: [{ name: 'foo' }],
|
|
unresolvedIssues: [{ name: 'bar' }],
|
|
},
|
|
stubs: {
|
|
SmartVirtualList,
|
|
},
|
|
});
|
|
|
|
expect(wrapper.find(SmartVirtualList).props()).toMatchSnapshot();
|
|
});
|
|
|
|
describe('without data', () => {
|
|
beforeEach(createComponent);
|
|
|
|
it.each(['unresolved', 'resolved'])('does not a render a header for %s issues', issueName => {
|
|
expect(findHeading(issueName).exists()).toBe(false);
|
|
});
|
|
|
|
it.each('resolved', 'unresolved')('does not render report items for %s issues', () => {
|
|
expect(wrapper.find(ReportItem).exists()).toBe(false);
|
|
});
|
|
});
|
|
|
|
describe('with data', () => {
|
|
it.each`
|
|
givenIssues | givenHeading | groupName
|
|
${[{ name: 'foo issue' }]} | ${'Foo Heading'} | ${'resolved'}
|
|
${[{ name: 'bar issue' }]} | ${'Bar Heading'} | ${'unresolved'}
|
|
`('renders the heading for $groupName issues', ({ givenIssues, givenHeading, groupName }) => {
|
|
createComponent({
|
|
propsData: { [`${groupName}Issues`]: givenIssues, [`${groupName}Heading`]: givenHeading },
|
|
});
|
|
|
|
expect(findHeading(groupName).text()).toBe(givenHeading);
|
|
});
|
|
|
|
it.each(['resolved', 'unresolved'])('renders all %s issues', issueName => {
|
|
const issues = [{ name: 'foo' }, { name: 'bar' }];
|
|
|
|
createComponent({
|
|
propsData: { [`${issueName}Issues`]: issues },
|
|
});
|
|
|
|
expect(wrapper.findAll(ReportItem)).toHaveLength(issues.length);
|
|
});
|
|
|
|
it('renders a report item with the correct props', () => {
|
|
createComponent({
|
|
propsData: {
|
|
resolvedIssues: [{ name: 'foo' }],
|
|
component: 'TestIssueBody',
|
|
},
|
|
stubs: {
|
|
ReportItem,
|
|
},
|
|
});
|
|
|
|
expect(wrapper.find(ReportItem).props()).toMatchSnapshot();
|
|
});
|
|
});
|
|
});
|