[UI] Ignore malformed results
[validation.git] / ui / src / main / webapp / app / BluvalUI / ValidationResults / TestSuiteResults / TestSuiteResultsModal.html
1 <!--
2 Copyright (c) 2019 AT&T Intellectual Property. All rights reserved.
3
4 Licensed under the Apache License, Version 2.0 (the "License");
5 you may not use this file except in compliance with the License.
6 You may obtain a copy of the License at
7
8        http://www.apache.org/licenses/LICENSE-2.0
9
10 Unless required by applicable law or agreed to in writing, software
11 distributed under the License is distributed on an "AS IS" BASIS,
12 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 See the License for the specific language governing permissions and
14 limitations under the License.
15 -->
16 <div id="page-content" class="content" style="padding: 25px;">
17
18     <style>
19 .graph, .empty-graph {
20     border: 1px solid #ccc;
21     width: auto;
22     height: 7px;
23     padding: 0;
24     background: #f33;
25 }
26
27 .pass-bar {
28     background: #1d4;
29 }
30
31 .pass-bar, .fail-bar {
32     float: left;
33     height: 100%;
34 }
35
36 div.box {
37     border: 1px solid black;
38 }
39
40 .bluvalDetails .property {
41     width: 30%;
42     display: inline-block;
43     box-sizing: border-box;
44     text-align: left;
45 }
46
47 .bluvalDetails .value {
48     text-align: left;
49     padding-left: 10px;
50     width: 70%;
51     display: inline-block;
52     box-sizing: border-box;
53 }
54
55 .selected {
56     background-color: #337ab7;
57     font-weight: bold;
58 }
59
60 #page-content {
61     margin-left: 20px;
62 }
63 </style>
64
65     <div ng-show="showTestSuitesResults">
66         <h2 class="heading-small"></h2>
67         <h1 class="heading-page">Display Test Suites Results</h1>
68
69         <h2 class="heading-small"></h2>
70         <div>
71             <h2 class="heading-small">Select a blueprint layer:</h2>
72             <div>
73                 <select ng-model="selectedLayer"
74                     ng-init="resultsLayers[0]"
75                     ng-change="selectedResultsLayerChange(selectedLayer)"
76                     ng-options="n for n in resultsLayers">
77                 </select>
78             </div>
79
80             <h2 class="heading-small">Select a test suite of the
81                 selected layer in order to be displayed:</h2>
82             <div>
83                 <select ng-model="selectedTestSuiteName"
84                     ng-init="resultsLayerTestSuitesNames[0]"
85                     ng-change="selectedTestSuitesNameChange(selectedTestSuiteName)"
86                     ng-options="n for n in resultsLayerTestSuitesNames">
87                 </select>
88             </div>
89         </div>
90
91         <br> <br> <br>
92
93         <div ng-hide="!selectedLayer || !selectedTestSuiteName">
94             <div>
95                 <h2 class="heading-small"></h2>
96                 <div class="box">
97                     <h3 class="heading-small">
98                         <u>General Info</u>
99                     </h3>
100                     <p></p>
101
102                     <p></p>
103                     <p>Name: {{selectedRobotTestResult.name}}</p>
104                     <p>Generated:
105                         {{selectedRobotTestResult.robot.generated}}</p>
106                     <p>Generator:
107                         {{selectedRobotTestResult.robot.generator}}</p>
108                     <p>Errors:
109                         {{selectedRobotTestResult.robot.errors}}</p>
110
111                     <h2 class="heading-small"></h2>
112                     <h3 class="heading-small">
113                         <u>Test Statistics</u>
114                     </h3>
115                     <p></p>
116                     <table class="striped" cellspacing="0"
117                         cellpadding="10">
118                         <caption>
119                             <h3></h3>
120                         </caption>
121                         <thead>
122                             <th>
123                                 <p>&nbsp;Total statistics&nbsp;</p>
124                             </th>
125                             <th>
126                                 <p>Total&nbsp;</p>
127                             </th>
128                             <th>
129                                 <p>Pass&nbsp;</p>
130                             </th>
131                             <th>
132                                 <p>Fail&nbsp;</p>
133                             </th>
134                             <th>
135                                 <p>Pass / Fail&nbsp;</p>
136                             </th>
137                             </tr>
138                         </thead>
139                         <tbody>
140                             <tr
141                                 ng-repeat="stat in selectedRobotTestResult.robot.statistics.total.stat">
142                                 <td
143                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
144                                     stat.content }}</td>
145                                 <td
146                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
147                                     (stat.fail * 1) + (stat.pass*1) }}</td>
148                                 <td
149                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
150                                     stat.pass }}</td>
151                                 <td
152                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
153                                     stat.fail}}</td>
154                                 <td
155                                     style="padding-left: 10px; font-size: 15px; width: 13%;">
156                                     <div class="graph">
157                                         <div class="pass-bar"
158                                             ng-style="{ 'width': {{(100* stat.pass/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
159                                             title="100%"></div>
160                                         <div class="fail-bar"
161                                             ng-style="{ 'width': {{(100* stat.fail/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
162                                             title="0%"></div>
163                                     </div>
164                                 </td>
165                             </tr>
166                         </tbody>
167                     </table>
168
169                     <br>
170
171                     <h3 class="heading-small"></h3>
172                     <table class="striped" cellspacing="0"
173                         cellpadding="10">
174                         <caption>
175                             <h3></h3>
176                         </caption>
177                         <thead>
178                             <th>
179                                 <p>&nbsp;Statistics by Tag&nbsp;</p>
180                             </th>
181                             <th>
182                                 <p>Total&nbsp;</p>
183                             </th>
184                             <th>
185                                 <p>Pass&nbsp;</p>
186                             </th>
187                             <th>
188                                 <p>Fail&nbsp;</p>
189                             </th>
190                             <th>
191                                 <p>Pass / Fail&nbsp;</p>
192                             </th>
193                             </tr>
194                         </thead>
195                         <tbody>
196                             <tr
197                                 ng-repeat="stat in selectedRobotTestResult.robot.statistics.tag.stat">
198                                 <td
199                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
200                                     stat.content }}</td>
201                                 <td
202                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
203                                     (stat.fail * 1) + (stat.pass*1) }}</td>
204                                 <td
205                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
206                                     stat.pass }}</td>
207                                 <td
208                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
209                                     stat.fail}}</td>
210                                 <td
211                                     style="padding-left: 10px; font-size: 15px; width: 13%;">
212                                     <div class="graph">
213                                         <div class="pass-bar"
214                                             ng-style="{ 'width': {{(100* stat.pass/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
215                                             title="100%"></div>
216                                         <div class="fail-bar"
217                                             ng-style="{ 'width': {{(100* stat.fail/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
218                                             title="0%"></div>
219                                     </div>
220                                 </td>
221                             </tr>
222                         </tbody>
223                     </table>
224
225                     <br>
226
227                     <h3 class="heading-small"></h3>
228                     <table class="striped" cellspacing="0"
229                         cellpadding="10">
230                         <caption>
231                             <h3></h3>
232                         </caption>
233                         <thead>
234                             <th>
235                                 <p>&nbsp;Statistics by Suite&nbsp;</p>
236                             </th>
237                             <th>
238                                 <p>Total&nbsp;</p>
239                             </th>
240                             <th>
241                                 <p>Pass&nbsp;</p>
242                             </th>
243                             <th>
244                                 <p>Fail&nbsp;</p>
245                             </th>
246                             <th>
247                                 <p>Pass / Fail&nbsp;</p>
248                             </th>
249                             </tr>
250                         </thead>
251                         <tbody>
252                             <tr
253                                 ng-repeat="stat in selectedRobotTestResult.robot.statistics.suite.stat">
254                                 <td
255                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
256                                     stat.content }}</td>
257                                 <td
258                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
259                                     (stat.fail * 1) + (stat.pass*1) }}</td>
260                                 <td
261                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
262                                     stat.pass }}</td>
263                                 <td
264                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
265                                     stat.fail}}</td>
266                                 <td
267                                     style="padding-left: 10px; font-size: 15px; width: 13%;">
268                                     <div class="graph">
269                                         <div class="pass-bar"
270                                             ng-style="{ 'width': {{(100* stat.pass/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
271                                             title="100%"></div>
272                                         <div class="fail-bar"
273                                             ng-style="{ 'width': {{(100* stat.fail/((stat.fail * 1) + (stat.pass*1)) )| number:0}} + '%' }"
274                                             title="0%"></div>
275                                     </div>
276                                 </td>
277                             </tr>
278                         </tbody>
279                     </table>
280                 </div>
281
282                 <h2 class="heading-small"></h2>
283                 <div class="box">
284                     <h3 class="heading-small">
285                         <a href="javascript:void(0);"
286                             ng-click="showDetailsLog = ! showDetailsLog">Test
287                             Execution Log</a>
288                     </h3>
289                     <div ng-show="showDetailsLog">
290                         <p></p>
291                         <p>Root Suite Full Name:
292                             {{selectedRobotTestResult.robot.suite.name}}</p>
293                         <p>Source:
294                             {{selectedRobotTestResult.robot.suite.source}}</p>
295                         <p>Status:
296                             {{selectedRobotTestResult.robot.suite.status.status}}</p>
297                         <p>Start time:
298                             {{selectedRobotTestResult.robot.suite.status.starttime}}</p>
299                         <p>End time:
300                             {{selectedRobotTestResult.robot.suite.status.endtime}}</p>
301
302                         <h2 class="heading-small"></h2>
303                         <p></p>
304                         <p>Sub-suite Full Name:
305                             {{selectedRobotTestResult.robot.suite.suite.name}}</p>
306                         <p>Documentation:
307                             {{selectedRobotTestResult.robot.suite.suite.doc}}</p>
308                         <p>Source:
309                             {{selectedRobotTestResult.robot.suite.suite.source}}</p>
310                         <p>Status:
311                             {{selectedRobotTestResult.robot.suite.suite.status.status}}</p>
312                         <p>Start time:
313                             {{selectedRobotTestResult.robot.suite.suite.status.starttime}}</p>
314                         <p>End time:
315                             {{selectedRobotTestResult.robot.suite.suite.status.endtime}}</p>
316                     </div>
317                 </div>
318
319                 <h2 class="heading-small"></h2>
320                 <div class="box">
321                     <ul>
322                         <h4 class="heading-small">Sub-suite Robot
323                             keywords</h4>
324                         <li
325                             ng-repeat="kw in selectedRobotTestResult.robot.suite.suite.kw"
326                             ng-include="'kwVal'"></li>
327                     </ul>
328                 </div>
329
330                 <h2 class="heading-small"></h2>
331                 <div class="box">
332                     <h3 class="heading-small">Test Cases</h3>
333                     <table class="striped" cellspacing="0"
334                         cellpadding="10">
335                         <caption>
336                             <h3></h3>
337                         </caption>
338                         <thead>
339                             <th>
340                                 <p>&nbsp;Full Name&nbsp;</p>
341                             </th>
342                             <th>
343                                 <p>Documentation&nbsp;</p>
344                             </th>
345                             <th>
346                                 <p>Status&nbsp;</p>
347                             </th>
348                             <th>
349                                 <p>Start Time&nbsp;</p>
350                             </th>
351                             <th>
352                                 <p>End Time&nbsp;</p>
353                             </th>
354                             <th>
355                                 <p>Critical&nbsp;</p>
356                             </th>
357                             <th>
358                                 <p>Message&nbsp;</p>
359                             </th>
360                             </tr>
361                         </thead>
362                         <tbody>
363                             <tr
364                                 ng-repeat="test in selectedRobotTestResult.robot.suite.suite.test"
365                                 ng-class="{selected:test.id == selectedTestId}"
366                                 ng-click="setClickedTest(test)">
367                                 <td
368                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{
369                                     test.name }}</td>
370                                 <td
371                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.doc}}</td>
372                                 <td
373                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.status.status}}</td>
374                                 <td
375                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.status.starttime}}</td>
376                                 <td
377                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.status.endtime}}</td>
378                                 <td
379                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.status.critical}}</td>
380                                 <td
381                                     style="padding-left: 10px; font-size: 15px; width: 13%;">{{test.status.content}}</td>
382                             </tr>
383                         </tbody>
384                     </table>
385                 </div>
386
387                 <h2 class="heading-small"></h2>
388                 <div class="box">
389                     <ul>
390                         <h4 class="heading-small">Robot keywords of
391                             the selected test case</h4>
392                         <li ng-repeat="kw in selectedTest.kw"
393                             ng-include="'kwVal3'"></li>
394                     </ul>
395                 </div>
396
397             </div>
398         </div>
399
400         <script type="text/ng-template" id="kwVal">
401 <h2 class="heading-small"></h2>
402                         <h4>
403                             <a href="javascript:void(0);" ng-click="showDetails = ! showDetails">
404                                 {{kw.name}}</a>
405                         </h4>
406                         <div ng-show="showDetails">
407                             <p>&emsp;&emsp;&emsp;&emsp; Type:
408                                 {{kw.type}}</p>
409                             <p>&emsp;&emsp;&emsp;&emsp; Library:
410                                 {{kw.library}}</p>
411                             <p>&emsp;&emsp;&emsp;&emsp;
412                                 Documentation: {{kw.doc}}</p>
413                             <p>&emsp;&emsp;&emsp;&emsp; Start time:
414                                 {{kw.status.starttime}}</p>
415                             <p>&emsp;&emsp;&emsp;&emsp; End time:
416                                 {{kw.status.endtime}}</p>
417                             <p>&emsp;&emsp;&emsp;&emsp; Status:
418                                 {{kw.status.status}}</p>
419                             <p></p>
420                             <p>&emsp;&emsp;&emsp;&emsp; Used Robot
421                                 keywords:</p>
422    <ul ng-if="kw.kw">
423     <li ng-repeat="kw in kw.kw" ng-include="'kwVal'"></li>
424   </ul>
425 </script>
426
427         <script type="text/ng-template" id="kwVal3">
428 <h2 class="heading-small"></h2>
429                         <h4>
430                             <a href="javascript:void(0);" ng-click="showDetails4 = ! showDetails4">
431                                 {{kw.name}}</a>
432                         </h4>
433                         <div ng-show="showDetails4">
434                             <p>&emsp;&emsp;&emsp;&emsp; Type:
435                                 {{kw.type}}</p>
436                             <p>&emsp;&emsp;&emsp;&emsp; Library:
437                                 {{kw.library}}</p>
438                             <p>&emsp;&emsp;&emsp;&emsp;
439                                 Documentation: {{kw.doc}}</p>
440                             <p>&emsp;&emsp;&emsp;&emsp; Start time:
441                                 {{kw.status.starttime}}</p>
442                             <p>&emsp;&emsp;&emsp;&emsp; End time:
443                                 {{kw.status.endtime}}</p>
444                             <p>&emsp;&emsp;&emsp;&emsp; Status:
445                                 {{kw.status.status}}</p>
446                             <p></p>
447                             <p>&emsp;&emsp;&emsp;&emsp; Used Robot
448                                 keywords:</p>
449    <ul ng-if="kw.kw">
450     <li ng-repeat="kw in kw.kw" ng-include="'kwVal3'"></li>
451   </ul>
452 </script>
453     </div>
454 </div>