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
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
|
import Vue from 'vue';
import { GlFormCheckbox } from '@gitlab/ui';
import VueApollo from 'vue-apollo';
import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
import RunnerBulkDeleteCheckbox from '~/runner/components/runner_bulk_delete_checkbox.vue';
import createMockApollo from 'helpers/mock_apollo_helper';
import { createLocalState } from '~/runner/graphql/list/local_state';
import { allRunnersData } from '../mock_data';
Vue.use(VueApollo);
jest.mock('~/flash');
describe('RunnerBulkDeleteCheckbox', () => {
let wrapper;
let mockState;
let mockCheckedRunnerIds;
const findCheckbox = () => wrapper.findComponent(GlFormCheckbox);
const mockRunners = allRunnersData.data.runners.nodes;
const mockIds = allRunnersData.data.runners.nodes.map(({ id }) => id);
const mockId = mockIds[0];
const mockIdAnotherPage = 'RUNNER_IN_ANOTHER_PAGE_ID';
const createComponent = ({ props = {} } = {}) => {
const { cacheConfig, localMutations } = mockState;
const apolloProvider = createMockApollo(undefined, undefined, cacheConfig);
wrapper = shallowMountExtended(RunnerBulkDeleteCheckbox, {
apolloProvider,
provide: {
localMutations,
},
propsData: {
runners: mockRunners,
...props,
},
});
};
beforeEach(() => {
mockState = createLocalState();
jest
.spyOn(mockState.cacheConfig.typePolicies.Query.fields, 'checkedRunnerIds')
.mockImplementation(() => mockCheckedRunnerIds);
jest.spyOn(mockState.localMutations, 'setRunnersChecked');
});
describe.each`
case | is | checkedRunnerIds | disabled | checked | indeterminate
${'no runners'} | ${'unchecked'} | ${[]} | ${undefined} | ${undefined} | ${undefined}
${'no runners in this page'} | ${'unchecked'} | ${[mockIdAnotherPage]} | ${undefined} | ${undefined} | ${undefined}
${'all runners'} | ${'checked'} | ${mockIds} | ${undefined} | ${'true'} | ${undefined}
${'some runners'} | ${'indeterminate'} | ${[mockId]} | ${undefined} | ${undefined} | ${'true'}
${'all plus other runners'} | ${'checked'} | ${[...mockIds, mockIdAnotherPage]} | ${undefined} | ${'true'} | ${undefined}
`('When $case are checked', ({ is, checkedRunnerIds, disabled, checked, indeterminate }) => {
beforeEach(async () => {
mockCheckedRunnerIds = checkedRunnerIds;
createComponent();
});
it(`is ${is}`, () => {
expect(findCheckbox().attributes('disabled')).toBe(disabled);
expect(findCheckbox().attributes('checked')).toBe(checked);
expect(findCheckbox().attributes('indeterminate')).toBe(indeterminate);
});
});
describe('When user selects', () => {
beforeEach(() => {
mockCheckedRunnerIds = mockIds;
createComponent();
});
it.each([[true], [false]])('sets checked to %s', (checked) => {
findCheckbox().vm.$emit('change', checked);
expect(mockState.localMutations.setRunnersChecked).toHaveBeenCalledTimes(1);
expect(mockState.localMutations.setRunnersChecked).toHaveBeenCalledWith({
isChecked: checked,
runners: mockRunners,
});
});
});
describe('When runners are loading', () => {
beforeEach(() => {
createComponent({ props: { runners: [] } });
});
it(`is disabled`, () => {
expect(findCheckbox().attributes('disabled')).toBe('true');
expect(findCheckbox().attributes('checked')).toBe(undefined);
expect(findCheckbox().attributes('indeterminate')).toBe(undefined);
});
});
});
|
