@testomatio/reporter 1.3.5-beta → 1.4.0-beta-wdio-bdd
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +60 -57
- package/lib/adapter/codecept.js +96 -35
- package/lib/adapter/cucumber/current.js +18 -11
- package/lib/adapter/cucumber/legacy.js +6 -5
- package/lib/adapter/cucumber.js +2 -2
- package/lib/adapter/cypress-plugin/index.js +52 -25
- package/lib/adapter/jasmine.js +1 -1
- package/lib/adapter/jest.js +49 -16
- package/lib/adapter/mocha.js +103 -51
- package/lib/adapter/playwright.js +95 -33
- package/lib/adapter/webdriver.js +46 -1
- package/lib/bin/reportXml.js +22 -16
- package/lib/bin/startTest.js +27 -6
- package/lib/client.js +179 -53
- package/lib/config.js +34 -0
- package/lib/constants.js +32 -7
- package/lib/data-storage.js +203 -0
- package/lib/fileUploader.js +135 -54
- package/lib/junit-adapter/adapter.js +0 -2
- package/lib/junit-adapter/csharp.js +3 -4
- package/lib/junit-adapter/index.js +3 -3
- package/lib/junit-adapter/java.js +35 -17
- package/lib/junit-adapter/javascript.js +1 -2
- package/lib/junit-adapter/python.js +12 -14
- package/lib/junit-adapter/ruby.js +1 -2
- package/lib/pipe/csv.js +5 -3
- package/lib/pipe/github.js +9 -19
- package/lib/pipe/gitlab.js +22 -26
- package/lib/pipe/html.js +354 -0
- package/lib/pipe/index.js +3 -1
- package/lib/pipe/testomatio.js +257 -53
- package/lib/reporter-functions.js +46 -0
- package/lib/reporter.js +11 -9
- package/lib/services/artifacts.js +57 -0
- package/lib/services/index.js +13 -0
- package/lib/services/key-values.js +58 -0
- package/lib/services/logger.js +311 -0
- package/lib/template/testomatio.hbs +1236 -0
- package/lib/utils/pipe_utils.js +129 -0
- package/lib/{util.js → utils/utils.js} +145 -15
- package/lib/xmlReader.js +211 -122
- package/package.json +17 -9
- package/lib/_ArtifactStorageOld.js +0 -142
- package/lib/artifactStorage.js +0 -25
- package/lib/dataStorage.js +0 -244
- package/lib/logger.js +0 -301
|
@@ -0,0 +1,1236 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang='en'>
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset='UTF-8' />
|
|
5
|
+
<meta
|
|
6
|
+
name='viewport'
|
|
7
|
+
content='width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0'
|
|
8
|
+
/>
|
|
9
|
+
<meta http-equiv='X-UA-Compatible' content='ie=edge' />
|
|
10
|
+
<link
|
|
11
|
+
href='https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css'
|
|
12
|
+
rel='stylesheet'
|
|
13
|
+
integrity='sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC'
|
|
14
|
+
crossorigin='anonymous'
|
|
15
|
+
/>
|
|
16
|
+
<link
|
|
17
|
+
rel='stylesheet'
|
|
18
|
+
href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css'
|
|
19
|
+
integrity='sha512-SzlrxWUlpfuzQ+pcUCosxcglQRNAq/DZjVsC0lE40xsADsfeQoEypE+enwcOiGjk/bSuGGKHEyjSoQ1zVisanQ=='
|
|
20
|
+
crossorigin='anonymous'
|
|
21
|
+
referrerpolicy='no-referrer'
|
|
22
|
+
/>
|
|
23
|
+
{{#if runId}}
|
|
24
|
+
<title>Report #{{runId}} - Testomat.io</title>
|
|
25
|
+
{{else}}
|
|
26
|
+
<title>Report Testomat.io</title>
|
|
27
|
+
{{/if}}
|
|
28
|
+
<style>
|
|
29
|
+
body {
|
|
30
|
+
padding: 0;
|
|
31
|
+
margin: 0;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
header,
|
|
35
|
+
div,
|
|
36
|
+
p,
|
|
37
|
+
form,
|
|
38
|
+
input,
|
|
39
|
+
a,
|
|
40
|
+
span,
|
|
41
|
+
button {
|
|
42
|
+
box-sizing: border-box;
|
|
43
|
+
}
|
|
44
|
+
img {
|
|
45
|
+
width: 100%;
|
|
46
|
+
display: block;
|
|
47
|
+
max-width: 100%;
|
|
48
|
+
height: auto;
|
|
49
|
+
}
|
|
50
|
+
p, span {
|
|
51
|
+
font-weight: 400;
|
|
52
|
+
font-size: 14px;
|
|
53
|
+
color: grey;
|
|
54
|
+
margin: 0;
|
|
55
|
+
}
|
|
56
|
+
.report {
|
|
57
|
+
padding-top: 15px;
|
|
58
|
+
}
|
|
59
|
+
.level_1 {
|
|
60
|
+
margin-bottom: 20px;
|
|
61
|
+
border-bottom: 1px solid grey;
|
|
62
|
+
padding-bottom: 10px;
|
|
63
|
+
}
|
|
64
|
+
.header {
|
|
65
|
+
display: flex;
|
|
66
|
+
justify-content: space-between;
|
|
67
|
+
align-items: center;
|
|
68
|
+
}
|
|
69
|
+
.header__point {
|
|
70
|
+
width: 8px;
|
|
71
|
+
height: 8px;
|
|
72
|
+
border-radius: 50%;
|
|
73
|
+
margin-right: 15px;
|
|
74
|
+
}
|
|
75
|
+
.header__point_red {
|
|
76
|
+
background: red;
|
|
77
|
+
}
|
|
78
|
+
.header__block {
|
|
79
|
+
display: flex;
|
|
80
|
+
align-items: center;
|
|
81
|
+
}
|
|
82
|
+
.header__case {
|
|
83
|
+
display: flex;
|
|
84
|
+
align-items: center;
|
|
85
|
+
margin-right: 15px;
|
|
86
|
+
}
|
|
87
|
+
.header__case p {
|
|
88
|
+
margin-right: 7px;
|
|
89
|
+
}
|
|
90
|
+
.header__case span {
|
|
91
|
+
color: black;
|
|
92
|
+
}
|
|
93
|
+
.header__block button {
|
|
94
|
+
margin-left: 15px;
|
|
95
|
+
}
|
|
96
|
+
.header__type {
|
|
97
|
+
background: #0d6efd;
|
|
98
|
+
color: #FFF;
|
|
99
|
+
border-radius: 10px;
|
|
100
|
+
padding: 1px 5px;
|
|
101
|
+
margin-right: 15px;
|
|
102
|
+
}
|
|
103
|
+
.header__case i {
|
|
104
|
+
color: grey;
|
|
105
|
+
margin-right: 5px;
|
|
106
|
+
}
|
|
107
|
+
.title {
|
|
108
|
+
display: flex;
|
|
109
|
+
margin-bottom: 20px;
|
|
110
|
+
}
|
|
111
|
+
.title p {
|
|
112
|
+
color: black;
|
|
113
|
+
font-size: 20px;
|
|
114
|
+
margin-right: 5px;
|
|
115
|
+
}
|
|
116
|
+
.statright {
|
|
117
|
+
display: flex;
|
|
118
|
+
}
|
|
119
|
+
.statdesc {
|
|
120
|
+
display: flex;
|
|
121
|
+
flex-direction: column;
|
|
122
|
+
}
|
|
123
|
+
.statdesc__row {
|
|
124
|
+
padding: 15px 10px;
|
|
125
|
+
display: flex;
|
|
126
|
+
}
|
|
127
|
+
.statdesc__row_first {
|
|
128
|
+
width: 150px;
|
|
129
|
+
}
|
|
130
|
+
.statdesc__row:nth-child(odd) {
|
|
131
|
+
background: #F4F5FF;
|
|
132
|
+
}
|
|
133
|
+
.statdesc__row p {
|
|
134
|
+
font-weight: bold;
|
|
135
|
+
}
|
|
136
|
+
.statdesc {
|
|
137
|
+
width: 100%;
|
|
138
|
+
}
|
|
139
|
+
.statstatus {
|
|
140
|
+
display: flex;
|
|
141
|
+
align-items: center;
|
|
142
|
+
}
|
|
143
|
+
.statstatus p {
|
|
144
|
+
font-weight: bold;
|
|
145
|
+
}
|
|
146
|
+
.statstatus div {
|
|
147
|
+
font-weight: bold;
|
|
148
|
+
}
|
|
149
|
+
.statstatus_failed div {
|
|
150
|
+
width: 10px;
|
|
151
|
+
height: 10px;
|
|
152
|
+
border-radius: 50%;
|
|
153
|
+
margin-right: 5px;
|
|
154
|
+
}
|
|
155
|
+
.statstatus_failed p {
|
|
156
|
+
color: red;
|
|
157
|
+
text-transform: uppercase;
|
|
158
|
+
}
|
|
159
|
+
.statstatus_failed div {
|
|
160
|
+
background: red;
|
|
161
|
+
}
|
|
162
|
+
.statstatus_passed div {
|
|
163
|
+
width: 10px;
|
|
164
|
+
height: 10px;
|
|
165
|
+
border-radius: 50%;
|
|
166
|
+
margin-right: 5px;
|
|
167
|
+
text-transform: uppercase;
|
|
168
|
+
}
|
|
169
|
+
.statstatus_passed div {
|
|
170
|
+
background: green;
|
|
171
|
+
}
|
|
172
|
+
.statstatus_passed p {
|
|
173
|
+
color: green;
|
|
174
|
+
text-transform: uppercase;
|
|
175
|
+
}
|
|
176
|
+
.statstatus_skipped div{
|
|
177
|
+
width: 10px;
|
|
178
|
+
height: 10px;
|
|
179
|
+
border-radius: 50%;
|
|
180
|
+
margin-right: 5px;
|
|
181
|
+
text-transform: uppercase;
|
|
182
|
+
}
|
|
183
|
+
.statstatus_skipped div {
|
|
184
|
+
background: yellow;
|
|
185
|
+
}
|
|
186
|
+
.statstatus_skipped p {
|
|
187
|
+
color: yellow;
|
|
188
|
+
text-transform: uppercase;
|
|
189
|
+
}
|
|
190
|
+
.fa-magnifying-glass {
|
|
191
|
+
font-size: 24px;
|
|
192
|
+
color: gray;
|
|
193
|
+
}
|
|
194
|
+
.level_5 {
|
|
195
|
+
margin-top: 20px;
|
|
196
|
+
}
|
|
197
|
+
.numTest {
|
|
198
|
+
font-weight: 700;
|
|
199
|
+
font-size: 16px;
|
|
200
|
+
color:#0d6efd;
|
|
201
|
+
}
|
|
202
|
+
.testitem {
|
|
203
|
+
border: 1px solid grey;
|
|
204
|
+
border-radius: 10px;
|
|
205
|
+
margin-bottom: 15px;
|
|
206
|
+
}
|
|
207
|
+
.testitem__top {
|
|
208
|
+
width: 100%;
|
|
209
|
+
display: flex;
|
|
210
|
+
background: #e9ecef;
|
|
211
|
+
padding: 3px 0;
|
|
212
|
+
border-radius:10px;
|
|
213
|
+
cursor: pointer;
|
|
214
|
+
}
|
|
215
|
+
.testitem__icon {
|
|
216
|
+
display: flex;
|
|
217
|
+
align-items: center;
|
|
218
|
+
justify-content: center;
|
|
219
|
+
width: 30px;
|
|
220
|
+
margin-right: 15px;
|
|
221
|
+
}
|
|
222
|
+
.testitem__ico {
|
|
223
|
+
font-size: 18px;
|
|
224
|
+
}
|
|
225
|
+
.testitem__name {
|
|
226
|
+
font-weight: 700;
|
|
227
|
+
color: black;
|
|
228
|
+
font-size: 16px;
|
|
229
|
+
}
|
|
230
|
+
.testitem__body {
|
|
231
|
+
display: flex;
|
|
232
|
+
border-top: 1px solid grey;
|
|
233
|
+
}
|
|
234
|
+
.testitem__menu {
|
|
235
|
+
display: flex;
|
|
236
|
+
flex-direction: column;
|
|
237
|
+
border-right: 1px solid grey;
|
|
238
|
+
padding: 15px;
|
|
239
|
+
}
|
|
240
|
+
.testitem__mitem {
|
|
241
|
+
margin-bottom: 10px;
|
|
242
|
+
font-size: 14px;
|
|
243
|
+
cursor: pointer;
|
|
244
|
+
color: grey;
|
|
245
|
+
}
|
|
246
|
+
.testitem__mitem_active {
|
|
247
|
+
color: green;
|
|
248
|
+
}
|
|
249
|
+
.testitem__case {
|
|
250
|
+
display: flex;
|
|
251
|
+
flex-direction: column;
|
|
252
|
+
padding: 10px;
|
|
253
|
+
}
|
|
254
|
+
.testitem__title {
|
|
255
|
+
font-size: 18px;
|
|
256
|
+
color: black;
|
|
257
|
+
font-weight: 700;
|
|
258
|
+
margin-bottom: 15px;
|
|
259
|
+
text-decoration: underline;
|
|
260
|
+
}
|
|
261
|
+
.testitem__block p {
|
|
262
|
+
font-size: 14px;
|
|
263
|
+
white-space: pre-line;
|
|
264
|
+
}
|
|
265
|
+
.test__empty__list {
|
|
266
|
+
margin-bottom: 10px;
|
|
267
|
+
color: grey;
|
|
268
|
+
}
|
|
269
|
+
.testitem__content {
|
|
270
|
+
width: 92%;
|
|
271
|
+
}
|
|
272
|
+
/* Passed TAB*/
|
|
273
|
+
#passedTest:not(:checked) + .btn-outline-dark {
|
|
274
|
+
background-color: #39BD2F;
|
|
275
|
+
}
|
|
276
|
+
#passedTest:checked + .btn-outline-dark {
|
|
277
|
+
background-color: #68cf61;
|
|
278
|
+
color: white;
|
|
279
|
+
}
|
|
280
|
+
/* Failed TAB*/
|
|
281
|
+
#failedTest:not(:checked) + .btn-outline-dark {
|
|
282
|
+
background-color: #F2230C;
|
|
283
|
+
}
|
|
284
|
+
#failedTest:checked + .btn-outline-dark {
|
|
285
|
+
background-color: #FA6E5E;
|
|
286
|
+
color: white;
|
|
287
|
+
}
|
|
288
|
+
/* Skipped TAB*/
|
|
289
|
+
#skippedTest:not(:checked) + .btn-outline-dark {
|
|
290
|
+
background-color: #F2C00C;
|
|
291
|
+
}
|
|
292
|
+
#skippedTest:checked + .btn-outline-dark {
|
|
293
|
+
background-color: #dfc155;
|
|
294
|
+
}
|
|
295
|
+
/* Pagination component styles*/
|
|
296
|
+
.page-link {
|
|
297
|
+
color: black;
|
|
298
|
+
background: #f5f5f8;
|
|
299
|
+
}
|
|
300
|
+
.page-link:hover {
|
|
301
|
+
color: black;
|
|
302
|
+
}
|
|
303
|
+
.form-select:focus {
|
|
304
|
+
border-color: #adadad;
|
|
305
|
+
box-shadow: 0 0 0 0.25rem rgb(67 71 78 / 25%);
|
|
306
|
+
}
|
|
307
|
+
.page-item.active .page-link {
|
|
308
|
+
background: #d1d1d2;
|
|
309
|
+
border-color: #adadad;
|
|
310
|
+
}
|
|
311
|
+
.noData {
|
|
312
|
+
background: #e9ecef;
|
|
313
|
+
text-align: center;
|
|
314
|
+
height: 100px;
|
|
315
|
+
padding-top: 39px;
|
|
316
|
+
border-radius: 5px;
|
|
317
|
+
}
|
|
318
|
+
</style>
|
|
319
|
+
</head>
|
|
320
|
+
|
|
321
|
+
<body class='bg-gray-50 pt-6 px-4 lg:pt-4 lg:px-40 h-full;'>
|
|
322
|
+
<section class='report' id='report'>
|
|
323
|
+
<div class='container'>
|
|
324
|
+
<!-- top -->
|
|
325
|
+
<div class='row level_1'>
|
|
326
|
+
<div class='col-12'>
|
|
327
|
+
<div class='header'>
|
|
328
|
+
<div class='header__block'>
|
|
329
|
+
{{#if runId}}
|
|
330
|
+
<div class='header__case'>
|
|
331
|
+
<p>Run</p>
|
|
332
|
+
<span><strong>#</strong>{{runId}}</span>
|
|
333
|
+
</div>
|
|
334
|
+
{{/if}}
|
|
335
|
+
<p class='header__type'>
|
|
336
|
+
<i class='fa-solid fa-face-smile'></i>
|
|
337
|
+
automated job
|
|
338
|
+
</p>
|
|
339
|
+
</div>
|
|
340
|
+
<div class='header__block'>
|
|
341
|
+
{{#if runUrl}}
|
|
342
|
+
<a href='{{runUrl}}' target='_blank' class='btn btn-primary'>
|
|
343
|
+
Full Report
|
|
344
|
+
</a>
|
|
345
|
+
{{else}}
|
|
346
|
+
<button class='btn btn-primary' disabled>
|
|
347
|
+
Full Report
|
|
348
|
+
</button>
|
|
349
|
+
{{/if}}
|
|
350
|
+
</div>
|
|
351
|
+
</div>
|
|
352
|
+
</div>
|
|
353
|
+
</div>
|
|
354
|
+
<!-- top -->
|
|
355
|
+
|
|
356
|
+
<div class='row level_2'>
|
|
357
|
+
<div class='col-12'>
|
|
358
|
+
<div class='title'>
|
|
359
|
+
<p>Testomatio Run Information</p>
|
|
360
|
+
</div>
|
|
361
|
+
</div>
|
|
362
|
+
</div>
|
|
363
|
+
|
|
364
|
+
<!-- Schedule and information -->
|
|
365
|
+
<div class='row level_3'>
|
|
366
|
+
<div class='col-6'>
|
|
367
|
+
<div class='statleft'>
|
|
368
|
+
<div id='graff'></div>
|
|
369
|
+
</div>
|
|
370
|
+
</div>
|
|
371
|
+
<div class='col-6'>
|
|
372
|
+
<div class='statright'>
|
|
373
|
+
<div class='statdesc'>
|
|
374
|
+
<!-- 1 -->
|
|
375
|
+
<div class='statdesc__row'>
|
|
376
|
+
<div class='statdesc__row_first'>
|
|
377
|
+
<p>Status</p>
|
|
378
|
+
</div>
|
|
379
|
+
<div class='statstatus statstatus_{{status}}'>
|
|
380
|
+
<div></div>
|
|
381
|
+
<p>{{status}}</p>
|
|
382
|
+
</div>
|
|
383
|
+
</div>
|
|
384
|
+
<!-- 1 -->
|
|
385
|
+
<!-- 1 -->
|
|
386
|
+
<div class='statdesc__row'>
|
|
387
|
+
<div class='statdesc__row_first'>
|
|
388
|
+
<p>Execution Duration</p>
|
|
389
|
+
</div>
|
|
390
|
+
<span>{{executionTime}}</span>
|
|
391
|
+
</div>
|
|
392
|
+
<!-- 1 -->
|
|
393
|
+
<!-- 1 -->
|
|
394
|
+
<div class='statdesc__row'>
|
|
395
|
+
<div class='statdesc__row_first'>
|
|
396
|
+
<p>Tests</p>
|
|
397
|
+
</div>
|
|
398
|
+
<span>{{tests.length}}</span>
|
|
399
|
+
</div>
|
|
400
|
+
<!-- 1 -->
|
|
401
|
+
<!-- 1 -->
|
|
402
|
+
<div class='statdesc__row'>
|
|
403
|
+
<div class='statdesc__row_first'>
|
|
404
|
+
<p>Start Execution Date</p>
|
|
405
|
+
</div>
|
|
406
|
+
<span>{{executionDate}}</span>
|
|
407
|
+
</div>
|
|
408
|
+
<!-- 1 -->
|
|
409
|
+
</div>
|
|
410
|
+
</div>
|
|
411
|
+
</div>
|
|
412
|
+
</div>
|
|
413
|
+
<!-- Schedule and information -->
|
|
414
|
+
<div class='row level_4'>
|
|
415
|
+
<div class='col-6'>
|
|
416
|
+
<div class='input-group'>
|
|
417
|
+
<div class='input-group-prepend'>
|
|
418
|
+
<span class='input-group-text' id='basic-addon1'>
|
|
419
|
+
<i class='fa-solid fa-magnifying-glass'></i>
|
|
420
|
+
</span>
|
|
421
|
+
</div>
|
|
422
|
+
<input
|
|
423
|
+
type='text'
|
|
424
|
+
class='form-control inputSearch'
|
|
425
|
+
placeholder='Search'
|
|
426
|
+
aria-label='Search'
|
|
427
|
+
aria-describedby='basic-addon1'
|
|
428
|
+
/>
|
|
429
|
+
</div>
|
|
430
|
+
</div>
|
|
431
|
+
|
|
432
|
+
<div class='col-6 d-flex justify-content-end'>
|
|
433
|
+
<div class='btn-group menuTests' role='group' aria-label='Basic radio toggle button group'>
|
|
434
|
+
|
|
435
|
+
<input
|
|
436
|
+
type='radio'
|
|
437
|
+
class='btn-check'
|
|
438
|
+
name='groupTest'
|
|
439
|
+
id='allTest'
|
|
440
|
+
autocomplete='off'
|
|
441
|
+
category='all'
|
|
442
|
+
checked
|
|
443
|
+
/>
|
|
444
|
+
<label class='btn btn-outline-dark' for='allTest'>All
|
|
445
|
+
<span class='numTest' name='numTest' lcategory='all'>0</span>
|
|
446
|
+
</label>
|
|
447
|
+
|
|
448
|
+
<input
|
|
449
|
+
type='radio'
|
|
450
|
+
class='btn-check'
|
|
451
|
+
name='groupTest'
|
|
452
|
+
id='passedTest'
|
|
453
|
+
autocomplete='off'
|
|
454
|
+
category='passed'
|
|
455
|
+
/>
|
|
456
|
+
<label class='btn btn-outline-dark' for='passedTest'>Passed
|
|
457
|
+
<span class='numTest' name='numTest' lcategory='passed'>0</span>
|
|
458
|
+
</label>
|
|
459
|
+
|
|
460
|
+
<input
|
|
461
|
+
type='radio'
|
|
462
|
+
class='btn-check'
|
|
463
|
+
name='groupTest'
|
|
464
|
+
id='failedTest'
|
|
465
|
+
autocomplete='off'
|
|
466
|
+
category='failed'
|
|
467
|
+
/>
|
|
468
|
+
<label class='btn btn-outline-dark' for='failedTest'>Failed
|
|
469
|
+
<span class='numTest' name='numTest' lcategory='failed'>0</span>
|
|
470
|
+
</label>
|
|
471
|
+
|
|
472
|
+
<input
|
|
473
|
+
type='radio'
|
|
474
|
+
class='btn-check'
|
|
475
|
+
name='groupTest'
|
|
476
|
+
id='skippedTest'
|
|
477
|
+
autocomplete='off'
|
|
478
|
+
category='skipped'
|
|
479
|
+
/>
|
|
480
|
+
<label class='btn btn-outline-dark' for='skippedTest'>Skipped
|
|
481
|
+
<span class='numTest' name='numTest' lcategory='skipped'>0</span>
|
|
482
|
+
</label>
|
|
483
|
+
|
|
484
|
+
</div>
|
|
485
|
+
</div>
|
|
486
|
+
</div>
|
|
487
|
+
|
|
488
|
+
<div class="row level_5">
|
|
489
|
+
<div class="col-12">
|
|
490
|
+
{{#if tests.length}}
|
|
491
|
+
<!-- TOP pagination & select components -->
|
|
492
|
+
<div class="mt-5 mb-3 d-flex justify-content-between" style="height: 40px;">
|
|
493
|
+
<nav id="pagination">
|
|
494
|
+
<ul class="pagination">
|
|
495
|
+
</ul>
|
|
496
|
+
</nav>
|
|
497
|
+
{{ selectComponent }}
|
|
498
|
+
</div>
|
|
499
|
+
<!-- Test data section -->
|
|
500
|
+
<div class="testWrapp">
|
|
501
|
+
{{#each tests}}
|
|
502
|
+
|
|
503
|
+
<div class="testitem d-none" name="testitem" type="dummy" category="false">
|
|
504
|
+
|
|
505
|
+
<div class="testitem__top">
|
|
506
|
+
<div class="testitem__icon">
|
|
507
|
+
<i class="fa-solid fa-chevron-right testitem__ico testitem__ico_right"></i>
|
|
508
|
+
<i class="fa-solid fa-chevron-down d-none testitem__ico testitem__ico_down"></i>
|
|
509
|
+
</div>
|
|
510
|
+
<p class="testitem__name">Test</p>
|
|
511
|
+
</div>
|
|
512
|
+
|
|
513
|
+
<div class="testitem__body d-none">
|
|
514
|
+
|
|
515
|
+
<div class='testitem__menu'>
|
|
516
|
+
<span type='steps' class='testitem__mitem testitem__mitem_active'>Steps
|
|
517
|
+
<i class='fa-solid fa-arrow-right'></i></span>
|
|
518
|
+
<span type='status' class='testitem__mitem'>Status
|
|
519
|
+
<i class='fa-solid fa-arrow-right'></i></span>
|
|
520
|
+
<span type='message' class='testitem__mitem'>Message
|
|
521
|
+
<i class='fa-solid fa-arrow-right'></i></span>
|
|
522
|
+
<span type='files' class='testitem__mitem'>Files <i class='fa-solid fa-arrow-right'></i></span>
|
|
523
|
+
</div>
|
|
524
|
+
|
|
525
|
+
<div class="testitem__content">
|
|
526
|
+
<!-- 1 -->
|
|
527
|
+
<div class="testitem__case" type="steps">
|
|
528
|
+
<p class="testitem__title">Steps</p>
|
|
529
|
+
<div class="testitem__block">
|
|
530
|
+
<span>...</span>
|
|
531
|
+
</div>
|
|
532
|
+
</div>
|
|
533
|
+
<!-- 1 -->
|
|
534
|
+
|
|
535
|
+
<!-- 2 -->
|
|
536
|
+
<div class='testitem__case d-none' type='status'>
|
|
537
|
+
<p class='testitem__title'>Status</p>
|
|
538
|
+
<div class='testitem__block'>
|
|
539
|
+
<span>...</span>
|
|
540
|
+
</div>
|
|
541
|
+
</div>
|
|
542
|
+
<!-- 2 -->
|
|
543
|
+
|
|
544
|
+
<!-- 3 -->
|
|
545
|
+
<div class='testitem__case d-none' type='message'>
|
|
546
|
+
<p class='testitem__title'>Message</p>
|
|
547
|
+
<div class='testitem__block'>
|
|
548
|
+
<span>...</span>
|
|
549
|
+
</div>
|
|
550
|
+
</div>
|
|
551
|
+
<!-- 3 -->
|
|
552
|
+
|
|
553
|
+
<!-- 4 -->
|
|
554
|
+
<div class='testitem__case d-none' type='files'>
|
|
555
|
+
<p class='testitem__title'>Files</p>
|
|
556
|
+
<div class='testitem__block'>
|
|
557
|
+
<span>...</span>
|
|
558
|
+
</div>
|
|
559
|
+
</div>
|
|
560
|
+
<!-- 4 -->
|
|
561
|
+
</div>
|
|
562
|
+
</div>
|
|
563
|
+
</div>
|
|
564
|
+
{{/each}}
|
|
565
|
+
</div>
|
|
566
|
+
<!-- BOTTOM pagination & select components -->
|
|
567
|
+
<nav class="mt-2">
|
|
568
|
+
<ul class="pagination">
|
|
569
|
+
</ul>
|
|
570
|
+
</nav>
|
|
571
|
+
{{else}}
|
|
572
|
+
<!-- No tests found section -->
|
|
573
|
+
{{ emptyDataComponent }}
|
|
574
|
+
{{/if}}
|
|
575
|
+
</div>
|
|
576
|
+
</div>
|
|
577
|
+
|
|
578
|
+
</div>
|
|
579
|
+
</section>
|
|
580
|
+
|
|
581
|
+
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
|
|
582
|
+
<script type="text/javascript">
|
|
583
|
+
// Load google charts
|
|
584
|
+
google.charts.load('current', {'packages':['corechart']});
|
|
585
|
+
google.charts.setOnLoadCallback(drawChart);
|
|
586
|
+
|
|
587
|
+
// Draw the chart and set the chart values
|
|
588
|
+
function drawChart() {
|
|
589
|
+
let data = {};
|
|
590
|
+
const passedTests = {{getTestsByStatus tests "PASSED"}};
|
|
591
|
+
const failedTests = {{getTestsByStatus tests "FAILED"}};
|
|
592
|
+
const skippedTests = {{getTestsByStatus tests "SKIPPED"}};
|
|
593
|
+
|
|
594
|
+
if (passedTests === 0 && failedTests === 0 && skippedTests === 0) {
|
|
595
|
+
data = google.visualization.arrayToDataTable([
|
|
596
|
+
['Task', 'Tests'],
|
|
597
|
+
['No Tests', 1]
|
|
598
|
+
])
|
|
599
|
+
}
|
|
600
|
+
else {
|
|
601
|
+
data = google.visualization.arrayToDataTable([
|
|
602
|
+
['Task', 'Tests'],
|
|
603
|
+
['No Tests', 0],
|
|
604
|
+
['Passed', passedTests],
|
|
605
|
+
['Failed', failedTests],
|
|
606
|
+
['Skipped', skippedTests],
|
|
607
|
+
]);
|
|
608
|
+
}
|
|
609
|
+
// Optional: add a title and set the width and height of the chart
|
|
610
|
+
const options = {
|
|
611
|
+
'title':'',
|
|
612
|
+
'width':550,
|
|
613
|
+
'height':300,
|
|
614
|
+
'colors': ['#939992', '#39BD2F', '#F2230C', '#F2C00C']
|
|
615
|
+
};
|
|
616
|
+
// Display the chart inside the <div> element with id="piechart"
|
|
617
|
+
const chart = new google.visualization.PieChart(document.getElementById('graff'));
|
|
618
|
+
chart.draw(data, options);
|
|
619
|
+
}
|
|
620
|
+
|
|
621
|
+
// processing and adding test data to the template
|
|
622
|
+
function addOneTest(category,testData = {}){
|
|
623
|
+
const { suite_title, title, steps, message, files } = testData;
|
|
624
|
+
// collapse - expand block
|
|
625
|
+
const clone = createClone(category, suite_title, title);
|
|
626
|
+
const testitem__top = clone.querySelector('.testitem__top');
|
|
627
|
+
|
|
628
|
+
setTestItemContent(clone, steps, category, message, files);
|
|
629
|
+
addCollapseExpandListener(testitem__top);
|
|
630
|
+
initializeMenu(clone);
|
|
631
|
+
}
|
|
632
|
+
|
|
633
|
+
function createClone(category, suite_title, title) {
|
|
634
|
+
const page = document.querySelector('.report');
|
|
635
|
+
const wrapp = page.querySelector('.testWrapp');
|
|
636
|
+
const dummy = wrapp.querySelector('div[name="testitem"][type="dummy"]');
|
|
637
|
+
const clone = dummy.cloneNode(true);
|
|
638
|
+
|
|
639
|
+
clone.setAttribute('type', 'clone');
|
|
640
|
+
clone.setAttribute('category', category);
|
|
641
|
+
clone.classList.remove('d-none');
|
|
642
|
+
wrapp.append(clone);
|
|
643
|
+
|
|
644
|
+
const testitem__name = clone.querySelector('.testitem__name');
|
|
645
|
+
testitem__name.innerHTML = suite_title ? suite_title + " - " + title : title;
|
|
646
|
+
|
|
647
|
+
return clone;
|
|
648
|
+
}
|
|
649
|
+
|
|
650
|
+
function setTestItemContent(clone, steps, category, message, files) {
|
|
651
|
+
const body = clone.querySelector('.testitem__body');
|
|
652
|
+
|
|
653
|
+
let content = body.querySelector('.testitem__content'),
|
|
654
|
+
content_error = content.querySelector('div[type="steps"]').querySelector('span'),
|
|
655
|
+
content_status = content.querySelector('div[type="status"]').querySelector('span'),
|
|
656
|
+
content_message = content.querySelector('div[type="message"]').querySelector('span'),
|
|
657
|
+
content_files = content.querySelector('div[type="files"]').querySelector('span');
|
|
658
|
+
|
|
659
|
+
content_error.innerHTML = steps;
|
|
660
|
+
content_status.innerHTML = category.toUpperCase();
|
|
661
|
+
content_message.innerHTML = message;
|
|
662
|
+
//if no file - empty message, else - files
|
|
663
|
+
(files.includes("This test has no files"))
|
|
664
|
+
? content_files.innerHTML = files
|
|
665
|
+
: addFilesToContent(content_files, files);
|
|
666
|
+
}
|
|
667
|
+
|
|
668
|
+
function addFilesToContent(content_files, files) {
|
|
669
|
+
const filesList = document.createElement('div');
|
|
670
|
+
|
|
671
|
+
filesList.classList.add('d-flex', 'flex-wrap', 'flex-column');
|
|
672
|
+
content_files.innerHTML = "";
|
|
673
|
+
|
|
674
|
+
if (Array.isArray(files) && files.length > 0) {
|
|
675
|
+
for (let i = 0; i < files.length; i += 2) {
|
|
676
|
+
const filePairContainer = document.createElement('div');
|
|
677
|
+
filePairContainer.classList.add('d-flex', 'mb-3', 'justify-content-around');
|
|
678
|
+
|
|
679
|
+
for (let j = i; j < i + 2 && j < files.length; j++) {
|
|
680
|
+
const file = files[j];
|
|
681
|
+
const fileItemContainer = createFileItemContainer(file);
|
|
682
|
+
filePairContainer.appendChild(fileItemContainer);
|
|
683
|
+
}
|
|
684
|
+
|
|
685
|
+
filesList.appendChild(filePairContainer);
|
|
686
|
+
}
|
|
687
|
+
|
|
688
|
+
content_files.appendChild(filesList);
|
|
689
|
+
}
|
|
690
|
+
}
|
|
691
|
+
|
|
692
|
+
function createFileItemContainer(file) {
|
|
693
|
+
let fileIcon;
|
|
694
|
+
|
|
695
|
+
const filepath = file?.path || file;
|
|
696
|
+
const fileName = createFileName(file);
|
|
697
|
+
const fileItemContainer = document.createElement('div');
|
|
698
|
+
const fileExtension = filepath.split('.').pop().toLowerCase();
|
|
699
|
+
|
|
700
|
+
fileItemContainer.classList.add('d-flex', 'flex-column', 'align-items-center', 'mr-3');
|
|
701
|
+
|
|
702
|
+
switch (fileExtension) {
|
|
703
|
+
case 'jpg':
|
|
704
|
+
case 'jpeg':
|
|
705
|
+
case 'png':
|
|
706
|
+
case 'gif':
|
|
707
|
+
fileIcon = createImagePreview(file);
|
|
708
|
+
break;
|
|
709
|
+
case 'zip':
|
|
710
|
+
const svgZipCode =
|
|
711
|
+
`<?xml version="1.0" encoding="iso-8859-1"?>
|
|
712
|
+
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
713
|
+
viewBox="0 0 512 512" xml:space="preserve">
|
|
714
|
+
<path style="fill:#FDCC77;" d="M511.344,274.266C511.77,268.231,512,262.143,512,256C512,114.615,397.385,0,256,0S0,114.615,0,256
|
|
715
|
+
c0,117.769,79.53,216.949,187.809,246.801L511.344,274.266z"/>
|
|
716
|
+
<path style="fill:#FCB433;" d="M511.344,274.266L314.991,77.913L119.096,434.087l68.714,68.714C209.522,508.787,232.385,512,256,512
|
|
717
|
+
C391.243,512,501.976,407.125,511.344,274.266z"/>
|
|
718
|
+
<polygon style="fill:#FFFFFF;" points="278.328,333.913 255.711,77.913 119.096,77.913 119.096,311.652 "/>
|
|
719
|
+
<polygon style="fill:#E8E6E6;" points="392.904,311.652 392.904,155.826 337.252,133.565 314.991,77.913 255.711,77.913
|
|
720
|
+
256.067,333.913 "/>
|
|
721
|
+
<polygon style="fill:#FFFFFF;" points="314.991,155.826 314.991,77.913 392.904,155.826 "/>
|
|
722
|
+
<rect x="119.096" y="311.652" style="fill:#9E7120;" width="273.809" height="122.435"/>
|
|
723
|
+
<g>
|
|
724
|
+
<path style="fill:#FFFFFF;" d="M210.927,388.691h28.759v10.671h-46.771v-8.627l28.38-33.677H193.9v-10.671h45.332v8.627
|
|
725
|
+
L210.927,388.691z"/>
|
|
726
|
+
<path style="fill:#FFFFFF;" d="M249.075,399.362v-52.975h13.471v52.975H249.075z"/>
|
|
727
|
+
<path style="fill:#FFFFFF;" d="M298.118,346.387c13.546,0,21.341,6.659,21.341,18.465c0,12.412-7.796,19.601-21.341,19.601h-9.612
|
|
728
|
+
v14.909h-13.471v-52.975L298.118,346.387L298.118,346.387z M288.505,373.858h8.93c5.904,0,9.307-2.952,9.307-8.552
|
|
729
|
+
c0-5.525-3.405-8.324-9.307-8.324h-8.93V373.858z"/>
|
|
730
|
+
</g>
|
|
731
|
+
</svg>`;
|
|
732
|
+
fileIcon = createFileIcon(file,svgZipCode);
|
|
733
|
+
break;
|
|
734
|
+
case 'mp4':
|
|
735
|
+
case 'avi':
|
|
736
|
+
case 'mov':
|
|
737
|
+
case 'webm':
|
|
738
|
+
const svgVideoCode =
|
|
739
|
+
`<?xml version="1.0" encoding="iso-8859-1"?>
|
|
740
|
+
<svg height="150px" width="150px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
741
|
+
viewBox="0 0 503.467 503.467" xml:space="preserve">
|
|
742
|
+
<g transform="translate(5 1)">
|
|
743
|
+
<path style="fill:#F2EDDA;" d="M460.067,122.733v341.333c0,18.773-15.36,34.133-34.133,34.133h-358.4
|
|
744
|
+
c-18.773,0-34.133-15.36-34.133-34.133V37.4c0-18.773,15.36-34.133,34.133-34.133H340.6V88.6c0,18.773,15.36,34.133,34.133,34.133
|
|
745
|
+
H460.067z"/>
|
|
746
|
+
<path style="fill:#FFD0A1;" d="M460.067,122.733h-85.333c-18.773,0-34.133-15.36-34.133-34.133V3.267L460.067,122.733z"/>
|
|
747
|
+
<path style="fill:#80D6FA;" d="M246.733,191c61.44,0,110.933,49.493,110.933,110.933s-49.493,110.933-110.933,110.933
|
|
748
|
+
c-61.44,0-110.933-49.493-110.933-110.933S185.293,191,246.733,191L246.733,191z"/>
|
|
749
|
+
<polygon style="fill:#ECF4F7;" points="280.867,301.933 221.133,336.067 221.133,267.8 "/>
|
|
750
|
+
</g>
|
|
751
|
+
<path style="fill:#51565F;" d="M430.933,503.467h-358.4c-21.333,0-38.4-17.067-38.4-38.4V38.4C34.133,17.067,51.2,0,72.533,0H345.6
|
|
752
|
+
c0.853,0,2.56,0.853,3.413,0.853l85.333,85.333c1.707,1.707,1.707,4.267,0,5.973c-1.707,1.707-4.267,1.707-5.973,0l-84.48-84.48
|
|
753
|
+
H72.533c-16.213,0-29.867,13.653-29.867,29.867v426.667c0,16.213,13.653,29.867,29.867,29.867h358.4
|
|
754
|
+
c16.213,0,29.867-13.653,29.867-29.867V127.147h-81.067c-21.333,0-38.4-17.067-38.4-38.4V46.08c0-2.56,1.707-4.267,4.267-4.267
|
|
755
|
+
s4.267,1.707,4.267,4.267v42.667c0,16.213,13.653,29.867,29.867,29.867h85.333c2.56,0,4.267,1.707,4.267,4.267v341.333
|
|
756
|
+
C469.333,486.4,452.267,503.467,430.933,503.467z M251.733,418.133c-63.147,0-115.2-52.053-115.2-115.2s52.053-115.2,115.2-115.2
|
|
757
|
+
s115.2,52.053,115.2,115.2S314.88,418.133,251.733,418.133z M251.733,196.267c-58.88,0-106.667,47.787-106.667,106.667
|
|
758
|
+
S192.853,409.6,251.733,409.6S358.4,361.813,358.4,302.933S310.613,196.267,251.733,196.267z M226.133,341.333
|
|
759
|
+
c-0.853,0-1.707,0-2.56-0.853c-1.707-0.853-1.707-2.56-1.707-3.413V268.8c0-1.707,0.853-2.56,1.707-3.413
|
|
760
|
+
c1.707-0.853,2.56-0.853,4.267,0l59.733,34.133c1.707,0.853,2.56,2.56,2.56,3.413s-0.853,2.56-2.56,3.413L227.84,340.48
|
|
761
|
+
C227.84,341.333,226.987,341.333,226.133,341.333z M230.4,276.48v53.76l46.933-26.453L230.4,276.48z"/>
|
|
762
|
+
</svg>`;
|
|
763
|
+
fileIcon = createFileIcon(file, svgVideoCode);
|
|
764
|
+
break;
|
|
765
|
+
default:
|
|
766
|
+
const svgFileCode =
|
|
767
|
+
`<?xml version="1.0" encoding="iso-8859-1"?>
|
|
768
|
+
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
769
|
+
viewBox="0 0 512 512" xml:space="preserve">
|
|
770
|
+
<polygon style="fill:#72C6EF;" points="384,448 128,448 128,64 288,64 288,160 384,160 "/>
|
|
771
|
+
<path style="fill:#00384E;" d="M310.624,0H64v512h384V137.376L310.624,0z M320,54.624L393.376,128H320V54.624z M96,480V32h192v128
|
|
772
|
+
h128v320H96z"/>
|
|
773
|
+
<g>
|
|
774
|
+
<rect x="176" y="368" style="fill:#00384D;" width="160" height="32"/>
|
|
775
|
+
<rect x="176" y="304" style="fill:#00384D;" width="160" height="32"/>
|
|
776
|
+
<rect x="176" y="240" style="fill:#00384D;" width="160" height="32"/>
|
|
777
|
+
</g>
|
|
778
|
+
</svg>`;
|
|
779
|
+
fileIcon = createFileIcon(file, svgFileCode);
|
|
780
|
+
}
|
|
781
|
+
|
|
782
|
+
fileItemContainer.appendChild(fileIcon);
|
|
783
|
+
fileItemContainer.appendChild(fileName);
|
|
784
|
+
|
|
785
|
+
return fileItemContainer;
|
|
786
|
+
}
|
|
787
|
+
|
|
788
|
+
function createImagePreview(file) {
|
|
789
|
+
//TODO: consider using "../${file}", maybe we should get full paths when generating artifacts in Mocha!
|
|
790
|
+
const filepath = file?.path || `../${file}`;
|
|
791
|
+
const imagePreview = document.createElement('img');
|
|
792
|
+
// component styles
|
|
793
|
+
imagePreview.src = filepath;
|
|
794
|
+
imagePreview.alt = 'Image Preview';
|
|
795
|
+
imagePreview.style.maxWidth = '200px';
|
|
796
|
+
imagePreview.style.height = '150px';
|
|
797
|
+
imagePreview.style.cursor = 'pointer';
|
|
798
|
+
|
|
799
|
+
imagePreview.addEventListener('click', () => {
|
|
800
|
+
window.open(filepath, '_blank');
|
|
801
|
+
});
|
|
802
|
+
|
|
803
|
+
return imagePreview;
|
|
804
|
+
}
|
|
805
|
+
|
|
806
|
+
function createFileIcon(file, svg) {
|
|
807
|
+
//TODO: consider using "../${file}", maybe we should get full paths when generating artifacts in Mocha!
|
|
808
|
+
const filepath = file?.path || `../${file}`;
|
|
809
|
+
const fileIcon = document.createElement('div');
|
|
810
|
+
// component styles
|
|
811
|
+
fileIcon.innerHTML = svg;
|
|
812
|
+
fileIcon.style.width = '150px';
|
|
813
|
+
fileIcon.style.height = '150px';
|
|
814
|
+
fileIcon.style.cursor = 'pointer';
|
|
815
|
+
|
|
816
|
+
fileIcon.addEventListener('click', () => {
|
|
817
|
+
window.open(filepath, '_blank');
|
|
818
|
+
});
|
|
819
|
+
|
|
820
|
+
return fileIcon;
|
|
821
|
+
}
|
|
822
|
+
|
|
823
|
+
function createFileName(file) {
|
|
824
|
+
//TODO: consider using "../${file}", maybe we should get full paths when generating artifacts in Mocha!
|
|
825
|
+
const filepath = file?.path || `../${file}`;
|
|
826
|
+
const fileName = document.createElement('div');
|
|
827
|
+
// component styles
|
|
828
|
+
fileName.style.fontSize = '14px';
|
|
829
|
+
fileName.style.marginTop = '10px';
|
|
830
|
+
fileName.style.cursor = 'pointer';
|
|
831
|
+
|
|
832
|
+
fileName.textContent = filepath.split('/').pop();
|
|
833
|
+
|
|
834
|
+
fileName.addEventListener('click', () => {
|
|
835
|
+
window.open(filepath, '_blank');
|
|
836
|
+
});
|
|
837
|
+
|
|
838
|
+
return fileName;
|
|
839
|
+
}
|
|
840
|
+
|
|
841
|
+
function addCollapseExpandListener(testitem__top) {
|
|
842
|
+
testitem__top.addEventListener("click", function () {
|
|
843
|
+
collapse_expand(testitem__top);
|
|
844
|
+
});
|
|
845
|
+
}
|
|
846
|
+
|
|
847
|
+
function collapse_expand(top) {
|
|
848
|
+
const block = top.closest('.testitem');
|
|
849
|
+
const icon = top.querySelector('.testitem__icon');
|
|
850
|
+
const testitem__ico_right = icon.querySelector('.testitem__ico_right');
|
|
851
|
+
const testitem__ico_down = icon.querySelector('.testitem__ico_down');
|
|
852
|
+
const body = block.querySelector('.testitem__body');
|
|
853
|
+
|
|
854
|
+
if (body.classList.contains('d-none')) {
|
|
855
|
+
body.classList.remove('d-none');
|
|
856
|
+
testitem__ico_right.classList.add('d-none');
|
|
857
|
+
testitem__ico_down.classList.remove('d-none');
|
|
858
|
+
}
|
|
859
|
+
else {
|
|
860
|
+
body.classList.add('d-none');
|
|
861
|
+
testitem__ico_down.classList.add('d-none');
|
|
862
|
+
testitem__ico_right.classList.remove('d-none');
|
|
863
|
+
}
|
|
864
|
+
}
|
|
865
|
+
|
|
866
|
+
function initializeMenu(clone) {
|
|
867
|
+
const menu = clone.querySelector('.testitem__menu');
|
|
868
|
+
const item = menu.querySelectorAll('.testitem__mitem');
|
|
869
|
+
|
|
870
|
+
for (let i = 0; i < item.length; i++) {
|
|
871
|
+
item[i].addEventListener('click', function () {
|
|
872
|
+
show_content(item[i])
|
|
873
|
+
})
|
|
874
|
+
}
|
|
875
|
+
}
|
|
876
|
+
|
|
877
|
+
function show_content(elem) {
|
|
878
|
+
removeAddActive(elem);
|
|
879
|
+
|
|
880
|
+
const body = elem.closest('.testitem__body');
|
|
881
|
+
const content = body.querySelector('.testitem__content');
|
|
882
|
+
const blocks = content.querySelectorAll('.testitem__case');
|
|
883
|
+
|
|
884
|
+
for (let i = 0; i < blocks.length; i++) {
|
|
885
|
+
blocks[i].classList.add('d-none');
|
|
886
|
+
}
|
|
887
|
+
|
|
888
|
+
const type = elem.getAttribute('type');
|
|
889
|
+
const show_elem = content.querySelector('div[type="' + type + '"]');
|
|
890
|
+
|
|
891
|
+
show_elem.classList.remove('d-none');
|
|
892
|
+
}
|
|
893
|
+
|
|
894
|
+
function removeAddActive(elem) {
|
|
895
|
+
const menu = elem.closest('.testitem__menu');
|
|
896
|
+
const item = menu.querySelectorAll('.testitem__mitem');
|
|
897
|
+
|
|
898
|
+
for (let i = 0; i < item.length; i++) {
|
|
899
|
+
item[i].classList.remove('testitem__mitem_active');
|
|
900
|
+
}
|
|
901
|
+
elem.classList.add('testitem__mitem_active');
|
|
902
|
+
}
|
|
903
|
+
|
|
904
|
+
// GET test data
|
|
905
|
+
const testEntries = {{{ pageDispleyElements tests }}};
|
|
906
|
+
const allEntries = testEntries['totalTests'];
|
|
907
|
+
|
|
908
|
+
if (allEntries.length === 0) {
|
|
909
|
+
const searchEl = document.querySelector('.input-group');
|
|
910
|
+
const radioEl = document.querySelector('.menuTests');
|
|
911
|
+
|
|
912
|
+
searchEl.classList.add('d-none')
|
|
913
|
+
radioEl.classList.add('d-none')
|
|
914
|
+
}
|
|
915
|
+
else {
|
|
916
|
+
function search(array, testEntries) {
|
|
917
|
+
const handleSearch = (input) => {
|
|
918
|
+
const value = input.value.trim().toLowerCase();
|
|
919
|
+
const select = document.querySelector('.form-select');
|
|
920
|
+
const pagination = document.querySelectorAll('nav');
|
|
921
|
+
|
|
922
|
+
if (value) {
|
|
923
|
+
select.classList.add('d-none');
|
|
924
|
+
pagination.forEach(item => item.classList.add('d-none'));
|
|
925
|
+
}
|
|
926
|
+
else {
|
|
927
|
+
select.classList.remove('d-none');
|
|
928
|
+
pagination.forEach(item => item.classList.remove('d-none'));
|
|
929
|
+
|
|
930
|
+
remove(array);
|
|
931
|
+
|
|
932
|
+
const paginationCount = select.value;
|
|
933
|
+
const category = select.getAttribute('status');
|
|
934
|
+
|
|
935
|
+
if (testEntries[category][paginationCount][0]) {
|
|
936
|
+
add(testEntries[category][paginationCount][0]);
|
|
937
|
+
}
|
|
938
|
+
}
|
|
939
|
+
|
|
940
|
+
remove(array);
|
|
941
|
+
|
|
942
|
+
const filteredTests = array.filter(test => test.title.toLowerCase().includes(value) || test.suite_title.toLowerCase().includes(value));
|
|
943
|
+
|
|
944
|
+
const existingNoDataElement = document.querySelector('.noResults');
|
|
945
|
+
|
|
946
|
+
if (filteredTests.length === 0) {
|
|
947
|
+
if (!existingNoDataElement) {
|
|
948
|
+
const testElement = document.createElement('div');
|
|
949
|
+
testElement.classList.add('noData', 'noResults');
|
|
950
|
+
testElement.innerHTML = 'NO SEARCH RESULTS';
|
|
951
|
+
document.querySelector('.testWrapp').appendChild(testElement);
|
|
952
|
+
}
|
|
953
|
+
}
|
|
954
|
+
else {
|
|
955
|
+
const paginationCount = select.value;
|
|
956
|
+
const category = select.getAttribute('status');
|
|
957
|
+
|
|
958
|
+
if (existingNoDataElement) {
|
|
959
|
+
existingNoDataElement.remove();
|
|
960
|
+
}
|
|
961
|
+
|
|
962
|
+
if (testEntries[category][paginationCount][0]) {
|
|
963
|
+
add(filteredTests);
|
|
964
|
+
if (!value) {
|
|
965
|
+
remove(filteredTests);
|
|
966
|
+
add(testEntries[category][paginationCount][0]);
|
|
967
|
+
}
|
|
968
|
+
}
|
|
969
|
+
else {
|
|
970
|
+
if (value) {
|
|
971
|
+
add(filteredTests);
|
|
972
|
+
}
|
|
973
|
+
else {
|
|
974
|
+
if (!existingNoDataElement) {
|
|
975
|
+
const testElement = document.createElement('div');
|
|
976
|
+
|
|
977
|
+
select.classList.add('d-none');
|
|
978
|
+
testElement.classList.add('noData', 'noResults');
|
|
979
|
+
testElement.innerHTML = 'NO RESULTS';
|
|
980
|
+
document.querySelector('.testWrapp').appendChild(testElement);
|
|
981
|
+
}
|
|
982
|
+
}
|
|
983
|
+
}
|
|
984
|
+
}
|
|
985
|
+
};
|
|
986
|
+
|
|
987
|
+
const inputSearch = document.querySelector('.report .inputSearch');
|
|
988
|
+
inputSearch.addEventListener('input', () => handleSearch(inputSearch));
|
|
989
|
+
}
|
|
990
|
+
|
|
991
|
+
function radioMenuStart(){
|
|
992
|
+
function showBlockForCat(input){
|
|
993
|
+
const searchEl = document.querySelector('.input-group'),
|
|
994
|
+
element = document.querySelector('.form-select')
|
|
995
|
+
let category = 'all';
|
|
996
|
+
|
|
997
|
+
remove(testEntries[category][0][0]);
|
|
998
|
+
|
|
999
|
+
category = input.getAttribute('category');
|
|
1000
|
+
element.setAttribute('status', category);
|
|
1001
|
+
|
|
1002
|
+
const pagination = document.querySelectorAll('nav');
|
|
1003
|
+
pagination.forEach(item => item.classList.add('d-none'));
|
|
1004
|
+
|
|
1005
|
+
let inputEl = document.querySelector('.inputSearch');
|
|
1006
|
+
inputEl.value = '';
|
|
1007
|
+
|
|
1008
|
+
pagination.forEach(item => item.classList.remove('d-none'));
|
|
1009
|
+
|
|
1010
|
+
displayPagination(testEntries,element.value,category);
|
|
1011
|
+
|
|
1012
|
+
if(testEntries[category][0][0]){
|
|
1013
|
+
element.classList.remove('d-none');
|
|
1014
|
+
const existingNoDataElement = document.querySelector('.noResults');
|
|
1015
|
+
|
|
1016
|
+
if (existingNoDataElement) {
|
|
1017
|
+
existingNoDataElement.remove();
|
|
1018
|
+
}
|
|
1019
|
+
|
|
1020
|
+
searchEl.classList.remove('d-none');
|
|
1021
|
+
add(testEntries[category][element.value][0]);
|
|
1022
|
+
}
|
|
1023
|
+
else {
|
|
1024
|
+
element.classList.add('d-none');
|
|
1025
|
+
const existingNoDataElement = document.querySelector('.noResults');
|
|
1026
|
+
|
|
1027
|
+
if (existingNoDataElement) {
|
|
1028
|
+
existingNoDataElement.remove();
|
|
1029
|
+
}
|
|
1030
|
+
|
|
1031
|
+
const testElement = document.createElement('div');
|
|
1032
|
+
testElement.classList.add('noData');
|
|
1033
|
+
testElement.classList.add('noResults');
|
|
1034
|
+
testElement.innerHTML = 'NO RESULTS';
|
|
1035
|
+
searchEl.classList.add('d-none');
|
|
1036
|
+
|
|
1037
|
+
const testWrapp = document.querySelector('.testWrapp');
|
|
1038
|
+
testWrapp.appendChild(testElement);
|
|
1039
|
+
}
|
|
1040
|
+
}
|
|
1041
|
+
|
|
1042
|
+
const page = document.querySelector('.report');
|
|
1043
|
+
const menuTests = page.querySelector('.menuTests');
|
|
1044
|
+
const items = menuTests.querySelectorAll('input[name="groupTest"]');
|
|
1045
|
+
|
|
1046
|
+
for(let i=0; i<items.length; i++){
|
|
1047
|
+
items[i].addEventListener('change',function(){
|
|
1048
|
+
showBlockForCat(items[i])
|
|
1049
|
+
})
|
|
1050
|
+
}
|
|
1051
|
+
}
|
|
1052
|
+
|
|
1053
|
+
radioMenuStart();
|
|
1054
|
+
|
|
1055
|
+
search(allEntries, testEntries);
|
|
1056
|
+
|
|
1057
|
+
const radioCount = (allEntries) => {
|
|
1058
|
+
const allRadio = document.querySelectorAll('.numTest');
|
|
1059
|
+
|
|
1060
|
+
allRadio.forEach((radio) => {
|
|
1061
|
+
const attribute = radio.getAttribute('lcategory');
|
|
1062
|
+
|
|
1063
|
+
switch (attribute) {
|
|
1064
|
+
case 'all':
|
|
1065
|
+
radio.innerHTML = allEntries.length;
|
|
1066
|
+
break;
|
|
1067
|
+
case 'passed':
|
|
1068
|
+
const passedCount = allEntries.filter(test => test.status === 'passed').length;
|
|
1069
|
+
radio.innerHTML = passedCount;
|
|
1070
|
+
break;
|
|
1071
|
+
case 'failed':
|
|
1072
|
+
const failedCount = allEntries.filter(test => test.status === 'failed').length;
|
|
1073
|
+
radio.innerHTML = failedCount;
|
|
1074
|
+
break;
|
|
1075
|
+
case 'skipped':
|
|
1076
|
+
const skippedCount = allEntries.filter(test => test.status === 'skipped').length;
|
|
1077
|
+
radio.innerHTML = skippedCount;
|
|
1078
|
+
break;
|
|
1079
|
+
default: // no default action for now
|
|
1080
|
+
}
|
|
1081
|
+
});
|
|
1082
|
+
}
|
|
1083
|
+
|
|
1084
|
+
radioCount(allEntries);
|
|
1085
|
+
|
|
1086
|
+
function removeTest(category) {
|
|
1087
|
+
const page = document.querySelector('.report');
|
|
1088
|
+
const wrapp = page.querySelector('.testWrapp');
|
|
1089
|
+
const clones = wrapp.querySelectorAll('div[name="testitem"][type="clone"]');
|
|
1090
|
+
|
|
1091
|
+
clones.forEach((clone) => {
|
|
1092
|
+
if (clone.getAttribute('category') === category) clone.remove();
|
|
1093
|
+
});
|
|
1094
|
+
}
|
|
1095
|
+
|
|
1096
|
+
const add = (array) => {
|
|
1097
|
+
for (let i = 0; i < array.length; i++) {
|
|
1098
|
+
const status = array[i].status;
|
|
1099
|
+
addOneTest(status, array[i]);
|
|
1100
|
+
}
|
|
1101
|
+
}
|
|
1102
|
+
|
|
1103
|
+
const remove = (array) => {
|
|
1104
|
+
for (let i = 0; i < array.length; i++) {
|
|
1105
|
+
const status = array[i].status;
|
|
1106
|
+
removeTest(status, array[i]);
|
|
1107
|
+
}
|
|
1108
|
+
}
|
|
1109
|
+
|
|
1110
|
+
add(testEntries['all'][0][0]);
|
|
1111
|
+
|
|
1112
|
+
const selectElement = document.querySelector('.form-select');
|
|
1113
|
+
|
|
1114
|
+
selectElement.setAttribute('status', 'all');
|
|
1115
|
+
|
|
1116
|
+
selectElement.addEventListener('change', function() {
|
|
1117
|
+
let value = 0;
|
|
1118
|
+
const category = selectElement.getAttribute('status');
|
|
1119
|
+
|
|
1120
|
+
remove(testEntries[category][value][0]);
|
|
1121
|
+
value = parseInt(this.value);
|
|
1122
|
+
add(testEntries[category][value][0]);
|
|
1123
|
+
|
|
1124
|
+
displayPagination(testEntries, value, category);
|
|
1125
|
+
});
|
|
1126
|
+
|
|
1127
|
+
const displayPagination = (testEntries, index, category) => {
|
|
1128
|
+
let totalPages = testEntries[category][index].length;
|
|
1129
|
+
let currentPage = 1;
|
|
1130
|
+
|
|
1131
|
+
function createPagination() {
|
|
1132
|
+
const paginationContainers = document.querySelectorAll('.pagination');
|
|
1133
|
+
paginationContainers.forEach((paginationContainer) => {
|
|
1134
|
+
paginationContainer.innerHTML = '';
|
|
1135
|
+
|
|
1136
|
+
let startPage = 1;
|
|
1137
|
+
let endPage = totalPages;
|
|
1138
|
+
if (totalPages > 10) {
|
|
1139
|
+
if (currentPage > 5) {
|
|
1140
|
+
startPage = currentPage - 1;
|
|
1141
|
+
endPage = currentPage + 1;
|
|
1142
|
+
}
|
|
1143
|
+
else {
|
|
1144
|
+
endPage = 5;
|
|
1145
|
+
}
|
|
1146
|
+
}
|
|
1147
|
+
|
|
1148
|
+
if (startPage > 1) {
|
|
1149
|
+
const startEllipsis = document.createElement('li');
|
|
1150
|
+
|
|
1151
|
+
startEllipsis.classList.add('page-item');
|
|
1152
|
+
startEllipsis.innerHTML = '<a class="page-link" href="#pagination">...</a>';
|
|
1153
|
+
startEllipsis.addEventListener('click', () => {
|
|
1154
|
+
remove(testEntries[category][index][currentPage - 1]);
|
|
1155
|
+
currentPage = 1;
|
|
1156
|
+
add(testEntries[category][index][currentPage - 1]);
|
|
1157
|
+
createPagination();
|
|
1158
|
+
});
|
|
1159
|
+
|
|
1160
|
+
paginationContainer.appendChild(startEllipsis);
|
|
1161
|
+
}
|
|
1162
|
+
|
|
1163
|
+
for (let i = startPage; i <= endPage; i++) {
|
|
1164
|
+
if (i <= totalPages) {
|
|
1165
|
+
const pageButton = document.createElement('li');
|
|
1166
|
+
pageButton.classList.add('page-item');
|
|
1167
|
+
|
|
1168
|
+
if (i === currentPage) {
|
|
1169
|
+
pageButton.classList.add('active');
|
|
1170
|
+
}
|
|
1171
|
+
|
|
1172
|
+
pageButton.innerHTML = `<a class="page-link" href="#pagination">${i}</a>`;
|
|
1173
|
+
pageButton.addEventListener('click', () => {
|
|
1174
|
+
remove(testEntries[category][index][currentPage - 1]);
|
|
1175
|
+
currentPage = i;
|
|
1176
|
+
add(testEntries[category][index][currentPage - 1]);
|
|
1177
|
+
createPagination();
|
|
1178
|
+
});
|
|
1179
|
+
|
|
1180
|
+
paginationContainer.appendChild(pageButton);
|
|
1181
|
+
}
|
|
1182
|
+
}
|
|
1183
|
+
|
|
1184
|
+
if (endPage < totalPages) {
|
|
1185
|
+
const endEllipsis = document.createElement('li');
|
|
1186
|
+
|
|
1187
|
+
endEllipsis.classList.add('page-item');
|
|
1188
|
+
endEllipsis.innerHTML = '<a class="page-link" href="#pagination">...</a>';
|
|
1189
|
+
endEllipsis.addEventListener('click', () => {
|
|
1190
|
+
remove(testEntries[category][index][currentPage - 1]);
|
|
1191
|
+
currentPage = totalPages;
|
|
1192
|
+
add(testEntries[category][index][currentPage - 1]);
|
|
1193
|
+
createPagination();
|
|
1194
|
+
});
|
|
1195
|
+
|
|
1196
|
+
paginationContainer.appendChild(endEllipsis);
|
|
1197
|
+
}
|
|
1198
|
+
|
|
1199
|
+
if (currentPage > 1) {
|
|
1200
|
+
const prevButton = document.createElement('li');
|
|
1201
|
+
|
|
1202
|
+
prevButton.classList.add('page-item');
|
|
1203
|
+
prevButton.innerHTML = '<a class="page-link" href="#pagination">Previous</a>';
|
|
1204
|
+
prevButton.addEventListener('click', () => {
|
|
1205
|
+
remove(testEntries[category][index][currentPage - 1]);
|
|
1206
|
+
currentPage--;
|
|
1207
|
+
add(testEntries[category][index][currentPage - 1]);
|
|
1208
|
+
createPagination();
|
|
1209
|
+
});
|
|
1210
|
+
|
|
1211
|
+
paginationContainer.insertBefore(prevButton, paginationContainer.firstChild);
|
|
1212
|
+
}
|
|
1213
|
+
if (currentPage < totalPages) {
|
|
1214
|
+
const nextButton = document.createElement('li');
|
|
1215
|
+
|
|
1216
|
+
nextButton.classList.add('page-item');
|
|
1217
|
+
nextButton.innerHTML = '<a class="page-link" href="#pagination">Next</a>';
|
|
1218
|
+
nextButton.addEventListener('click', () => {
|
|
1219
|
+
remove(testEntries[category][index][currentPage - 1]);
|
|
1220
|
+
currentPage++;
|
|
1221
|
+
add(testEntries[category][index][currentPage - 1]);
|
|
1222
|
+
createPagination();
|
|
1223
|
+
});
|
|
1224
|
+
|
|
1225
|
+
paginationContainer.appendChild(nextButton);
|
|
1226
|
+
}
|
|
1227
|
+
});
|
|
1228
|
+
}
|
|
1229
|
+
createPagination();
|
|
1230
|
+
}
|
|
1231
|
+
displayPagination(testEntries, 0, 'all');
|
|
1232
|
+
}
|
|
1233
|
+
|
|
1234
|
+
</script>
|
|
1235
|
+
</body>
|
|
1236
|
+
</html>
|