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
146
147
148
149
150
151
152
|
import { shallowMount } from '@vue/test-utils';
import Line from '~/jobs/components/log/line.vue';
import LineNumber from '~/jobs/components/log/line_number.vue';
const httpUrl = 'http://example.com';
const httpsUrl = 'https://example.com';
const queryUrl = 'https://example.com?param=val';
const mockProps = ({ text = 'Running with gitlab-runner 12.1.0 (de7731dd)' } = {}) => ({
line: {
content: [
{
text,
style: 'term-fg-l-green',
},
],
lineNumber: 0,
},
path: '/jashkenas/underscore/-/jobs/335',
});
describe('Job Log Line', () => {
let wrapper;
let data;
const createComponent = (props = {}) => {
wrapper = shallowMount(Line, {
propsData: {
...props,
},
});
};
const findLine = () => wrapper.find('span');
const findLink = () => findLine().find('a');
const findLinks = () => findLine().findAll('a');
const findLinkAttributeByIndex = (i) => findLinks().at(i).attributes();
beforeEach(() => {
data = mockProps();
createComponent(data);
});
it('renders the line number component', () => {
expect(wrapper.find(LineNumber).exists()).toBe(true);
});
it('renders a span the provided text', () => {
expect(findLine().text()).toBe(data.line.content[0].text);
});
it('renders the provided style as a class attribute', () => {
expect(findLine().classes()).toContain(data.line.content[0].style);
});
describe('job urls as links', () => {
it('renders an http link', () => {
createComponent(mockProps({ text: httpUrl }));
expect(findLink().text()).toBe(httpUrl);
expect(findLink().attributes().href).toBe(httpUrl);
});
it('renders an https link', () => {
createComponent(mockProps({ text: httpsUrl }));
expect(findLink().text()).toBe(httpsUrl);
expect(findLink().attributes().href).toBe(httpsUrl);
});
it('renders a link with rel nofollow and noopener', () => {
createComponent(mockProps({ text: httpsUrl }));
expect(findLink().attributes().rel).toBe('nofollow noopener noreferrer');
});
it('renders a link with corresponding styles', () => {
createComponent(mockProps({ text: httpsUrl }));
expect(findLink().classes()).toEqual(['gl-reset-color!', 'gl-text-decoration-underline']);
});
it('renders links with queries, surrounded by questions marks', () => {
createComponent(mockProps({ text: `Did you see my url ${queryUrl}??` }));
expect(findLine().text()).toBe('Did you see my url https://example.com?param=val??');
expect(findLinkAttributeByIndex(0).href).toBe(queryUrl);
});
it('renders links with queries, surrounded by exclamation marks', () => {
createComponent(mockProps({ text: `No! The ${queryUrl}!?` }));
expect(findLine().text()).toBe('No! The https://example.com?param=val!?');
expect(findLinkAttributeByIndex(0).href).toBe(queryUrl);
});
it('renders multiple links surrounded by text', () => {
createComponent(
mockProps({ text: `Well, my HTTP url: ${httpUrl} and my HTTPS url: ${httpsUrl}` }),
);
expect(findLine().text()).toBe(
'Well, my HTTP url: http://example.com and my HTTPS url: https://example.com',
);
expect(findLinks()).toHaveLength(2);
expect(findLinkAttributeByIndex(0).href).toBe(httpUrl);
expect(findLinkAttributeByIndex(1).href).toBe(httpsUrl);
});
it('renders multiple links surrounded by text, with other symbols', () => {
createComponent(
mockProps({ text: `${httpUrl}, ${httpUrl}: ${httpsUrl}; ${httpsUrl}. ${httpsUrl}...` }),
);
expect(findLine().text()).toBe(
'http://example.com, http://example.com: https://example.com; https://example.com. https://example.com...',
);
expect(findLinks()).toHaveLength(5);
expect(findLinkAttributeByIndex(0).href).toBe(httpUrl);
expect(findLinkAttributeByIndex(1).href).toBe(httpUrl);
expect(findLinkAttributeByIndex(2).href).toBe(httpsUrl);
expect(findLinkAttributeByIndex(3).href).toBe(httpsUrl);
expect(findLinkAttributeByIndex(4).href).toBe(httpsUrl);
});
it('renders text with symbols in it', () => {
const text = 'apt-get update < /dev/null > /dev/null';
createComponent(mockProps({ text }));
expect(findLine().text()).toBe(text);
});
const jshref = 'javascript:doEvil();'; // eslint-disable-line no-script-url
it.each`
type | text
${'html link'} | ${'<a href="#">linked</a>'}
${'html script'} | ${'<script>doEvil();</script>'}
${'html strong'} | ${'<strong>highlighted</strong>'}
${'js'} | ${jshref}
${'file'} | ${'file:///a-file'}
${'ftp'} | ${'ftp://example.com/file'}
${'email'} | ${'email@example.com'}
${'no scheme'} | ${'example.com/page'}
`('does not render a $type link', ({ text }) => {
createComponent(mockProps({ text }));
expect(findLink().exists()).toBe(false);
});
});
});
|
