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
|
import MockAdapter from 'axios-mock-adapter';
import { TEST_HOST } from 'spec/test_constants';
import GpgBadges from '~/gpg_badges';
import axios from '~/lib/utils/axios_utils';
describe('GpgBadges', () => {
let mock;
const dummyCommitSha = 'n0m0rec0ffee';
const dummyBadgeHtml = 'dummy html';
const dummyResponse = {
signatures: [
{
commit_sha: dummyCommitSha,
html: dummyBadgeHtml,
},
],
};
const dummyUrl = `${TEST_HOST}/dummy/signatures`;
const setForm = ({ utf8 = '✓', search = '' } = {}) => {
setFixtures(`
<form
class="commits-search-form js-signature-container" data-signatures-path="${dummyUrl}" action="${dummyUrl}"
method="get">
<input name="utf8" type="hidden" value="${utf8}">
<input type="search" name="search" value="${search}" id="commits-search"class="form-control search-text-input input-short">
</form>
<div class="parent-container">
<div class="js-loading-gpg-badge" data-commit-sha="${dummyCommitSha}"></div>
</div>
`);
};
beforeEach(() => {
mock = new MockAdapter(axios);
setForm();
});
afterEach(() => {
mock.restore();
});
it('does not make a request if there is no container element', (done) => {
setFixtures('');
jest.spyOn(axios, 'get').mockImplementation(() => {});
GpgBadges.fetch()
.then(() => {
expect(axios.get).not.toHaveBeenCalled();
})
.then(done)
.catch(done.fail);
});
it('throws an error if the endpoint is missing', (done) => {
setFixtures('<div class="js-signature-container"></div>');
jest.spyOn(axios, 'get').mockImplementation(() => {});
GpgBadges.fetch()
.then(() => done.fail('Expected error to be thrown'))
.catch((error) => {
expect(error.message).toBe('Missing commit signatures endpoint!');
expect(axios.get).not.toHaveBeenCalled();
})
.then(done)
.catch(done.fail);
});
it('fetches commit signatures', async () => {
mock.onGet(dummyUrl).replyOnce(200);
await GpgBadges.fetch();
expect(mock.history.get).toHaveLength(1);
expect(mock.history.get[0]).toMatchObject({
params: { search: '', utf8: '✓' },
url: dummyUrl,
});
});
it('fetches commit signatures with search parameters with spaces', async () => {
mock.onGet(dummyUrl).replyOnce(200);
setForm({ search: 'my search' });
await GpgBadges.fetch();
expect(mock.history.get).toHaveLength(1);
expect(mock.history.get[0]).toMatchObject({
params: { search: 'my search', utf8: '✓' },
url: dummyUrl,
});
});
it('fetches commit signatures with search parameters with plus symbols', async () => {
mock.onGet(dummyUrl).replyOnce(200);
setForm({ search: 'my+search' });
await GpgBadges.fetch();
expect(mock.history.get).toHaveLength(1);
expect(mock.history.get[0]).toMatchObject({
params: { search: 'my+search', utf8: '✓' },
url: dummyUrl,
});
});
it('displays a loading spinner', (done) => {
mock.onGet(dummyUrl).replyOnce(200);
GpgBadges.fetch()
.then(() => {
expect(document.querySelector('.js-loading-gpg-badge:empty')).toBe(null);
const spinners = document.querySelectorAll('.js-loading-gpg-badge span.gl-spinner');
expect(spinners.length).toBe(1);
done();
})
.catch(done.fail);
});
it('replaces the loading spinner', (done) => {
mock.onGet(dummyUrl).replyOnce(200, dummyResponse);
GpgBadges.fetch()
.then(() => {
expect(document.querySelector('.js-loading-gpg-badge')).toBe(null);
const parentContainer = document.querySelector('.parent-container');
expect(parentContainer.innerHTML.trim()).toEqual(dummyBadgeHtml);
done();
})
.catch(done.fail);
});
});
|
