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
|
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
import { GlCollapsibleListbox } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import searchUsersQuery from '~/graphql_shared/queries/users_search_all.query.graphql';
import createMockApollo from 'helpers/mock_apollo_helper';
import UserSelect from '~/pages/import/fogbugz/new_user_map/components/user_select.vue';
Vue.use(VueApollo);
const USERS_RESPONSE = {
data: {
users: {
nodes: [
{
id: 'gid://gitlab/User/44',
avatarUrl: '/avatar1',
webUrl: '/reported_user_22',
name: 'Birgit Steuber',
username: 'reported_user_22',
__typename: 'UserCore',
},
{
id: 'gid://gitlab/User/43',
avatarUrl: '/avatar2',
webUrl: '/reported_user_21',
name: 'Luke Spinka',
username: 'reported_user_21',
__typename: 'UserCore',
},
],
__typename: 'UserCoreConnection',
},
},
};
describe('fogbugz user select component', () => {
let wrapper;
const searchQueryHandlerSuccess = jest.fn().mockResolvedValue(USERS_RESPONSE);
const createComponent = (propsData = { name: 'demo' }) => {
const fakeApollo = createMockApollo([[searchUsersQuery, searchQueryHandlerSuccess]]);
wrapper = shallowMount(UserSelect, {
apolloProvider: fakeApollo,
propsData,
});
};
it('renders hidden input with name from props', () => {
const name = 'test';
createComponent({ name });
expect(wrapper.find('input').attributes('name')).toBe(name);
});
it('syncs input value with value emitted from listbox', async () => {
createComponent();
const id = 8;
wrapper.findComponent(GlCollapsibleListbox).vm.$emit('select', `gid://gitlab/User/${id}`);
await nextTick();
expect(wrapper.get('input').attributes('value')).toBe(id.toString());
});
it('filters users when search is performed in listbox', async () => {
createComponent();
jest.runOnlyPendingTimers();
wrapper.findComponent(GlCollapsibleListbox).vm.$emit('search', 'test');
await nextTick();
jest.runOnlyPendingTimers();
expect(searchQueryHandlerSuccess).toHaveBeenCalledWith({
first: expect.anything(),
search: 'test',
});
});
});
|
