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
|
import { GlBadge } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import RunnerJobStatusBadge from '~/ci/runner/components/runner_job_status_badge.vue';
import {
I18N_JOB_STATUS_RUNNING,
I18N_JOB_STATUS_IDLE,
JOB_STATUS_RUNNING,
JOB_STATUS_IDLE,
} from '~/ci/runner/constants';
describe('RunnerTypeBadge', () => {
let wrapper;
const findBadge = () => wrapper.findComponent(GlBadge);
const createComponent = ({ props, ...options } = {}) => {
wrapper = shallowMount(RunnerJobStatusBadge, {
propsData: {
...props,
},
...options,
});
};
it.each`
jobStatus | classes | text
${JOB_STATUS_RUNNING} | ${['gl-mr-3', 'gl-bg-transparent!', 'gl-text-blue-600!', 'gl-border', 'gl-border-blue-600!']} | ${I18N_JOB_STATUS_RUNNING}
${JOB_STATUS_IDLE} | ${['gl-mr-3', 'gl-bg-transparent!', 'gl-text-gray-700!', 'gl-border', 'gl-border-gray-500!']} | ${I18N_JOB_STATUS_IDLE}
`(
'renders $jobStatus job status with "$text" text and styles',
({ jobStatus, classes, text }) => {
createComponent({ props: { jobStatus } });
expect(findBadge().props()).toMatchObject({ size: 'sm', variant: 'muted' });
expect(findBadge().classes().sort()).toEqual(classes.sort());
expect(findBadge().text()).toBe(text);
},
);
it('does not render an unknown status', () => {
createComponent({ props: { jobStatus: 'UNKNOWN_STATUS' } });
expect(wrapper.html()).toBe('');
});
it('adds arbitrary attributes', () => {
createComponent({ props: { jobStatus: JOB_STATUS_RUNNING }, attrs: { href: '/url' } });
expect(findBadge().attributes('href')).toBe('/url');
});
});
|