1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
|
import { GlLink, GlSprintf, GlAlert } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import component from '~/packages_and_registries/container_registry/explorer/components/details_page/status_alert.vue';
import {
DELETE_SCHEDULED,
DELETE_FAILED,
PACKAGE_DELETE_HELP_PAGE_PATH,
SCHEDULED_FOR_DELETION_STATUS_TITLE,
SCHEDULED_FOR_DELETION_STATUS_MESSAGE,
FAILED_DELETION_STATUS_TITLE,
FAILED_DELETION_STATUS_MESSAGE,
} from '~/packages_and_registries/container_registry/explorer/constants';
describe('Status Alert', () => {
let wrapper;
const findLink = () => wrapper.find(GlLink);
const findAlert = () => wrapper.find(GlAlert);
const findMessage = () => wrapper.find('[data-testid="message"]');
const mountComponent = (propsData) => {
wrapper = shallowMount(component, {
propsData,
stubs: {
GlSprintf,
},
});
};
afterEach(() => {
wrapper.destroy();
wrapper = null;
});
it.each`
status | title | variant | message | link
${DELETE_SCHEDULED} | ${SCHEDULED_FOR_DELETION_STATUS_TITLE} | ${'info'} | ${SCHEDULED_FOR_DELETION_STATUS_MESSAGE} | ${PACKAGE_DELETE_HELP_PAGE_PATH}
${DELETE_FAILED} | ${FAILED_DELETION_STATUS_TITLE} | ${'warning'} | ${FAILED_DELETION_STATUS_MESSAGE} | ${''}
`(
`when the status is $status, title is $title, variant is $variant, message is $message and the link is $link`,
({ status, title, variant, message, link }) => {
mountComponent({ status });
expect(findMessage().text()).toMatchInterpolatedText(message);
expect(findAlert().props()).toMatchObject({
title,
variant,
});
if (link) {
expect(findLink().attributes()).toMatchObject({
target: '_blank',
href: link,
});
}
},
);
});
|