2022-05-13 09:07:54 +00:00
|
|
|
import { GlBadge, GlIcon } from '@gitlab/ui';
|
2021-02-14 18:09:20 +00:00
|
|
|
import { shallowMount } from '@vue/test-utils';
|
2021-05-04 12:10:04 +00:00
|
|
|
import StatusBox from '~/issuable/components/status_box.vue';
|
2021-01-11 18:10:43 +00:00
|
|
|
|
|
|
|
let wrapper;
|
|
|
|
|
|
|
|
function factory(propsData) {
|
2022-05-13 09:07:54 +00:00
|
|
|
wrapper = shallowMount(StatusBox, { propsData, stubs: { GlBadge } });
|
2021-01-11 18:10:43 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
describe('Merge request status box component', () => {
|
2022-05-13 09:07:54 +00:00
|
|
|
const findBadge = () => wrapper.findComponent(GlBadge);
|
|
|
|
|
2021-01-11 18:10:43 +00:00
|
|
|
afterEach(() => {
|
|
|
|
wrapper.destroy();
|
|
|
|
wrapper = null;
|
|
|
|
});
|
|
|
|
|
2022-05-13 09:07:54 +00:00
|
|
|
describe.each`
|
|
|
|
issuableType | badgeText | initialState | badgeClass | badgeVariant | badgeIcon
|
|
|
|
${'merge_request'} | ${'Open'} | ${'opened'} | ${'issuable-status-badge-open'} | ${'success'} | ${'merge-request-open'}
|
|
|
|
${'merge_request'} | ${'Closed'} | ${'closed'} | ${'issuable-status-badge-closed'} | ${'danger'} | ${'merge-request-close'}
|
|
|
|
${'merge_request'} | ${'Merged'} | ${'merged'} | ${'issuable-status-badge-merged'} | ${'info'} | ${'merge'}
|
|
|
|
${'issue'} | ${'Open'} | ${'opened'} | ${'issuable-status-badge-open'} | ${'success'} | ${'issues'}
|
|
|
|
${'issue'} | ${'Closed'} | ${'closed'} | ${'issuable-status-badge-closed'} | ${'info'} | ${'issue-closed'}
|
|
|
|
`(
|
|
|
|
'with issuableType set to "$issuableType" and state set to "$initialState"',
|
|
|
|
({ issuableType, badgeText, initialState, badgeClass, badgeVariant, badgeIcon }) => {
|
|
|
|
beforeEach(() => {
|
2021-01-11 18:10:43 +00:00
|
|
|
factory({
|
2022-05-13 09:07:54 +00:00
|
|
|
initialState,
|
|
|
|
issuableType,
|
2021-01-11 18:10:43 +00:00
|
|
|
});
|
2022-05-13 09:07:54 +00:00
|
|
|
});
|
2021-01-11 18:10:43 +00:00
|
|
|
|
2022-05-13 09:07:54 +00:00
|
|
|
it(`renders badge with text '${badgeText}'`, () => {
|
|
|
|
expect(findBadge().text()).toBe(badgeText);
|
2021-01-11 18:10:43 +00:00
|
|
|
});
|
|
|
|
|
2022-05-13 09:07:54 +00:00
|
|
|
it(`sets badge css class as '${badgeClass}'`, () => {
|
|
|
|
expect(findBadge().classes()).toContain(badgeClass);
|
|
|
|
});
|
2021-01-11 18:10:43 +00:00
|
|
|
|
2022-05-13 09:07:54 +00:00
|
|
|
it(`sets badge variant as '${badgeVariant}`, () => {
|
|
|
|
expect(findBadge().props('variant')).toBe(badgeVariant);
|
2021-01-11 18:10:43 +00:00
|
|
|
});
|
2022-05-13 09:07:54 +00:00
|
|
|
|
|
|
|
it(`sets badge icon as '${badgeIcon}'`, () => {
|
|
|
|
expect(findBadge().findComponent(GlIcon).props('name')).toBe(badgeIcon);
|
|
|
|
});
|
|
|
|
},
|
|
|
|
);
|
2021-01-11 18:10:43 +00:00
|
|
|
});
|