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
|
import { getByText } from '@testing-library/dom';
import MockAdapter from 'axios-mock-adapter';
import { EVENT_ISSUABLE_VUE_APP_CHANGE } from '~/issuable/constants';
import Issue from '~/issue';
import axios from '~/lib/utils/axios_utils';
describe('Issue', () => {
let testContext;
let mock;
beforeEach(() => {
mock = new MockAdapter(axios);
mock.onGet(/(.*)\/related_branches$/).reply(200, {});
testContext = {};
testContext.issue = new Issue();
});
afterEach(() => {
mock.restore();
testContext.issue.dispose();
});
const getIssueCounter = () => document.querySelector('.issue_counter');
const getOpenStatusBox = () =>
getByText(document, (_, el) => el.textContent.match(/Open/), {
selector: '.status-box-open',
});
const getClosedStatusBox = () =>
getByText(document, (_, el) => el.textContent.match(/Closed/), {
selector: '.status-box-issue-closed',
});
describe.each`
desc | isIssueInitiallyOpen | expectedCounterText
${'with an initially open issue'} | ${true} | ${'1,000'}
${'with an initially closed issue'} | ${false} | ${'1,002'}
`('$desc', ({ isIssueInitiallyOpen, expectedCounterText }) => {
beforeEach(() => {
if (isIssueInitiallyOpen) {
loadFixtures('issues/open-issue.html');
} else {
loadFixtures('issues/closed-issue.html');
}
testContext.issueCounter = getIssueCounter();
testContext.statusBoxClosed = getClosedStatusBox();
testContext.statusBoxOpen = getOpenStatusBox();
testContext.issueCounter.textContent = '1,001';
});
it(`has the proper visible status box when ${isIssueInitiallyOpen ? 'open' : 'closed'}`, () => {
if (isIssueInitiallyOpen) {
expect(testContext.statusBoxClosed).toHaveClass('hidden');
expect(testContext.statusBoxOpen).not.toHaveClass('hidden');
} else {
expect(testContext.statusBoxClosed).not.toHaveClass('hidden');
expect(testContext.statusBoxOpen).toHaveClass('hidden');
}
});
describe('when vue app triggers change', () => {
beforeEach(() => {
document.dispatchEvent(
new CustomEvent(EVENT_ISSUABLE_VUE_APP_CHANGE, {
detail: {
data: { id: 1 },
isClosed: isIssueInitiallyOpen,
},
}),
);
});
it('displays correct status box', () => {
if (isIssueInitiallyOpen) {
expect(testContext.statusBoxClosed).not.toHaveClass('hidden');
expect(testContext.statusBoxOpen).toHaveClass('hidden');
} else {
expect(testContext.statusBoxClosed).toHaveClass('hidden');
expect(testContext.statusBoxOpen).not.toHaveClass('hidden');
}
});
it('updates issueCounter text', () => {
expect(testContext.issueCounter).toBeVisible();
expect(testContext.issueCounter).toHaveText(expectedCounterText);
});
});
});
});
|
