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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
|
import { GlAlert } from '@gitlab/ui';
import { shallowMount, createLocalVue } from '@vue/test-utils';
import VueApollo from 'vue-apollo';
import { nextTick } from 'vue';
import createMockApollo from 'helpers/mock_apollo_helper';
import waitForPromises from 'helpers/wait_for_promises';
import PackagesSettings from '~/packages_and_registries/settings/group/components/packages_settings.vue';
import DependencyProxySettings from '~/packages_and_registries/settings/group/components/dependency_proxy_settings.vue';
import component from '~/packages_and_registries/settings/group/components/group_settings_app.vue';
import getGroupPackagesSettingsQuery from '~/packages_and_registries/settings/group/graphql/queries/get_group_packages_settings.query.graphql';
import {
groupPackageSettingsMock,
packageSettings,
dependencyProxySettings,
dependencyProxyImageTtlPolicy,
} from '../mock_data';
jest.mock('~/flash');
const localVue = createLocalVue();
describe('Group Settings App', () => {
let wrapper;
let apolloProvider;
let show;
const defaultProvide = {
defaultExpanded: false,
groupPath: 'foo_group_path',
dependencyProxyAvailable: true,
};
const mountComponent = ({
resolver = jest.fn().mockResolvedValue(groupPackageSettingsMock),
provide = defaultProvide,
} = {}) => {
localVue.use(VueApollo);
const requestHandlers = [[getGroupPackagesSettingsQuery, resolver]];
apolloProvider = createMockApollo(requestHandlers);
wrapper = shallowMount(component, {
localVue,
apolloProvider,
provide,
mocks: {
$toast: {
show,
},
},
});
};
beforeEach(() => {
show = jest.fn();
});
afterEach(() => {
wrapper.destroy();
});
const findAlert = () => wrapper.findComponent(GlAlert);
const findPackageSettings = () => wrapper.findComponent(PackagesSettings);
const findDependencyProxySettings = () => wrapper.findComponent(DependencyProxySettings);
const waitForApolloQueryAndRender = async () => {
await waitForPromises();
await nextTick();
};
const packageSettingsProps = { packageSettings: packageSettings() };
const dependencyProxyProps = {
dependencyProxySettings: dependencyProxySettings(),
dependencyProxyImageTtlPolicy: dependencyProxyImageTtlPolicy(),
};
describe.each`
finder | entitySpecificProps | successMessage | errorMessage
${findPackageSettings} | ${packageSettingsProps} | ${'Settings saved successfully'} | ${'An error occurred while saving the settings'}
${findDependencyProxySettings} | ${dependencyProxyProps} | ${'Setting saved successfully'} | ${'An error occurred while saving the setting'}
`('settings blocks', ({ finder, entitySpecificProps, successMessage, errorMessage }) => {
beforeEach(() => {
mountComponent();
return waitForApolloQueryAndRender();
});
it('renders the settings block', () => {
expect(finder().exists()).toBe(true);
});
it('binds the correctProps', () => {
expect(finder().props()).toMatchObject({
isLoading: false,
...entitySpecificProps,
});
});
describe('success event', () => {
it('shows a success toast', () => {
finder().vm.$emit('success');
expect(show).toHaveBeenCalledWith(successMessage);
});
it('hides the error alert', async () => {
finder().vm.$emit('error');
await nextTick();
expect(findAlert().exists()).toBe(true);
finder().vm.$emit('success');
await nextTick();
expect(findAlert().exists()).toBe(false);
});
});
describe('error event', () => {
beforeEach(() => {
finder().vm.$emit('error');
return nextTick();
});
it('shows an alert', () => {
expect(findAlert().exists()).toBe(true);
});
it('alert has the right text', () => {
expect(findAlert().text()).toBe(errorMessage);
});
it('dismissing the alert removes it', async () => {
expect(findAlert().exists()).toBe(true);
findAlert().vm.$emit('dismiss');
await nextTick();
expect(findAlert().exists()).toBe(false);
});
});
});
describe('when the dependency proxy is not available', () => {
beforeEach(() => {
mountComponent({ provide: { ...defaultProvide, dependencyProxyAvailable: false } });
return waitForApolloQueryAndRender();
});
it('the setting block is hidden', () => {
expect(findDependencyProxySettings().exists()).toBe(false);
});
});
});
|
