@madgex/design-system 3.0.2 → 3.0.3

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 (109) hide show
  1. package/.eslintignore +2 -0
  2. package/.eslintrc.js +3 -3
  3. package/__tests__/.eslintrc.js +3 -3
  4. package/__tests__/unit/src/components/combobox.spec.js +4 -28
  5. package/__tests__/unit/src/components/notification.spec.js +14 -12
  6. package/__tests__/unit/src/components/popover.spec.js +4 -0
  7. package/__tests__/unit/tasks/css.spec.js +3 -2
  8. package/__tests__/unit/tasks/jsbundle.spec.js +3 -2
  9. package/__tests__/unit/tasks/svgsprite.spec.js +3 -2
  10. package/__tests__/unit/tasks/tokens.spec.js +3 -2
  11. package/coverage/cobertura-coverage.xml +389 -389
  12. package/coverage/components/accordion/accordion.js.html +164 -127
  13. package/coverage/components/accordion/index.html +23 -22
  14. package/coverage/components/button/button.js.html +3 -2
  15. package/coverage/components/button/index.html +3 -2
  16. package/coverage/components/inputs/combobox/combobox.js.html +3 -2
  17. package/coverage/components/inputs/combobox/index.html +3 -2
  18. package/coverage/components/inputs/combobox/vue-components/Combobox.vue.html +55 -54
  19. package/coverage/components/inputs/combobox/vue-components/ListBoxOption.vue.html +9 -8
  20. package/coverage/components/inputs/combobox/vue-components/index.html +21 -20
  21. package/coverage/components/inputs/file-upload/file-upload.js.html +7 -3
  22. package/coverage/components/inputs/file-upload/index.html +3 -2
  23. package/coverage/components/inputs/textarea/character-count.js.html +13 -3
  24. package/coverage/components/inputs/textarea/index.html +3 -2
  25. package/coverage/components/modal/index.html +23 -22
  26. package/coverage/components/modal/modal.js.html +118 -111
  27. package/coverage/components/notification/index.html +3 -2
  28. package/coverage/components/notification/notification.js.html +13 -3
  29. package/coverage/components/popover/index.html +3 -2
  30. package/coverage/components/popover/popover.js.html +3 -2
  31. package/coverage/components/switch-state/index.html +19 -18
  32. package/coverage/components/switch-state/switch-state.js.html +22 -21
  33. package/coverage/components/tabs/index.html +3 -2
  34. package/coverage/components/tabs/tabs.js.html +37 -3
  35. package/coverage/favicon.png +0 -0
  36. package/coverage/index.html +52 -51
  37. package/coverage/js/common.js.html +3 -2
  38. package/coverage/js/fractal-scripts/combobox.js.html +22 -3
  39. package/coverage/js/fractal-scripts/index.html +3 -2
  40. package/coverage/js/fractal-scripts/notification.js.html +13 -3
  41. package/coverage/js/fractal-scripts/switch-state.js.html +13 -3
  42. package/coverage/js/index-fractal.js.html +3 -2
  43. package/coverage/js/index-polyfills.js.html +3 -2
  44. package/coverage/js/index-vue.js.html +3 -2
  45. package/coverage/js/index.html +3 -2
  46. package/coverage/js/index.js.html +3 -2
  47. package/coverage/js/polyfills/arrayPrototypeFind.js.html +20 -10
  48. package/coverage/js/polyfills/closest.js.html +8 -4
  49. package/coverage/js/polyfills/index.html +3 -2
  50. package/coverage/js/polyfills/objectAssign.js.html +19 -9
  51. package/coverage/js/polyfills/remove.js.html +3 -2
  52. package/coverage/tokens/_config.js.html +3 -2
  53. package/coverage/tokens/index.html +3 -2
  54. package/cypress/.eslintrc.js +6 -6
  55. package/cypress/fixtures/testuploadfile.txt +1 -0
  56. package/cypress/integration/components/accordion.spec.js +40 -3
  57. package/cypress/integration/components/button.spec.js +2 -3
  58. package/cypress/integration/components/card.spec.js +2 -3
  59. package/cypress/integration/components/icons.spec.js +10 -0
  60. package/cypress/integration/components/{combobox.spec.js → inputs/combobox.spec.js} +6 -0
  61. package/cypress/integration/components/inputs/file-upload.spec.js +45 -0
  62. package/cypress/integration/components/{input.spec.js → inputs/input.spec.js} +1 -1
  63. package/cypress/integration/components/inputs/label.spec.js +15 -0
  64. package/cypress/integration/components/inputs/radio.spec.js +20 -0
  65. package/cypress/integration/components/inputs/select.spec.js +31 -0
  66. package/cypress/integration/components/inputs/textarea.spec.js +23 -0
  67. package/cypress/integration/components/modal.spec.js +65 -0
  68. package/cypress/integration/components/notifications.spec.js +35 -0
  69. package/cypress/integration/components/popover.spec.js +36 -0
  70. package/cypress/integration/components/skip-link.spec.js +9 -0
  71. package/cypress/plugins/index.js +1 -1
  72. package/cypress/support/commands.js +14 -0
  73. package/cypress/support/index.js +2 -0
  74. package/dist/_tokens/css/_tokens.css +1 -1
  75. package/dist/_tokens/js/_tokens-module.js +455 -1
  76. package/dist/_tokens/scss/_tokens.scss +4 -4
  77. package/dist/assets/icons.json +1 -1
  78. package/dist/assets/icons.svg +6 -1
  79. package/dist/js/index.js +1 -1
  80. package/fractal.js +2 -0
  81. package/package.json +59 -54
  82. package/server.js +1 -1
  83. package/src/components/accordion/accordion.config.js +9 -12
  84. package/src/components/accordion/accordion.js +12 -0
  85. package/src/components/inputs/file-upload/file-upload.js +1 -0
  86. package/src/components/inputs/textarea/character-count.js +3 -0
  87. package/src/components/modal/modal.js +3 -1
  88. package/src/components/notification/notification.js +3 -0
  89. package/src/components/skip-link/skip-link.njk +11 -1
  90. package/src/components/tabs/tabs.js +11 -0
  91. package/src/js/fractal-scripts/combobox.js +6 -0
  92. package/src/js/fractal-scripts/notification.js +3 -0
  93. package/src/js/fractal-scripts/switch-state.js +3 -0
  94. package/src/js/polyfills/arrayPrototypeFind.js +9 -6
  95. package/src/js/polyfills/closest.js +2 -1
  96. package/src/js/polyfills/objectAssign.js +9 -6
  97. package/tasks/colorTransforms.js +4 -0
  98. package/tasks/createMacroIndex.js +1 -0
  99. package/tasks/css.js +3 -0
  100. package/tasks/fractal.js +2 -0
  101. package/tasks/js-bundle.js +6 -2
  102. package/tasks/svgsprite.js +31 -21
  103. package/tasks/tokens.js +2 -0
  104. package/__tests__/unit/src/components/accordion.spec.js +0 -88
  105. package/__tests__/unit/src/components/modal.spec.js +0 -87
  106. package/__tests__/unit/src/components/switch-state.spec.js +0 -21
  107. package/cypress/integration/components/textarea.spec.js +0 -9
  108. /package/cypress/integration/components/{checkbox-list.spec.js → inputs/checkbox-list.spec.js} +0 -0
  109. /package/cypress/integration/components/{single-checkbox.spec.js → inputs/single-checkbox.spec.js} +0 -0
