kraken-mobile 1.0.0

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.
Files changed (69) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE +8 -0
  3. data/README.md +169 -0
  4. data/bin/kraken-mobile +91 -0
  5. data/bin/kraken-mobile-calabash-android.rb +85 -0
  6. data/bin/kraken-mobile-generate.rb +19 -0
  7. data/bin/kraken-mobile-helpers.rb +48 -0
  8. data/bin/kraken-mobile-setup.rb +50 -0
  9. data/calabash-android-features-skeleton/my_first.feature +11 -0
  10. data/calabash-android-features-skeleton/step_definitions/kraken_steps.rb +1 -0
  11. data/calabash-android-features-skeleton/support/app_installation_hooks.rb +25 -0
  12. data/calabash-android-features-skeleton/support/app_life_cycle_hooks.rb +10 -0
  13. data/calabash-android-features-skeleton/support/env.rb +1 -0
  14. data/lib/kraken-mobile.rb +29 -0
  15. data/lib/kraken-mobile/constants.rb +25 -0
  16. data/lib/kraken-mobile/helpers/command_helper.rb +38 -0
  17. data/lib/kraken-mobile/helpers/devices_helper/adb_helper.rb +157 -0
  18. data/lib/kraken-mobile/helpers/devices_helper/manager.rb +43 -0
  19. data/lib/kraken-mobile/helpers/feature_analyzer.rb +28 -0
  20. data/lib/kraken-mobile/helpers/feature_grouper.rb +48 -0
  21. data/lib/kraken-mobile/helpers/reporter.rb +381 -0
  22. data/lib/kraken-mobile/models/device.rb +32 -0
  23. data/lib/kraken-mobile/protocols/file_protocol.rb +126 -0
  24. data/lib/kraken-mobile/runners/calabash/android/android_runner.rb +130 -0
  25. data/lib/kraken-mobile/runners/calabash/android/apk_signer.rb +14 -0
  26. data/lib/kraken-mobile/runners/calabash/android/cucumber.rb +27 -0
  27. data/lib/kraken-mobile/runners/calabash/android/kraken_hooks.rb +15 -0
  28. data/lib/kraken-mobile/runners/calabash/android/kraken_steps.rb +3 -0
  29. data/lib/kraken-mobile/runners/calabash/android/monkey_helper.rb +139 -0
  30. data/lib/kraken-mobile/runners/calabash/android/operations.rb +44 -0
  31. data/lib/kraken-mobile/runners/calabash/android/steps/communication_steps.rb +57 -0
  32. data/lib/kraken-mobile/runners/calabash/monkey/monkey_runner.rb +113 -0
  33. data/lib/kraken-mobile/runners/runner.rb +18 -0
  34. data/lib/kraken-mobile/version.rb +5 -0
  35. data/reporter/assets/css/bootstrap.min.css +6 -0
  36. data/reporter/assets/css/dataTables.bootstrap.min.css +1 -0
  37. data/reporter/assets/css/feature_index.css +449 -0
  38. data/reporter/assets/css/font-awesome.min.css +4 -0
  39. data/reporter/assets/css/responsive.dataTables.min.css +1 -0
  40. data/reporter/assets/css/scenario_index.css +461 -0
  41. data/reporter/assets/fonts/FontAwesome.otf +0 -0
  42. data/reporter/assets/fonts/fontawesome-webfont.eot +0 -0
  43. data/reporter/assets/fonts/fontawesome-webfont.svg +2671 -0
  44. data/reporter/assets/fonts/fontawesome-webfont.ttf +0 -0
  45. data/reporter/assets/fonts/fontawesome-webfont.woff +0 -0
  46. data/reporter/assets/fonts/fontawesome-webfont.woff2 +0 -0
  47. data/reporter/assets/fonts/glyphicons-halflings-regular.eot +0 -0
  48. data/reporter/assets/fonts/glyphicons-halflings-regular.svg +288 -0
  49. data/reporter/assets/fonts/glyphicons-halflings-regular.ttf +0 -0
  50. data/reporter/assets/fonts/glyphicons-halflings-regular.woff +0 -0
  51. data/reporter/assets/fonts/glyphicons-halflings-regular.woff2 +0 -0
  52. data/reporter/assets/images/kraken.png +0 -0
  53. data/reporter/assets/js/Chart.min.js +14 -0
  54. data/reporter/assets/js/bootstrap.min.js +7 -0
  55. data/reporter/assets/js/d3.chart.min.js +7 -0
  56. data/reporter/assets/js/d3.v3.min.js +5 -0
  57. data/reporter/assets/js/dataTables.bootstrap.min.js +8 -0
  58. data/reporter/assets/js/dataTables.responsive.min.js +26 -0
  59. data/reporter/assets/js/first-sankey.js +292 -0
  60. data/reporter/assets/js/gitgraph.min.js +10 -0
  61. data/reporter/assets/js/html5shiv.min.js +4 -0
  62. data/reporter/assets/js/jquery-3.2.1.min.js +4 -0
  63. data/reporter/assets/js/jquery.dataTables.min.js +167 -0
  64. data/reporter/assets/js/respond.min.js +5 -0
  65. data/reporter/assets/js/sankey.js +512 -0
  66. data/reporter/feature_report.html.erb +274 -0
  67. data/reporter/index.html.erb +711 -0
  68. data/reporter/scenario_report.html.erb +174 -0
  69. metadata +169 -0
