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
|
import { GlLoadingIcon } from '@gitlab/ui';
import { shallowMount, createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';
import testReports from 'test_fixtures/pipelines/test_report.json';
import { extendedWrapper } from 'helpers/vue_test_utils_helper';
import EmptyState from '~/pipelines/components/test_reports/empty_state.vue';
import TestReports from '~/pipelines/components/test_reports/test_reports.vue';
import TestSummary from '~/pipelines/components/test_reports/test_summary.vue';
import TestSummaryTable from '~/pipelines/components/test_reports/test_summary_table.vue';
import * as getters from '~/pipelines/stores/test_reports/getters';
const localVue = createLocalVue();
localVue.use(Vuex);
describe('Test reports app', () => {
let wrapper;
let store;
const loadingSpinner = () => wrapper.findComponent(GlLoadingIcon);
const testsDetail = () => wrapper.findByTestId('tests-detail');
const emptyState = () => wrapper.findComponent(EmptyState);
const testSummary = () => wrapper.findComponent(TestSummary);
const testSummaryTable = () => wrapper.findComponent(TestSummaryTable);
const actionSpies = {
fetchTestSuite: jest.fn(),
fetchSummary: jest.fn(),
setSelectedSuiteIndex: jest.fn(),
removeSelectedSuiteIndex: jest.fn(),
};
const createComponent = ({ state = {} } = {}) => {
store = new Vuex.Store({
state: {
isLoading: false,
selectedSuiteIndex: null,
testReports,
...state,
},
actions: actionSpies,
getters,
});
wrapper = extendedWrapper(
shallowMount(TestReports, {
store,
localVue,
}),
);
};
afterEach(() => {
wrapper.destroy();
});
describe('when component is created', () => {
it('should call fetchSummary when pipeline has test report', () => {
createComponent();
expect(actionSpies.fetchSummary).toHaveBeenCalled();
});
});
describe('when loading', () => {
beforeEach(() => createComponent({ state: { isLoading: true } }));
it('shows the loading spinner', () => {
expect(emptyState().exists()).toBe(false);
expect(testsDetail().exists()).toBe(false);
expect(loadingSpinner().exists()).toBe(true);
});
});
describe('when the api returns no data', () => {
it('displays empty state component', () => {
createComponent({ state: { testReports: {} } });
expect(emptyState().exists()).toBe(true);
});
});
describe('when the api returns data', () => {
beforeEach(() => createComponent());
it('sets testReports and shows tests', () => {
expect(wrapper.vm.testReports).toBeTruthy();
expect(wrapper.vm.showTests).toBeTruthy();
});
it('shows tests details', () => {
expect(testsDetail().exists()).toBe(true);
});
});
describe('when a suite is clicked', () => {
beforeEach(() => {
createComponent({ state: { hasFullReport: true } });
testSummaryTable().vm.$emit('row-click', 0);
});
it('should call setSelectedSuiteIndex and fetchTestSuite', () => {
expect(actionSpies.setSelectedSuiteIndex).toHaveBeenCalled();
expect(actionSpies.fetchTestSuite).toHaveBeenCalled();
});
});
describe('when clicking back to summary', () => {
beforeEach(() => {
createComponent({ state: { selectedSuiteIndex: 0 } });
testSummary().vm.$emit('on-back-click');
});
it('should call removeSelectedSuiteIndex', () => {
expect(actionSpies.removeSelectedSuiteIndex).toHaveBeenCalled();
});
});
});
|