@@ -7,7 +7,8 @@
7
7
  <meta charset="utf-8" />
8
8
  <link rel="stylesheet" href="../../prettify.css" />
9
9
  <link rel="stylesheet" href="../../base.css" />
10
- <meta name="viewport" content="width=device-width, initial-scale=1">
10
+ <link rel="shortcut icon" type="image/x-icon" href="../../favicon.png" />
11
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
11
12
  <style type='text/css'>
12
13
  .coverage-summary .sorter {
13
14
  background-image: url(../../sort-arrow-sprite.png);
@@ -22,30 +23,30 @@
22
23
  <div class='clearfix'>
23
24
 
24
25
  <div class='fl pad1y space-right2'>
25
- <span class="strong">67.47% </span>
26
+ <span class="strong">0% </span>
26
27
  <span class="quiet">Statements</span>
27
- <span class='fraction'>56/83</span>
28
+ <span class='fraction'>0/83</span>
28
29
  </div>
29
30
 
30
31
 
31
32
  <div class='fl pad1y space-right2'>
32
- <span class="strong">50% </span>
33
+ <span class="strong">0% </span>
33
34
  <span class="quiet">Branches</span>
34
- <span class='fraction'>12/24</span>
35
+ <span class='fraction'>0/24</span>
35
36
  </div>
36
37
 
37
38
 
38
39
  <div class='fl pad1y space-right2'>
39
- <span class="strong">50% </span>
40
+ <span class="strong">0% </span>
40
41
  <span class="quiet">Functions</span>
41
- <span class='fraction'>4/8</span>
42
+ <span class='fraction'>0/8</span>
42
43
  </div>
43
44
 
44
45
 
45
46
  <div class='fl pad1y space-right2'>
46
- <span class="strong">67.47% </span>
47
+ <span class="strong">0% </span>
47
48
  <span class="quiet">Lines</span>
48
- <span class='fraction'>56/83</span>
49
+ <span class='fraction'>0/83</span>
49
50
  </div>
50
51
 
51
52
 
@@ -54,7 +55,7 @@
54
55
  Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
55
56
  </p>
56
57
  </div>
57
- <div class='status-line medium'></div>
58
+ <div class='status-line low'></div>
58
59
  <pre><table class="coverage">
59
60
  <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
60
61
  <a name='L2'></a><a href='#L2'>2</a>
@@ -190,15 +191,27 @@
190
191
  <a name='L132'></a><a href='#L132'>132</a>
191
192
  <a name='L133'></a><a href='#L133'>133</a>
192
193
  <a name='L134'></a><a href='#L134'>134</a>
193
- <a name='L135'></a><a href='#L135'>135</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">1x</span>
194
- <span class="cline-any cline-yes">1x</span>
195
- <span class="cline-any cline-yes">1x</span>
196
- <span class="cline-any cline-yes">1x</span>
197
- <span class="cline-any cline-yes">1x</span>
198
- <span class="cline-any cline-yes">1x</span>
199
- <span class="cline-any cline-yes">1x</span>
194
+ <a name='L135'></a><a href='#L135'>135</a>
195
+ <a name='L136'></a><a href='#L136'>136</a>
196
+ <a name='L137'></a><a href='#L137'>137</a>
197
+ <a name='L138'></a><a href='#L138'>138</a>
198
+ <a name='L139'></a><a href='#L139'>139</a>
199
+ <a name='L140'></a><a href='#L140'>140</a>
200
+ <a name='L141'></a><a href='#L141'>141</a>
201
+ <a name='L142'></a><a href='#L142'>142</a>
202
+ <a name='L143'></a><a href='#L143'>143</a>
203
+ <a name='L144'></a><a href='#L144'>144</a>
204
+ <a name='L145'></a><a href='#L145'>145</a>
205
+ <a name='L146'></a><a href='#L146'>146</a>
206
+ <a name='L147'></a><a href='#L147'>147</a></td><td class="line-coverage quiet"><span class="cline-any cline-no">&nbsp;</span>
207
+ <span class="cline-any cline-no">&nbsp;</span>
208
+ <span class="cline-any cline-no">&nbsp;</span>
209
+ <span class="cline-any cline-no">&nbsp;</span>
210
+ <span class="cline-any cline-no">&nbsp;</span>
211
+ <span class="cline-any cline-no">&nbsp;</span>
212
+ <span class="cline-any cline-no">&nbsp;</span>
200
213
  <span class="cline-any cline-neutral">&nbsp;</span>
201
- <span class="cline-any cline-yes">1x</span>
214
+ <span class="cline-any cline-no">&nbsp;</span>
202
215
  <span class="cline-any cline-neutral">&nbsp;</span>
203
216
  <span class="cline-any cline-no">&nbsp;</span>
204
217
  <span class="cline-any cline-no">&nbsp;</span>
@@ -206,6 +219,7 @@
206
219
  <span class="cline-any cline-no">&nbsp;</span>
207
220
  <span class="cline-any cline-no">&nbsp;</span>
208
221
  <span class="cline-any cline-no">&nbsp;</span>
222
+ <span class="cline-any cline-neutral">&nbsp;</span>
209
223
  <span class="cline-any cline-no">&nbsp;</span>
210
224
  <span class="cline-any cline-no">&nbsp;</span>
211
225
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -215,85 +229,95 @@
215
229
  <span class="cline-any cline-neutral">&nbsp;</span>
216
230
  <span class="cline-any cline-neutral">&nbsp;</span>
217
231
  <span class="cline-any cline-neutral">&nbsp;</span>
218
- <span class="cline-any cline-yes">6x</span>
232
+ <span class="cline-any cline-no">&nbsp;</span>
219
233
  <span class="cline-any cline-neutral">&nbsp;</span>
220
- <span class="cline-any cline-yes">6x</span>
221
- <span class="cline-any cline-yes">5x</span>
222
- <span class="cline-any cline-yes">5x</span>
234
+ <span class="cline-any cline-no">&nbsp;</span>
235
+ <span class="cline-any cline-no">&nbsp;</span>
236
+ <span class="cline-any cline-no">&nbsp;</span>
223
237
  <span class="cline-any cline-neutral">&nbsp;</span>
224
238
  <span class="cline-any cline-neutral">&nbsp;</span>
225
239
  <span class="cline-any cline-neutral">&nbsp;</span>
226
- <span class="cline-any cline-yes">5x</span>
240
+ <span class="cline-any cline-no">&nbsp;</span>
227
241
  <span class="cline-any cline-neutral">&nbsp;</span>
228
- <span class="cline-any cline-yes">2x</span>
229
- <span class="cline-any cline-yes">2x</span>
242
+ <span class="cline-any cline-no">&nbsp;</span>
243
+ <span class="cline-any cline-no">&nbsp;</span>
230
244
  <span class="cline-any cline-neutral">&nbsp;</span>
231
- <span class="cline-any cline-yes">1x</span>
232
- <span class="cline-any cline-yes">1x</span>
233
- <span class="cline-any cline-yes">1x</span>
234
- <span class="cline-any cline-yes">1x</span>
235
245
  <span class="cline-any cline-neutral">&nbsp;</span>
236
- <span class="cline-any cline-yes">1x</span>
237
- <span class="cline-any cline-yes">1x</span>
238
- <span class="cline-any cline-yes">1x</span>
239
- <span class="cline-any cline-yes">1x</span>
246
+ <span class="cline-any cline-no">&nbsp;</span>
247
+ <span class="cline-any cline-no">&nbsp;</span>
248
+ <span class="cline-any cline-no">&nbsp;</span>
249
+ <span class="cline-any cline-no">&nbsp;</span>
240
250
  <span class="cline-any cline-neutral">&nbsp;</span>
241
- <span class="cline-any cline-yes">1x</span>
242
251
  <span class="cline-any cline-neutral">&nbsp;</span>
252
+ <span class="cline-any cline-no">&nbsp;</span>
253
+ <span class="cline-any cline-no">&nbsp;</span>
254
+ <span class="cline-any cline-no">&nbsp;</span>
255
+ <span class="cline-any cline-no">&nbsp;</span>
243
256
  <span class="cline-any cline-neutral">&nbsp;</span>
244
- <span class="cline-any cline-yes">4x</span>
245
- <span class="cline-any cline-yes">3x</span>
246
257
  <span class="cline-any cline-neutral">&nbsp;</span>
258
+ <span class="cline-any cline-no">&nbsp;</span>
247
259
  <span class="cline-any cline-neutral">&nbsp;</span>
248
- <span class="cline-any cline-yes">1x</span>
249
260
  <span class="cline-any cline-neutral">&nbsp;</span>
250
- <span class="cline-any cline-yes">1x</span>
261
+ <span class="cline-any cline-no">&nbsp;</span>
262
+ <span class="cline-any cline-no">&nbsp;</span>
251
263
  <span class="cline-any cline-neutral">&nbsp;</span>
252
264
  <span class="cline-any cline-neutral">&nbsp;</span>
253
- <span class="cline-any cline-yes">1x</span>
254
- <span class="cline-any cline-yes">1x</span>
255
- <span class="cline-any cline-yes">1x</span>
256
- <span class="cline-any cline-yes">1x</span>
257
- <span class="cline-any cline-yes">1x</span>
258
- <span class="cline-any cline-yes">1x</span>
259
- <span class="cline-any cline-yes">1x</span>
260
- <span class="cline-any cline-yes">1x</span>
265
+ <span class="cline-any cline-no">&nbsp;</span>
261
266
  <span class="cline-any cline-neutral">&nbsp;</span>
262
- <span class="cline-any cline-yes">1x</span>
263
- <span class="cline-any cline-yes">1x</span>
264
267
  <span class="cline-any cline-neutral">&nbsp;</span>
265
- <span class="cline-any cline-yes">1x</span>
266
268
  <span class="cline-any cline-no">&nbsp;</span>
267
269
  <span class="cline-any cline-neutral">&nbsp;</span>
268
- <span class="cline-any cline-yes">1x</span>
270
+ <span class="cline-any cline-neutral">&nbsp;</span>
271
+ <span class="cline-any cline-no">&nbsp;</span>
272
+ <span class="cline-any cline-no">&nbsp;</span>
273
+ <span class="cline-any cline-no">&nbsp;</span>
269
274
  <span class="cline-any cline-no">&nbsp;</span>
270
275
  <span class="cline-any cline-no">&nbsp;</span>
271
276
  <span class="cline-any cline-neutral">&nbsp;</span>
277
+ <span class="cline-any cline-no">&nbsp;</span>
278
+ <span class="cline-any cline-no">&nbsp;</span>
279
+ <span class="cline-any cline-no">&nbsp;</span>
272
280
  <span class="cline-any cline-neutral">&nbsp;</span>
273
281
  <span class="cline-any cline-neutral">&nbsp;</span>
274
- <span class="cline-any cline-yes">2x</span>
275
- <span class="cline-any cline-yes">2x</span>
276
- <span class="cline-any cline-yes">2x</span>
282
+ <span class="cline-any cline-no">&nbsp;</span>
283
+ <span class="cline-any cline-no">&nbsp;</span>
277
284
  <span class="cline-any cline-neutral">&nbsp;</span>
278
- <span class="cline-any cline-yes">2x</span>
279
- <span class="cline-any cline-yes">2x</span>
280
- <span class="cline-any cline-yes">2x</span>
281
- <span class="cline-any cline-yes">2x</span>
282
- <span class="cline-any cline-yes">2x</span>
283
- <span class="cline-any cline-yes">2x</span>
285
+ <span class="cline-any cline-no">&nbsp;</span>
286
+ <span class="cline-any cline-no">&nbsp;</span>
284
287
  <span class="cline-any cline-neutral">&nbsp;</span>
285
288
  <span class="cline-any cline-neutral">&nbsp;</span>
286
- <span class="cline-any cline-yes">2x</span>
289
+ <span class="cline-any cline-no">&nbsp;</span>
290
+ <span class="cline-any cline-no">&nbsp;</span>
291
+ <span class="cline-any cline-no">&nbsp;</span>
287
292
  <span class="cline-any cline-neutral">&nbsp;</span>
288
293
  <span class="cline-any cline-neutral">&nbsp;</span>
289
- <span class="cline-any cline-yes">1x</span>
290
294
  <span class="cline-any cline-neutral">&nbsp;</span>
291
- <span class="cline-any cline-yes">1x</span>
292
- <span class="cline-any cline-yes">1x</span>
293
- <span class="cline-any cline-yes">1x</span>
294
- <span class="cline-any cline-yes">1x</span>
295
+ <span class="cline-any cline-no">&nbsp;</span>
296
+ <span class="cline-any cline-no">&nbsp;</span>
297
+ <span class="cline-any cline-neutral">&nbsp;</span>
298
+ <span class="cline-any cline-no">&nbsp;</span>
295
299
  <span class="cline-any cline-neutral">&nbsp;</span>
296
- <span class="cline-any cline-yes">1x</span>
300
+ <span class="cline-any cline-no">&nbsp;</span>
301
+ <span class="cline-any cline-no">&nbsp;</span>
302
+ <span class="cline-any cline-no">&nbsp;</span>
303
+ <span class="cline-any cline-no">&nbsp;</span>
304
+ <span class="cline-any cline-no">&nbsp;</span>
305
+ <span class="cline-any cline-no">&nbsp;</span>
306
+ <span class="cline-any cline-neutral">&nbsp;</span>
307
+ <span class="cline-any cline-neutral">&nbsp;</span>
308
+ <span class="cline-any cline-no">&nbsp;</span>
309
+ <span class="cline-any cline-neutral">&nbsp;</span>
310
+ <span class="cline-any cline-neutral">&nbsp;</span>
311
+ <span class="cline-any cline-no">&nbsp;</span>
312
+ <span class="cline-any cline-neutral">&nbsp;</span>
313
+ <span class="cline-any cline-no">&nbsp;</span>
314
+ <span class="cline-any cline-no">&nbsp;</span>
315
+ <span class="cline-any cline-neutral">&nbsp;</span>
316
+ <span class="cline-any cline-no">&nbsp;</span>
317
+ <span class="cline-any cline-no">&nbsp;</span>
318
+ <span class="cline-any cline-neutral">&nbsp;</span>
319
+ <span class="cline-any cline-neutral">&nbsp;</span>
320
+ <span class="cline-any cline-no">&nbsp;</span>
297
321
  <span class="cline-any cline-neutral">&nbsp;</span>
298
322
  <span class="cline-any cline-neutral">&nbsp;</span>
299
323
  <span class="cline-any cline-no">&nbsp;</span>
@@ -319,20 +343,21 @@
319
343
  <span class="cline-any cline-no">&nbsp;</span>
320
344
  <span class="cline-any cline-no">&nbsp;</span>
321
345
  <span class="cline-any cline-neutral">&nbsp;</span>
346
+ <span class="cline-any cline-neutral">&nbsp;</span>
322
347
  <span class="cline-any cline-no">&nbsp;</span>
323
348
  <span class="cline-any cline-neutral">&nbsp;</span>
324
349
  <span class="cline-any cline-neutral">&nbsp;</span>
325
350
  <span class="cline-any cline-neutral">&nbsp;</span>
326
351
  <span class="cline-any cline-neutral">&nbsp;</span>
327
- <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">const accordionTriggerClass = 'mds-accordion-trigger';
328
- const accordionTriggerButtonClass = 'mds-accordion-trigger__button';
329
- const accordionTriggerLabelClass = 'mds-accordion-trigger__label';
330
- const accordionTriggerExpandedClass = 'mds-accordion-trigger--expanded';
331
- const accordionContentExpandedClass = 'mds-accordion-content--expanded';
332
- const accordionLabelInverseData = 'data-labelinverse';
333
- const accordionNonClosingClass = 'mds-accordion-trigger--non-closing';
352
+ <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">const accordionTriggerClass = <span class="cstat-no" title="statement not covered" >'mds-accordion-trigger';</span>
353
+ const accordionTriggerButtonClass = <span class="cstat-no" title="statement not covered" >'mds-accordion-trigger__button';</span>
354
+ const accordionTriggerLabelClass = <span class="cstat-no" title="statement not covered" >'mds-accordion-trigger__label';</span>
355
+ const accordionTriggerExpandedClass = <span class="cstat-no" title="statement not covered" >'mds-accordion-trigger--expanded';</span>
356
+ const accordionContentExpandedClass = <span class="cstat-no" title="statement not covered" >'mds-accordion-content--expanded';</span>
357
+ const accordionLabelInverseData = <span class="cstat-no" title="statement not covered" >'data-labelinverse';</span>
358
+ const accordionNonClosingClass = <span class="cstat-no" title="statement not covered" >'mds-accordion-trigger--non-closing';</span>
334
359
  &nbsp;
335
- const accordion = {
360
+ const accordion = <span class="cstat-no" title="statement not covered" >{</span>
336
361
  init: <span class="fstat-no" title="function not covered" >()</span> =&gt; {
337
362
  const accordionTriggerList = <span class="cstat-no" title="statement not covered" >Array.from(document.querySelectorAll(`.${accordionTriggerClass}`));</span>
338
363
  const screenWidth = <span class="cstat-no" title="statement not covered" >window.innerWidth;</span>
@@ -340,6 +365,7 @@ const accordion = {
340
365
  <span class="cstat-no" title="statement not covered" > accordionTriggerList.forEach(<span class="fstat-no" title="function not covered" >(t</span>rigger) =&gt; {</span>
341
366
  const accordionContent = <span class="cstat-no" title="statement not covered" >trigger.nextElementSibling;</span>
342
367
  const isAccordion = <span class="cstat-no" title="statement not covered" >accordion.checkBreakpoint(trigger, screenWidth);</span>
368
+ &nbsp;
343
369
  <span class="cstat-no" title="statement not covered" > if (isAccordion) {</span>
344
370
  <span class="cstat-no" title="statement not covered" > accordion.setAccordion(trigger, accordionContent);</span>
345
371
  } else {
@@ -348,86 +374,96 @@ const accordion = {
348
374
  }
349
375
  });
350
376
  },
351
- checkBreakpoint: (element, screenWidth) =&gt; {
352
- let breakpoint = 0;
377
+ checkBreakpoint: <span class="fstat-no" title="function not covered" >(e</span>lement, screenWidth) =&gt; {
378
+ let breakpoint = <span class="cstat-no" title="statement not covered" >0;</span>
353
379
  &nbsp;
354
- if (element.dataset.bp) {
355
- const breakpointValue = element.dataset.bp.replace(/\D/g, '');
356
- const breakpointUnit = element.dataset.bp.replace(/[0-9]/g, '');
380
+ <span class="cstat-no" title="statement not covered" > if (element.dataset.bp) {</span>
381
+ const breakpointValue = <span class="cstat-no" title="statement not covered" >element.dataset.bp.replace(/\D/g, '');</span>
382
+ const breakpointUnit = <span class="cstat-no" title="statement not covered" >element.dataset.bp.replace(/[0-9]/g, '');</span>
357
383
  let fontSize;
358
384
  let conversionValue;
359
385
  &nbsp;
360
- switch (breakpointUnit) {
386
+ <span class="cstat-no" title="statement not covered" > switch (breakpointUnit) {</span>
361
387
  case 'px':
362
- breakpoint = breakpointValue;
363
- break;
388
+ <span class="cstat-no" title="statement not covered" > breakpoint = breakpointValue;</span>
389
+ <span class="cstat-no" title="statement not covered" > break;</span>
390
+ &nbsp;
364
391
  case 'em':
365
- fontSize = window.getComputedStyle(document.querySelector('body'))['font-size'];
366
- conversionValue = breakpointValue * parseFloat(fontSize);
367
- breakpoint = conversionValue;
368
- break;
392
+ <span class="cstat-no" title="statement not covered" > fontSize = window.getComputedStyle(document.querySelector('body'))['font-size'];</span>
393
+ <span class="cstat-no" title="statement not covered" > conversionValue = breakpointValue * parseFloat(fontSize);</span>
394
+ <span class="cstat-no" title="statement not covered" > breakpoint = conversionValue;</span>
395
+ <span class="cstat-no" title="statement not covered" > break;</span>
396
+ &nbsp;
369
397
  case 'rem':
370
- fontSize = window.getComputedStyle(document.querySelector('body'))['font-size'];
371
- conversionValue = breakpointValue * parseFloat(fontSize);
372
- breakpoint = conversionValue;
373
- break;
398
+ <span class="cstat-no" title="statement not covered" > fontSize = window.getComputedStyle(document.querySelector('body'))['font-size'];</span>
399
+ <span class="cstat-no" title="statement not covered" > conversionValue = breakpointValue * parseFloat(fontSize);</span>
400
+ <span class="cstat-no" title="statement not covered" > breakpoint = conversionValue;</span>
401
+ <span class="cstat-no" title="statement not covered" > break;</span>
402
+ &nbsp;
374
403
  default:
375
- return true;
404
+ <span class="cstat-no" title="statement not covered" > return true;</span>
376
405
  }
377
406
  &nbsp;
378
- if (screenWidth &gt; breakpoint) {
379
- return false;
407
+ <span class="cstat-no" title="statement not covered" > if (screenWidth &gt; breakpoint) {</span>
408
+ <span class="cstat-no" title="statement not covered" > return false;</span>
380
409
  }
381
410
  &nbsp;
382
- return true;
411
+ <span class="cstat-no" title="statement not covered" > return true;</span>
383
412
  }
384
- return true;
413
+ &nbsp;
414
+ <span class="cstat-no" title="statement not covered" > return true;</span>
385
415
  },
386
- setAccordion: (accordionTrigger, accordionContent) =&gt; {
387
- const triggerContainer = accordionTrigger;
388
- const label = triggerContainer.querySelector('.mds-accordion-trigger__label');
389
- const labelText = label.innerText;
390
- const isNonClosing = accordionTrigger.classList.contains(accordionNonClosingClass);
391
- const triggerButton = accordion.createButton(triggerContainer);
392
- triggerContainer.classList.remove('mds-display-none');
393
- <span class="missing-if-branch" title="else path not taken" >E</span>if (accordionContent.nodeName.toLowerCase() !== 'fieldset') {
394
- accordionContent.setAttribute('aria-label', labelText);
416
+ setAccordion: <span class="fstat-no" title="function not covered" >(a</span>ccordionTrigger, accordionContent) =&gt; {
417
+ const triggerContainer = <span class="cstat-no" title="statement not covered" >accordionTrigger;</span>
418
+ const label = <span class="cstat-no" title="statement not covered" >triggerContainer.querySelector('.mds-accordion-trigger__label');</span>
419
+ const labelText = <span class="cstat-no" title="statement not covered" >label.innerText;</span>
420
+ const isNonClosing = <span class="cstat-no" title="statement not covered" >accordionTrigger.classList.contains(accordionNonClosingClass);</span>
421
+ const triggerButton = <span class="cstat-no" title="statement not covered" >accordion.createButton(triggerContainer);</span>
422
+ &nbsp;
423
+ <span class="cstat-no" title="statement not covered" > triggerContainer.classList.remove('mds-display-none');</span>
424
+ <span class="cstat-no" title="statement not covered" > if (accordionContent.nodeName.toLowerCase() !== 'fieldset') {</span>
425
+ <span class="cstat-no" title="statement not covered" > accordionContent.setAttribute('aria-label', labelText);</span>
395
426
  }
396
- triggerContainer.innerHTML = '';
397
- triggerContainer.appendChild(triggerButton);
398
427
  &nbsp;
399
- <span class="missing-if-branch" title="if path not taken" >I</span>if (triggerContainer.dataset.expanded) {
428
+ <span class="cstat-no" title="statement not covered" > triggerContainer.innerHTML = '';</span>
429
+ <span class="cstat-no" title="statement not covered" > triggerContainer.appendChild(triggerButton);</span>
430
+ &nbsp;
431
+ <span class="cstat-no" title="statement not covered" > if (triggerContainer.dataset.expanded) {</span>
400
432
  <span class="cstat-no" title="statement not covered" > accordion.toggleExpand(triggerButton, triggerContainer, accordionContent, isNonClosing);</span>
401
433
  }
402
- triggerButton.addEventListener('click', <span class="fstat-no" title="function not covered" >(e</span>lem) =&gt; {
434
+ &nbsp;
435
+ <span class="cstat-no" title="statement not covered" > triggerButton.addEventListener('click', <span class="fstat-no" title="function not covered" >(e</span>lem) =&gt; {</span>
403
436
  <span class="cstat-no" title="statement not covered" > elem.preventDefault();</span>
404
437
  <span class="cstat-no" title="statement not covered" > accordion.toggleExpand(triggerButton, triggerContainer, accordionContent, isNonClosing);</span>
405
438
  });
406
439
  },
407
- createButton: (element) =&gt; {
408
- const accordionTriggerSpan = element.querySelector(`.${accordionTriggerClass} &gt; span`);
409
- const accordionTriggerButton = document.createElement('button');
410
- accordionTriggerButton.className = accordionTriggerButtonClass;
440
+ createButton: <span class="fstat-no" title="function not covered" >(e</span>lement) =&gt; {
441
+ const accordionTriggerSpan = <span class="cstat-no" title="statement not covered" >element.querySelector(`.${accordionTriggerClass} &gt; span`);</span>
442
+ const accordionTriggerButton = <span class="cstat-no" title="statement not covered" >document.createElement('button');</span>
443
+ &nbsp;
444
+ <span class="cstat-no" title="statement not covered" > accordionTriggerButton.className = accordionTriggerButtonClass;</span>
411
445
  // can't use multiple arguments in classList.add() due to IE
412
- accordionTriggerButton.classList.add('mds-button');
413
- accordionTriggerButton.classList.add('mds-button--plain');
414
- accordionTriggerButton.classList.add('mds-padding-b0');
415
- accordionTriggerButton.setAttribute('aria-expanded', false);
416
- <span class="missing-if-branch" title="else path not taken" >E</span>if (accordionTriggerSpan) {
417
- accordionTriggerButton.appendChild(accordionTriggerSpan);
446
+ <span class="cstat-no" title="statement not covered" > accordionTriggerButton.classList.add('mds-button');</span>
447
+ <span class="cstat-no" title="statement not covered" > accordionTriggerButton.classList.add('mds-button--plain');</span>
448
+ <span class="cstat-no" title="statement not covered" > accordionTriggerButton.classList.add('mds-padding-b0');</span>
449
+ <span class="cstat-no" title="statement not covered" > accordionTriggerButton.setAttribute('aria-expanded', false);</span>
450
+ <span class="cstat-no" title="statement not covered" > if (accordionTriggerSpan) {</span>
451
+ <span class="cstat-no" title="statement not covered" > accordionTriggerButton.appendChild(accordionTriggerSpan);</span>
418
452
  }
419
453
  &nbsp;
420
- return accordionTriggerButton;
454
+ <span class="cstat-no" title="statement not covered" > return accordionTriggerButton;</span>
421
455
  },
422
- switchLabel: (e) =&gt; {
423
- const element = e;
456
+ switchLabel: <span class="fstat-no" title="function not covered" >(e</span>) =&gt; {
457
+ const element = <span class="cstat-no" title="statement not covered" >e;</span>
458
+ &nbsp;
459
+ <span class="cstat-no" title="statement not covered" > if (element.dataset.labelinverse) {</span>
460
+ const labelToInverse = <span class="cstat-no" title="statement not covered" >element.textContent;</span>
424
461
  &nbsp;
425
- <span class="missing-if-branch" title="else path not taken" >E</span>if (element.dataset.labelinverse) {
426
- const labelToInverse = element.textContent;
427
- element.textContent = element.dataset.labelinverse;
428
- element.setAttribute(accordionLabelInverseData, labelToInverse);
462
+ <span class="cstat-no" title="statement not covered" > element.textContent = element.dataset.labelinverse;</span>
463
+ <span class="cstat-no" title="statement not covered" > element.setAttribute(accordionLabelInverseData, labelToInverse);</span>
429
464
  }
430
- return element;
465
+ &nbsp;
466
+ <span class="cstat-no" title="statement not covered" > return element;</span>
431
467
  },
432
468
  toggleExpand: <span class="fstat-no" title="function not covered" >(t</span>riggerButton, triggerContainer, accordionContent, isNonClosing) =&gt; {
433
469
  const accordionTriggerButton = <span class="cstat-no" title="statement not covered" >triggerButton;</span>
@@ -453,6 +489,7 @@ const accordion = {
453
489
  <span class="cstat-no" title="statement not covered" > triggerContainer.classList.remove(accordionTriggerExpandedClass);</span>
454
490
  <span class="cstat-no" title="statement not covered" > accordionContent.classList.remove(accordionContentExpandedClass);</span>
455
491
  }
492
+ &nbsp;
456
493
  <span class="cstat-no" title="statement not covered" > accordion.switchLabel(accordionTriggerButtonLabel);</span>
457
494
  },
458
495
  };
@@ -465,7 +502,7 @@ export default accordion;
465
502
  <div class='footer quiet pad2 space-top1 center small'>
466
503
  Code coverage generated by
467
504
  <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
468
- at Wed Jul 07 2021 12:25:30 GMT+0100 (British Summer Time)
505
+ at Thu Jul 08 2021 15:47:09 GMT+0100 (British Summer Time)
469
506
  </div>
470
507
  </div>
471
508
  <script src="../../prettify.js"></script>
@@ -7,7 +7,8 @@
7
7
  <meta charset="utf-8" />
8
8
  <link rel="stylesheet" href="../../prettify.css" />
9
9
  <link rel="stylesheet" href="../../base.css" />
10
- <meta name="viewport" content="width=device-width, initial-scale=1">
10
+ <link rel="shortcut icon" type="image/x-icon" href="../../favicon.png" />
11
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
11
12
  <style type='text/css'>
12
13
  .coverage-summary .sorter {
13
14
  background-image: url(../../sort-arrow-sprite.png);
@@ -22,30 +23,30 @@
22
23
  <div class='clearfix'>
23
24
 
24
25
  <div class='fl pad1y space-right2'>
25
- <span class="strong">67.47% </span>
26
+ <span class="strong">0% </span>
26
27
  <span class="quiet">Statements</span>
27
- <span class='fraction'>56/83</span>
28
+ <span class='fraction'>0/83</span>
28
29
  </div>
29
30
 
30
31
 
31
32
  <div class='fl pad1y space-right2'>
32
- <span class="strong">50% </span>
33
+ <span class="strong">0% </span>
33
34
  <span class="quiet">Branches</span>
34
- <span class='fraction'>12/24</span>
35
+ <span class='fraction'>0/24</span>
35
36
  </div>
36
37
 
37
38
 
38
39
  <div class='fl pad1y space-right2'>
39
- <span class="strong">50% </span>
40
+ <span class="strong">0% </span>
40
41
  <span class="quiet">Functions</span>
41
- <span class='fraction'>4/8</span>
42
+ <span class='fraction'>0/8</span>
42
43
  </div>
43
44
 
44
45
 
45
46
  <div class='fl pad1y space-right2'>
46
- <span class="strong">67.47% </span>
47
+ <span class="strong">0% </span>
47
48
  <span class="quiet">Lines</span>
48
- <span class='fraction'>56/83</span>
49
+ <span class='fraction'>0/83</span>
49
50
  </div>
50
51
 
51
52
 
@@ -54,7 +55,7 @@
54
55
  Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
55
56
  </p>
56
57
  </div>
57
- <div class='status-line medium'></div>
58
+ <div class='status-line low'></div>
58
59
  <div class="pad1">
59
60
  <table class="coverage-summary">
60
61
  <thead>
@@ -72,18 +73,18 @@
72
73
  </tr>
73
74
  </thead>
74
75
  <tbody><tr>
75
- <td class="file medium" data-value="accordion.js"><a href="accordion.js.html">accordion.js</a></td>
76
- <td data-value="67.47" class="pic medium">
77
- <div class="chart"><div class="cover-fill" style="width: 67%"></div><div class="cover-empty" style="width: 33%"></div></div>
76
+ <td class="file low" data-value="accordion.js"><a href="accordion.js.html">accordion.js</a></td>
77
+ <td data-value="0" class="pic low">
78
+ <div class="chart"><div class="cover-fill" style="width: 0%"></div><div class="cover-empty" style="width: 100%"></div></div>
78
79
  </td>
79
- <td data-value="67.47" class="pct medium">67.47%</td>
80
- <td data-value="83" class="abs medium">56/83</td>
81
- <td data-value="50" class="pct medium">50%</td>
82
- <td data-value="24" class="abs medium">12/24</td>
83
- <td data-value="50" class="pct medium">50%</td>
84
- <td data-value="8" class="abs medium">4/8</td>
85
- <td data-value="67.47" class="pct medium">67.47%</td>
86
- <td data-value="83" class="abs medium">56/83</td>
80
+ <td data-value="0" class="pct low">0%</td>
81
+ <td data-value="83" class="abs low">0/83</td>
82
+ <td data-value="0" class="pct low">0%</td>
83
+ <td data-value="24" class="abs low">0/24</td>
84
+ <td data-value="0" class="pct low">0%</td>
85
+ <td data-value="8" class="abs low">0/8</td>
86
+ <td data-value="0" class="pct low">0%</td>
87
+ <td data-value="83" class="abs low">0/83</td>
87
88
  </tr>
88
89
 
89
90
  </tbody>
@@ -94,7 +95,7 @@
94
95
  <div class='footer quiet pad2 space-top1 center small'>
95
96
  Code coverage generated by
96
97
  <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
97
- at Wed Jul 07 2021 12:25:30 GMT+0100 (British Summer Time)
98
+ at Thu Jul 08 2021 15:47:09 GMT+0100 (British Summer Time)
98
99
  </div>
99
100
  </div>
100
101
  <script src="../../prettify.js"></script>
@@ -7,7 +7,8 @@
7
7
  <meta charset="utf-8" />
8
8
  <link rel="stylesheet" href="../../prettify.css" />
9
9
  <link rel="stylesheet" href="../../base.css" />
10
- <meta name="viewport" content="width=device-width, initial-scale=1">
10
+ <link rel="shortcut icon" type="image/x-icon" href="../../favicon.png" />
11
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
11
12
  <style type='text/css'>
12
13
  .coverage-summary .sorter {
13
14
  background-image: url(../../sort-arrow-sprite.png);
@@ -150,7 +151,7 @@ export default button;
150
151
  <div class='footer quiet pad2 space-top1 center small'>
151
152
  Code coverage generated by
152
153
  <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
153
- at Wed Jul 07 2021 12:25:30 GMT+0100 (British Summer Time)
154
+ at Thu Jul 08 2021 15:47:09 GMT+0100 (British Summer Time)
154
155
  </div>
155
156
  </div>
156
157
  <script src="../../prettify.js"></script>
@@ -7,7 +7,8 @@
7
7
  <meta charset="utf-8" />
8
8
  <link rel="stylesheet" href="../../prettify.css" />
9
9
  <link rel="stylesheet" href="../../base.css" />
10
- <meta name="viewport" content="width=device-width, initial-scale=1">
10
+ <link rel="shortcut icon" type="image/x-icon" href="../../favicon.png" />
11
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
11
12
  <style type='text/css'>
12
13
  .coverage-summary .sorter {
13
14
  background-image: url(../../sort-arrow-sprite.png);
@@ -94,7 +95,7 @@
94
95
  <div class='footer quiet pad2 space-top1 center small'>
95
96
  Code coverage generated by
96
97
  <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
97
- at Wed Jul 07 2021 12:25:30 GMT+0100 (British Summer Time)
98
+ at Thu Jul 08 2021 15:47:09 GMT+0100 (British Summer Time)
98
99
  </div>
99
100
  </div>
100
101
  <script src="../../prettify.js"></script>
@@ -7,7 +7,8 @@
7
7
  <meta charset="utf-8" />
8
8
  <link rel="stylesheet" href="../../../prettify.css" />
9
9
  <link rel="stylesheet" href="../../../base.css" />
10
- <meta name="viewport" content="width=device-width, initial-scale=1">
10
+ <link rel="shortcut icon" type="image/x-icon" href="../../../favicon.png" />
11
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
11
12
  <style type='text/css'>
12
13
  .coverage-summary .sorter {
13
14
  background-image: url(../../../sort-arrow-sprite.png);
@@ -111,7 +112,7 @@ export default {
111
112
  <div class='footer quiet pad2 space-top1 center small'>
112
113
  Code coverage generated by
113
114
  <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
114
- at Wed Jul 07 2021 12:25:30 GMT+0100 (British Summer Time)
115
+ at Thu Jul 08 2021 15:47:09 GMT+0100 (British Summer Time)
115
116
  </div>
116
117
  </div>
117
118
  <script src="../../../prettify.js"></script>