@@ -0,0 +1,274 @@
1
+ <html lang="en">
2
+ <head>
3
+ <meta charset="UTF-8">
4
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
5
+ <meta http-equiv="X-UA-Compatible" content="ie=edge">
6
+ <title>Report</title>
7
+
8
+ <!-- Dependencies -->
9
+ <link rel="stylesheet" href="../assets/css/bootstrap.min.css">
10
+ <link href="../assets/css/font-awesome.min.css" rel="stylesheet">
11
+ <link href="../assets/css/dataTables.bootstrap.min.css" rel="stylesheet">
12
+ <link href="../assets/css/responsive.dataTables.min.css" rel="stylesheet">
13
+ <link href="../assets/css/feature_index.css" rel="stylesheet">
14
+ </head>
15
+ <body>
16
+ <nav class="navbar">
17
+ <div class="container-fluid">
18
+ <p class="navbar-text">Report</p>
19
+ </div>
20
+ </nav>
21
+
22
+ <div class="main_conainer">
23
+ <div class="row">
24
+ <div class="col-md-6 col-lg-6 col-xs-12">
25
+ <div class="x_panel fixed_height_320">
26
+ <div class="x_title">
27
+ <h2>Features</h2>
28
+ <div class="clearfix"></div>
29
+ </div>
30
+ <div class="x_content">
31
+ <table class="chart">
32
+ <tr>
33
+ <th>
34
+ <p>Chart</p>
35
+ </th>
36
+ <th>
37
+ <div class="col-lg-7 col-md-7 col-sm-7 col-xs-7">
38
+ <p class="">Status</p>
39
+ </div>
40
+ <div class="col-lg-5 col-md-5 col-sm-5 col-xs-5">
41
+ <p class="">Progress</p>
42
+ </div>
43
+ </th>
44
+ </tr> <!-- Row Names -->
45
+ <tr>
46
+ <td class="chart">
47
+ <canvas id="feature-chart"></canvas>
48
+ <div class="total"><%= @features.count %></div>
49
+ </td>
50
+ <td>
51
+ <table class="tile_info">
52
+ <tr>
53
+ <td>
54
+ <p data-toggle="tooltip" data-placement="left" title="Features passed">
55
+ <i class="fa fa-check-circle passed-color"></i>
56
+ Passed
57
+ </p>
58
+ </td>
59
+ <td class="percentage"><%= @total_passed_features_percentage %> %</td>
60
+ </tr>
61
+ <tr>
62
+ <td>
63
+ <p data-toggle="tooltip" data-placement="left" title="Features failed">
64
+ <i class="fa fa-exclamation-circle failed-color"></i>
65
+ Failed
66
+ </p>
67
+ </td>
68
+ <td class="percentage"><%= @total_failed_features_percentage %> %</td>
69
+ </tr>
70
+ </table>
71
+ </td>
72
+ </tr> <!-- Row values -->
73
+ </table>
74
+ </div>
75
+ </div>
76
+ </div> <!-- Left data -->
77
+ <div class="col-md-6 col-lg-6 col-xs-12">
78
+ <div class="x_panel fixed_height_320">
79
+ <div class="x_title">
80
+ <h2>Scenarios</h2>
81
+ <div class="clearfix"></div>
82
+ </div>
83
+ <div class="x_content">
84
+ <table class="chart">
85
+ <tr>
86
+ <th>
87
+ <p>Chart</p>
88
+ </th>
89
+ <th>
90
+ <div class="col-lg-7 col-md-7 col-sm-7 col-xs-7">
91
+ <p class="">Status</p>
92
+ </div>
93
+ <div class="col-lg-5 col-md-5 col-sm-5 col-xs-5">
94
+ <p class="">Progress</p>
95
+ </div> <!-- Row Names -->
96
+ </th>
97
+ </tr>
98
+ <tr>
99
+ <td class="chart">
100
+ <canvas id="scenario-chart"></canvas>
101
+ <div class="total"><%= @total_scenarios %></div>
102
+ </td>
103
+ <td>
104
+ <table class="tile_info">
105
+ <tr>
106
+ <td>
107
+ <p data-toggle="tooltip" data-placement="left" title="Scenario passed">
108
+ <i class="fa fa-check-circle passed-color"></i>
109
+ Passed
110
+ </p>
111
+ </td>
112
+ <td class="percentage"><%= @total_passed_scenarios_percentage %> %</td>
113
+ </tr>
114
+ <tr>
115
+ <td>
116
+ <p data-toggle="tooltip" data-placement="left" title="Scenario failed">
117
+ <i class="fa fa-exclamation-circle failed-color"></i>
118
+ Failed
119
+ </p>
120
+ </td>
121
+ <td class="percentage"><%= @total_failed_scenarios_percentage %> %</td>
122
+ </tr> <!-- Row values -->
123
+ </table>
124
+ </td>
125
+ </tr>
126
+ </table>
127
+ </div>
128
+ </div>
129
+ </div> <!-- Right data -->
130
+
131
+ <div class="row">
132
+ <div class="col-md-12 col-sm-12 col-xs-12">
133
+ <div class="x_panel">
134
+ <div class="x_title">
135
+ <h2>Features overview</h2>
136
+ <div class="clearfix"></div>
137
+ </div>
138
+ <div class="x_content">
139
+ <div class="table-responsive">
140
+ <table id="features-table" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0"
141
+ width="100%">
142
+ <thead>
143
+ <tr>
144
+ <th>Feature name</th>
145
+ <th>Status</th>
146
+ <th>Device</th>
147
+ <th>OS</th>
148
+ <th>App</th>
149
+ <th>Duration</th>
150
+ <th>Total</th>
151
+ <th>Passed</th>
152
+ <th>Failed</th>
153
+ </tr>
154
+ </thead> <!-- Table Header -->
155
+ <tbody>
156
+ <% @features.each do |f| %>
157
+ <tr>
158
+ <td>
159
+ <a href='<%= "./features_report/#{feature_id(f)}.html" %>'>
160
+ <%= f["name"] %>
161
+ </a>
162
+ </td>
163
+ <td class="text-center">
164
+ <% if feature_passed?(f) %>
165
+ <i class="fa fa-check-circle passed-color fa-lg" data-toggle="tooltip" data-placement="top" title="Passed">
166
+ <span>check-circle passed-color</span>
167
+ </i>
168
+ <% else %>
169
+ <i class="fa fa-exclamation-circle failed-color fa-lg" data-toggle="tooltip" data-placement="top" title="Failed">
170
+ <span>exclamation-circle failed-color</span>
171
+ </i>
172
+ <% end %>
173
+ </td>
174
+ <td>
175
+ <%= device.model %> - <%= device.id %>
176
+ </td>
177
+ <td>
178
+ <i class="fa fa-android fa-lg"><span>android</span></i>
179
+ </td>
180
+ <td>
181
+ <%= @apk_path %>
182
+ </td>
183
+ <td><%= format_duration(feature_duration(f)) %></td>
184
+ <td class="text-right "><%= f["elements"].count %></td>
185
+ <td class="text-right none"><%= passed_scenarios(f).count %></td>
186
+ <td class="text-right none"><%= failed_scenarios(f).count %></td>
187
+ </tr> <!-- Feature Row -->
188
+ <% end %>
189
+ </tbody>
190
+ </table>
191
+ </div>
192
+ </div>
193
+ </div>
194
+ </div>
195
+ </div>
196
+ </div>
197
+
198
+ <script src="../assets/js/jquery-3.2.1.min.js" ></script>
199
+ <script src="../assets/js/bootstrap.min.js"></script>
200
+ <script src="../assets/js/jquery.dataTables.min.js"></script>
201
+ <script src="../assets/js/dataTables.bootstrap.min.js"></script>
202
+ <script src="../assets/js/dataTables.responsive.min.js"></script>
203
+ <script src="../assets/js/Chart.min.js"></script>
204
+ <script>
205
+ $(document).ready(function () {
206
+ total_passed_features = parseInt("<%= total_passed_features(@features) %>");
207
+ total_failed_features = parseInt("<%= total_failed_features(@features) %>");
208
+ total_passed_scenarios = parseInt("<%= total_passed_scenarios(@features) %>");
209
+ total_failed_scenarios = parseInt("<%= total_failed_scenarios(@features) %>");
210
+
211
+ feature_data = [total_passed_features,total_failed_features];
212
+ scenario_data = [total_passed_scenarios,total_failed_scenarios]
213
+
214
+ $('#features-table').dataTable({
215
+ "order": [[0, "asc"]],
216
+ "lengthMenu": [[10, 20, 50, -1], [10, 20, 50, "All"]],
217
+ "stateSave": true
218
+ });
219
+
220
+ var featureOptions = {
221
+ legend: false,
222
+ responsive: false
223
+ };
224
+
225
+ new Chart(document.getElementById("feature-chart"), {
226
+ type: 'doughnut',
227
+ tooltipFillColor: "rgba(51, 51, 51, 0.55)",
228
+ data: {
229
+ labels: [
230
+ "Passed",
231
+ "Failed"
232
+ ],
233
+ datasets: [{
234
+ data: feature_data,
235
+ backgroundColor: [
236
+ "#26B99A",
237
+ "#E74C3C"
238
+ ]
239
+ }]
240
+ },
241
+ options: featureOptions
242
+ });
243
+
244
+ var scenarioOptions = {
245
+ legend: false,
246
+ responsive: false
247
+ };
248
+
249
+ new Chart(document.getElementById("scenario-chart"), {
250
+ type: 'doughnut',
251
+ tooltipFillColor: "rgba(51, 51, 51, 0.55)",
252
+ data: {
253
+ labels: [
254
+ "Passed",
255
+ "Failed"
256
+ ],
257
+ datasets: [{
258
+ data: scenario_data,
259
+ backgroundColor: [
260
+ "#26B99A",
261
+ "#E74C3C"
262
+ ]
263
+ }]
264
+ },
265
+ options: scenarioOptions
266
+ });
267
+
268
+ $('body').tooltip({
269
+ selector: '[data-toggle="tooltip"]'
270
+ });
271
+ });
272
+ </script>
273
+ </body>
274
+ </html>
@@ -0,0 +1,711 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <title>Report</title>
6
+
7
+ <!-- Dependencies -->
8
+ <link rel="stylesheet" href="./assets/css/bootstrap.min.css">
9
+ <link href="./assets/css/font-awesome.min.css" rel="stylesheet">
10
+ <link href="./assets/css/dataTables.bootstrap.min.css" rel="stylesheet">
11
+ <style>
12
+ body {
13
+ color: #73879C;
14
+ background: #F7F7F7;
15
+ font-family: "Helvetica Neue", Roboto, Arial, "Droid Sans", sans-serif;
16
+ font-size: 13px;
17
+ font-weight: 400;
18
+ line-height: 1.471;
19
+ }
20
+
21
+ .main_conainer {
22
+ padding: 10px 20px 0;
23
+ }
24
+
25
+ i span {
26
+ display: none;
27
+ }
28
+
29
+ /* Navigation */
30
+ nav.navbar {
31
+ background: #EDEDED;
32
+ border-bottom: 1px solid #D9DEE4;
33
+ margin-bottom: 10px;
34
+ }
35
+
36
+ nav .navbar-brand {
37
+ border-right: 1px solid #D9DEE4;
38
+ color: #5A738E;
39
+ }
40
+
41
+ nav .navbar-text {
42
+ font-size: 18px;
43
+ height: 50px;
44
+ margin-bottom: 0;
45
+ margin-top: 0;
46
+ padding: 15px 0;
47
+ }
48
+
49
+ /* Table */
50
+ table {
51
+ width: 100%;
52
+ }
53
+
54
+ table.chart tr th:first-of-type {
55
+ width: 33.333%;
56
+ }
57
+
58
+ .table > thead > tr > th {
59
+ background: #F5F7FA;
60
+ }
61
+
62
+ table.tile h3, table.tile h4, table.tile span {
63
+ font-weight: bold;
64
+ vertical-align: middle !important;
65
+ }
66
+
67
+ table.tile th, table.tile td {
68
+ text-align: center;
69
+ }
70
+
71
+ table.tile th {
72
+ border-bottom: 1px solid #E6ECEE;
73
+ }
74
+
75
+ table.tile td {
76
+ padding: 5px 0;
77
+ }
78
+
79
+ table.tile td ul {
80
+ text-align: left;
81
+ padding-left: 0;
82
+ }
83
+
84
+ table.tile td ul li {
85
+ list-style: none;
86
+ width: 100%;
87
+ }
88
+
89
+ table.tile td ul li a {
90
+ width: 100%;
91
+ }
92
+
93
+ table.tile td ul li a big {
94
+ right: 0;
95
+ float: right;
96
+ margin-right: 13px;
97
+ }
98
+
99
+ table.tile_info {
100
+ width: 100%;
101
+ }
102
+
103
+ table.tile_info td {
104
+ text-align: left;
105
+ padding: 1px;
106
+ font-size: 15px;
107
+ }
108
+
109
+ table.tile_info td p {
110
+ white-space: nowrap;
111
+ overflow: hidden;
112
+ text-overflow: ellipsis;
113
+ margin: 0;
114
+ line-height: 28px;
115
+ }
116
+
117
+ table.tile_info td i {
118
+ display: inline-block;
119
+ margin-right: 8px;
120
+ font-size: 17px;
121
+ float: left;
122
+ width: 18px;
123
+ line-height: 28px;
124
+ text-align: center;
125
+ }
126
+
127
+ table.tile_info td:first-child {
128
+ width: 65%;
129
+ }
130
+
131
+ td span {
132
+ line-height: 28px;
133
+ }
134
+
135
+ table.tile_info td.percentage {
136
+ text-align: right;
137
+
138
+ }
139
+
140
+ /* chart in table */
141
+ table td.chart {
142
+ display: inline-block;
143
+ position: relative;
144
+ }
145
+
146
+ table td.chart #feature-chart,
147
+ table td.chart #scenario-chart,
148
+ table td.chart .total {
149
+ height: 140px;
150
+ margin: 15px 10px 10px 0;
151
+ width: 140px;
152
+ }
153
+
154
+ table td.chart .total {
155
+ display: inline-block;
156
+ position: absolute;
157
+ font-size: 2em;
158
+ height: 50px;
159
+ line-height: 50px;
160
+ top: 45px;
161
+ left: 45px;
162
+ text-align: center;
163
+ vertical-align: middle;
164
+ width: 50px;
165
+ }
166
+
167
+ /* colors */
168
+ .ambiguous-color {
169
+ color: #E74C3C !important;
170
+ }
171
+
172
+ .failed-color {
173
+ color: #E74C3C !important;
174
+ }
175
+
176
+ .not-defined-color {
177
+ color: #F39C12 !important;
178
+ }
179
+
180
+ .passed-color {
181
+ color: #1ABB9C !important;
182
+ }
183
+
184
+ .pending-color {
185
+ color: #FFD119 !important;
186
+ }
187
+
188
+ .skipped-color {
189
+ color: #3498DB !important;
190
+ }
191
+
192
+ /* backgrounds */
193
+ .ambiguous-background {
194
+ background: #b73122 !important;
195
+ }
196
+
197
+ .failed-background {
198
+ background: #E74C3C !important;
199
+ }
200
+
201
+ .not-defined-background {
202
+ background: #F39C12 !important;
203
+ }
204
+
205
+ .passed-background {
206
+ background: #1ABB9C !important;
207
+ }
208
+
209
+ .pending-background {
210
+ background: #FFD119 !important;
211
+ }
212
+
213
+ .skipped-background {
214
+ background: #3498DB !important;
215
+ }
216
+
217
+ /* general */
218
+ .x_panel {
219
+ position: relative;
220
+ width: 100%;
221
+ margin-bottom: 10px;
222
+ padding: 10px 17px;
223
+ display: inline-block;
224
+ background: #fff;
225
+ border: 1px solid #E6E9ED;
226
+ -webkit-column-break-inside: avoid;
227
+ -moz-column-break-inside: avoid;
228
+ column-break-inside: avoid;
229
+ opacity: 1;
230
+ transition: all .2s ease;
231
+ }
232
+
233
+ .x_title {
234
+ border-bottom: 2px solid #E6E9ED;
235
+ padding: 1px 5px 6px;
236
+ margin-bottom: 10px;
237
+ }
238
+
239
+ .x_title .filter {
240
+ width: 40%;
241
+ float: right;
242
+ }
243
+
244
+ .x_title h2 {
245
+ margin: 5px 0 6px;
246
+ float: left;
247
+ font-size: 24px;
248
+ font-weight: 400;
249
+ display: block;
250
+ text-overflow: ellipsis;
251
+ overflow: hidden;
252
+ white-space: nowrap;
253
+ }
254
+
255
+ .fixed_height_320 {
256
+ height: 320px;
257
+ }
258
+
259
+ .x_title h2 small {
260
+ margin-left: 10px;
261
+ }
262
+
263
+ .x_title span {
264
+ color: #BDBDBD;
265
+ }
266
+
267
+ .x_content {
268
+ padding: 0 5px 6px;
269
+ position: relative;
270
+ width: 100%;
271
+ float: left;
272
+ clear: both;
273
+ margin-top: 5px;
274
+ overflow-x: scroll;
275
+ }
276
+
277
+ .x_content h4 {
278
+ font-size: 16px;
279
+ font-weight: 500;
280
+ }
281
+
282
+ .panel_toolbox {
283
+ float: right;
284
+ margin: 5px 0 0;
285
+ min-width: 70px;
286
+ }
287
+
288
+ .panel_toolbox > li {
289
+ float: right;
290
+ }
291
+
292
+ .panel_toolbox > li > a {
293
+ cursor: pointer;
294
+ }
295
+
296
+ .panel_toolbox > li > a {
297
+ padding: 5px;
298
+ color: #C5C7CB;
299
+ font-size: 14px;
300
+ }
301
+
302
+ .panel_toolbox > li > a:hover {
303
+ background: #F5F7FA;
304
+ }
305
+
306
+ .page-title {
307
+ width: 100%;
308
+ padding: 10px 0 30px 0;
309
+ }
310
+
311
+ .page-title {
312
+ display: block;
313
+ }
314
+
315
+ .page-title h1 {
316
+ margin: 9px 0;
317
+ }
318
+
319
+ .page-title .title_right {
320
+ width: 55%;
321
+ float: left;
322
+ display: block;
323
+ }
324
+
325
+ .page-title .title_right .pull-right {
326
+ margin: 10px 0;
327
+ }
328
+
329
+ .page-title p {
330
+ margin-left: 15px;
331
+ }
332
+
333
+ .dashboard-widget-content {
334
+ padding-top: 9px;
335
+ }
336
+
337
+ .dashboard-widget-content .sidebar-widget {
338
+ width: 50%;
339
+ display: inline-block;
340
+ vertical-align: top;
341
+ background: #fff;
342
+ border: 1px solid #abd9ea;
343
+ border-radius: 5px;
344
+ text-align: center;
345
+ float: right;
346
+ padding: 2px;
347
+ margin-top: 10px;
348
+ }
349
+
350
+ ul.quick-list {
351
+ padding-left: 0;
352
+ display: inline-block;
353
+ }
354
+
355
+ ul.quick-list li,
356
+ table.quick-list tr {
357
+ padding-left: 10px;
358
+ list-style: none;
359
+ margin: 0;
360
+ padding-bottom: 6px;
361
+ padding-top: 4px;
362
+ white-space: nowrap;
363
+ text-overflow: ellipsis;
364
+ overflow: hidden;
365
+ }
366
+
367
+ ul.quick-list li .meta-data-title,
368
+ table.quick-list td.meta-data-title {
369
+ display: inline-block;
370
+ min-width: 75px;
371
+ font-weight: bold;
372
+ }
373
+
374
+ ul.quick-list li span,
375
+ table.quick-list td {
376
+ line-height: 28px;
377
+ }
378
+
379
+ ul.quick-list li,
380
+ table.quick-list tr {
381
+ border-bottom: 1px solid #efefef;
382
+ padding: 0.5em 0;
383
+ }
384
+
385
+ ul.quick-list li:last-child,
386
+ table.quick-list tr:last-child {
387
+ border-bottom: none;
388
+ }
389
+
390
+ ul.quick-list li i {
391
+ padding-right: 10px;
392
+ color: #757679;
393
+ }
394
+
395
+ .screenshot{
396
+ max-height: 100%;
397
+ max-width: 100%;
398
+ }
399
+
400
+ /* Features / Scenarios */
401
+ ul.panel_toolbox li .step {
402
+ border-radius: 50%;
403
+ color: #ffffff;
404
+ display: block;
405
+ font-size: 14px;
406
+ height: 30px;
407
+ margin-right: 5px;
408
+ padding: 5px;
409
+ text-align: center;
410
+ width: 30px;
411
+ }
412
+
413
+ .scenario-step-container {
414
+ margin-bottom: 10px;
415
+ }
416
+
417
+ .scenario-step-container .label {
418
+ display: inline-block;
419
+ text-align: center;
420
+ width: 30px;
421
+ }
422
+
423
+ .scenario-step-container .text {
424
+ display: inline;
425
+ }
426
+
427
+ .scenario-step-container .duration {
428
+ position: relative;
429
+ float: right;
430
+ }
431
+
432
+ .scenario-step-container .text .keyword.highlight {
433
+ font-size: 1.2em;
434
+ font-weight: 700;
435
+ }
436
+
437
+ .scenario-scroll-bar {
438
+ overflow-x: scroll;
439
+ }
440
+
441
+ .scenario-step-collapse,
442
+ .scenario-scroll-bar .arguments {
443
+ margin-left: 30px;
444
+ width: auto;
445
+ }
446
+
447
+ /* media */
448
+ @media (max-width: 1200px) {
449
+ .x_title h2 {
450
+ width: 70%;
451
+ }
452
+ }
453
+
454
+ @media (max-width: 640px) {
455
+ .x_title h2 {
456
+ width: 100%;
457
+ }
458
+ }
459
+
460
+ /* override */
461
+ table.dataTable.dtr-inline.collapsed > tbody > tr > td:first-child:before,
462
+ table.dataTable.dtr-inline.collapsed > tbody > tr > th:first-child:before {
463
+ background-color: #1ABB9C;
464
+ }
465
+
466
+ table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before {
467
+ background-color: #E74C3C;
468
+ }
469
+
470
+ .created-by {
471
+ padding: 50px 0;
472
+ text-align: center;
473
+ }
474
+
475
+ .x_title {
476
+ margin-top: 20px;
477
+ margin-bottom: 30px;
478
+ }
479
+
480
+ .feature-flow {
481
+ background-color: white;
482
+ margin-bottom: 30px;
483
+ -webkit-box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.07);
484
+ box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.07);
485
+ }
486
+
487
+ .feature-flow-content {
488
+ overflow-x: scroll;
489
+ }
490
+
491
+ /* Device List */
492
+
493
+ .ui-card {
494
+ background: #fff;
495
+ border: 1px solid #dfe5ef;
496
+ border-radius: 8px;
497
+ margin: 0 20px 20px 20px;
498
+ padding: 70px 5px 50px 10px;
499
+ -webkit-box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.07);
500
+ box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.07);
501
+ }
502
+
503
+ .ui-card:hover {
504
+ -webkit-box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.15);
505
+ box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.15);
506
+ }
507
+
508
+ .device-container {
509
+ width: 100%;
510
+ }
511
+
512
+ .ui-card {
513
+ text-align: center;
514
+ }
515
+
516
+ .device-os-icon i {
517
+ color: #324057;
518
+ font-size: 28px;
519
+ }
520
+
521
+ .device-title {
522
+ word-wrap: break-word;
523
+ font-size: 28px;
524
+ font-weight: 300;
525
+ color: #324057;
526
+ margin-top: 25px;
527
+ margin-bottom: 50px;
528
+ }
529
+
530
+ .device-info {
531
+ font-size: 14px;
532
+ font-weight: 300;
533
+ color: #8492a6;
534
+ margin-bottom: 10px;
535
+ word-wrap: break-word;
536
+ }
537
+
538
+ a {
539
+ text-decoration: none !important;
540
+ }
541
+
542
+ .result-btn {
543
+ margin-top: 35px;
544
+ }
545
+
546
+ .phone_container {
547
+ padding-top: 30px;
548
+ padding-bottom: 30px;
549
+ -webkit-box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.07);
550
+ box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.07);
551
+ }
552
+
553
+ .phone {
554
+ margin: 0 auto;
555
+ border: 15px solid #000000;
556
+ border-radius: 36px;
557
+ height: 270px;
558
+ width: 160px;
559
+ overflow: hidden;
560
+ }
561
+
562
+ .phone_image {
563
+ width: 100%;
564
+ height: 100%;
565
+ object-fit: scale-down;
566
+ }
567
+ </style>
568
+
569
+ <script src="./assets/js/d3.v3.min.js"></script>
570
+ <script src="./assets/js/first-sankey.js"></script>
571
+ <script src="./assets/js/d3.chart.min.js"></script>
572
+ <script src="./assets/js/sankey.js"></script>
573
+ <style>
574
+ #chart {
575
+ font: 13px sans-serif;
576
+ height: 500px;
577
+ }
578
+ .node rect {
579
+ fill-opacity: .9;
580
+ shape-rendering: crispEdges;
581
+ stroke-width: 0;
582
+ }
583
+ .link {
584
+ fill: none;
585
+ stroke: #000;
586
+ stroke-opacity: .2;
587
+ }
588
+ </style>
589
+ </head>
590
+ <body>
591
+ <div class="main_conainer">
592
+ <div class="container-fluid devices-list">
593
+ <div class="x_title">
594
+ <h2>Devices List</h2>
595
+ <div class="clearfix"></div>
596
+ </div>
597
+ <div class="row">
598
+ <% @devices.each do |device| %>
599
+ <div class="ui-card col-md-3">
600
+ <div class="container device-container">
601
+ <div class="row device-os-icon">
602
+ <i class="fa fa-android fa-lg"></i>
603
+ </div>
604
+ <div class="row device-title"><%= device['model'] %></div>
605
+ <div class="row device-info">ID - <%= device['id'] %></div>
606
+ <div class="row device-info">SDK Version - <%= device['sdk'] %></div>
607
+ <div class="row device-info">Screen Size - <%= "#{device['screen_height']}x#{device['screen_width']}" %></div>
608
+ <div class="row device-info result-btn">
609
+ <a href='<%= "./#{device['id']}/feature_report.html" %>'>See Results</a>
610
+ </div>
611
+ </div>
612
+ </div>
613
+ <% end %>
614
+ </div>
615
+ </div>
616
+ <% @features_report.values.each_with_index do |element, index| %>
617
+ <div class="container-fluid">
618
+ <div class="row">
619
+ <div class="x_title">
620
+ <h2 id="chart_row<%= index + 1 %>"></h2>
621
+ <div class="clearfix"></div>
622
+ </div>
623
+ </div>
624
+ <div class="row feature-flow">
625
+ <div id="chart<%= index + 1 %>"></div>
626
+ </div>
627
+ </div>
628
+ <% end %>
629
+ </div>
630
+
631
+ <script src="./assets/js/jquery-3.2.1.min.js" ></script>
632
+ <script src="./assets/js/bootstrap.min.js"></script>
633
+ <script>
634
+ d3.json("./assets/js/data.json", function(error, json) {
635
+ for(var i = 0; i < json.length; i++) {
636
+ let jsonObject = json[i];
637
+ let devicesSet = new Set([]);
638
+ let devicesHash = {};
639
+ for(var k = 0; k < jsonObject.links.length; k++) {
640
+ let link = jsonObject.links[k];
641
+ devicesSet.add(link.owner);
642
+ devicesHash[link.owner] = link.owner_model
643
+ }
644
+ devices = Array.from(devicesSet);
645
+ // GRAPH
646
+ var height = 150*(devices.length-1);
647
+ var c20c = d3.scale.category10();
648
+ d3.select("#chart_row" + (i+1))
649
+ .text(jsonObject["name"])
650
+
651
+ let chartId = "#chart" + (i+1);
652
+ var svg = d3.select(chartId)
653
+ .style("height", height + "px")
654
+ .append("svg");
655
+
656
+ var chart = svg.chart("Sankey.Path");
657
+
658
+ chart
659
+ .name(label)
660
+ .colorNodes(function(name, node) {
661
+ color = "#ff6961";
662
+ if(node.id == "empty") {
663
+ color = "#9f9fa3"
664
+ } else if(node.status === "passed") {
665
+ color = "#77dd77";
666
+ }
667
+ return color;
668
+ })
669
+ .colorLinks(function(link) {
670
+ return c20c(link.owner);
671
+ })
672
+ .nodeWidth(10)
673
+ .nodePadding(10)
674
+ .spread(true)
675
+ .draw(jsonObject);
676
+
677
+ // LEGEND
678
+ let legendRectSize = 10;
679
+ let legendSpacing = 10
680
+
681
+ var legend = svg
682
+ .append("g")
683
+ .selectAll("g")
684
+ .data(Object.keys(devicesHash))
685
+ .enter()
686
+ .append('g')
687
+ .attr('class', 'legend')
688
+ .attr('transform', function(d, i) {
689
+ var height = legendRectSize;
690
+ var x = 10;
691
+ var y = 10 + (i * height) + i*5;
692
+ return 'translate(' + x + ',' + y + ')';
693
+ });
694
+
695
+ legend.append('rect')
696
+ .attr('width', legendRectSize)
697
+ .attr('height', legendRectSize)
698
+ .style('fill', function(d) {
699
+ return c20c(d);
700
+ })
701
+ .style('opacity', .2)
702
+
703
+ legend.append('text')
704
+ .attr('x', legendRectSize + 5)
705
+ .attr('y', 10)
706
+ .text(function(d) { return devicesHash[d]; });
707
+ }
708
+ });
709
+ </script>
710
+ </body>
711
+ </html>