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
|
import { GlEmptyState } from '@gitlab/ui';
import * as Sentry from '@sentry/browser';
import { mount } from '@vue/test-utils';
import ensureData from '~/ensure_data';
const mockData = { message: 'Hello there' };
const defaultOptions = {
parseData: () => mockData,
data: mockData,
};
const MockChildComponent = {
inject: ['message'],
render(createElement) {
return createElement('h1', this.message);
},
};
const MockParentComponent = {
components: {
MockChildComponent,
},
props: {
message: {
type: String,
required: true,
},
otherProp: {
type: Boolean,
default: false,
required: false,
},
},
render(createElement) {
return createElement('div', [this.message, createElement(MockChildComponent)]);
},
};
describe('EnsureData', () => {
let wrapper;
function findEmptyState() {
return wrapper.findComponent(GlEmptyState);
}
function findChild() {
return wrapper.findComponent(MockChildComponent);
}
function findParent() {
return wrapper.findComponent(MockParentComponent);
}
function createComponent(options = defaultOptions) {
return mount(ensureData(MockParentComponent, options));
}
beforeEach(() => {
Sentry.captureException = jest.fn();
});
afterEach(() => {
wrapper.destroy();
Sentry.captureException.mockClear();
});
describe('when parseData throws', () => {
it('should render GlEmptyState', () => {
wrapper = createComponent({
parseData: () => {
throw new Error();
},
});
expect(findParent().exists()).toBe(false);
expect(findChild().exists()).toBe(false);
expect(findEmptyState().exists()).toBe(true);
});
it('should not log to Sentry when shouldLog=false (default)', () => {
wrapper = createComponent({
parseData: () => {
throw new Error();
},
});
expect(Sentry.captureException).not.toHaveBeenCalled();
});
it('should log to Sentry when shouldLog=true', () => {
const error = new Error('Error!');
wrapper = createComponent({
parseData: () => {
throw error;
},
shouldLog: true,
});
expect(Sentry.captureException).toHaveBeenCalledWith(error);
});
});
describe('when parseData succeeds', () => {
it('should render MockParentComponent and MockChildComponent', () => {
wrapper = createComponent();
expect(findEmptyState().exists()).toBe(false);
expect(findParent().exists()).toBe(true);
expect(findChild().exists()).toBe(true);
});
it('enables user to provide data to child components', () => {
wrapper = createComponent();
const childComponent = findChild();
expect(childComponent.text()).toBe(mockData.message);
});
it('enables user to override provide data', () => {
const message = 'Another message';
wrapper = createComponent({ ...defaultOptions, provide: { message } });
const childComponent = findChild();
expect(childComponent.text()).toBe(message);
});
it('enables user to pass props to parent component', () => {
wrapper = createComponent();
expect(findParent().props()).toMatchObject(mockData);
});
it('enables user to override props data', () => {
const props = { message: 'Another message', otherProp: true };
wrapper = createComponent({ ...defaultOptions, props });
expect(findParent().props()).toMatchObject(props);
});
it('should not log to Sentry when shouldLog=true', () => {
wrapper = createComponent({ ...defaultOptions, shouldLog: true });
expect(Sentry.captureException).not.toHaveBeenCalled();
});
});
});
|
