@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.
- package/.eslintignore +2 -0
- package/.eslintrc.js +3 -3
- package/__tests__/.eslintrc.js +3 -3
- package/__tests__/unit/src/components/combobox.spec.js +4 -28
- package/__tests__/unit/src/components/notification.spec.js +14 -12
- package/__tests__/unit/src/components/popover.spec.js +4 -0
- package/__tests__/unit/tasks/css.spec.js +3 -2
- package/__tests__/unit/tasks/jsbundle.spec.js +3 -2
- package/__tests__/unit/tasks/svgsprite.spec.js +3 -2
- package/__tests__/unit/tasks/tokens.spec.js +3 -2
- package/coverage/cobertura-coverage.xml +389 -389
- package/coverage/components/accordion/accordion.js.html +164 -127
- package/coverage/components/accordion/index.html +23 -22
- package/coverage/components/button/button.js.html +3 -2
- package/coverage/components/button/index.html +3 -2
- package/coverage/components/inputs/combobox/combobox.js.html +3 -2
- package/coverage/components/inputs/combobox/index.html +3 -2
- package/coverage/components/inputs/combobox/vue-components/Combobox.vue.html +55 -54
- package/coverage/components/inputs/combobox/vue-components/ListBoxOption.vue.html +9 -8
- package/coverage/components/inputs/combobox/vue-components/index.html +21 -20
- package/coverage/components/inputs/file-upload/file-upload.js.html +7 -3
- package/coverage/components/inputs/file-upload/index.html +3 -2
- package/coverage/components/inputs/textarea/character-count.js.html +13 -3
- package/coverage/components/inputs/textarea/index.html +3 -2
- package/coverage/components/modal/index.html +23 -22
- package/coverage/components/modal/modal.js.html +118 -111
- package/coverage/components/notification/index.html +3 -2
- package/coverage/components/notification/notification.js.html +13 -3
- package/coverage/components/popover/index.html +3 -2
- package/coverage/components/popover/popover.js.html +3 -2
- package/coverage/components/switch-state/index.html +19 -18
- package/coverage/components/switch-state/switch-state.js.html +22 -21
- package/coverage/components/tabs/index.html +3 -2
- package/coverage/components/tabs/tabs.js.html +37 -3
- package/coverage/favicon.png +0 -0
- package/coverage/index.html +52 -51
- package/coverage/js/common.js.html +3 -2
- package/coverage/js/fractal-scripts/combobox.js.html +22 -3
- package/coverage/js/fractal-scripts/index.html +3 -2
- package/coverage/js/fractal-scripts/notification.js.html +13 -3
- package/coverage/js/fractal-scripts/switch-state.js.html +13 -3
- package/coverage/js/index-fractal.js.html +3 -2
- package/coverage/js/index-polyfills.js.html +3 -2
- package/coverage/js/index-vue.js.html +3 -2
- package/coverage/js/index.html +3 -2
- package/coverage/js/index.js.html +3 -2
- package/coverage/js/polyfills/arrayPrototypeFind.js.html +20 -10
- package/coverage/js/polyfills/closest.js.html +8 -4
- package/coverage/js/polyfills/index.html +3 -2
- package/coverage/js/polyfills/objectAssign.js.html +19 -9
- package/coverage/js/polyfills/remove.js.html +3 -2
- package/coverage/tokens/_config.js.html +3 -2
- package/coverage/tokens/index.html +3 -2
- package/cypress/.eslintrc.js +6 -6
- package/cypress/fixtures/testuploadfile.txt +1 -0
- package/cypress/integration/components/accordion.spec.js +40 -3
- package/cypress/integration/components/button.spec.js +2 -3
- package/cypress/integration/components/card.spec.js +2 -3
- package/cypress/integration/components/icons.spec.js +10 -0
- package/cypress/integration/components/{combobox.spec.js → inputs/combobox.spec.js} +6 -0
- package/cypress/integration/components/inputs/file-upload.spec.js +45 -0
- package/cypress/integration/components/{input.spec.js → inputs/input.spec.js} +1 -1
- package/cypress/integration/components/inputs/label.spec.js +15 -0
- package/cypress/integration/components/inputs/radio.spec.js +20 -0
- package/cypress/integration/components/inputs/select.spec.js +31 -0
- package/cypress/integration/components/inputs/textarea.spec.js +23 -0
- package/cypress/integration/components/modal.spec.js +65 -0
- package/cypress/integration/components/notifications.spec.js +35 -0
- package/cypress/integration/components/popover.spec.js +36 -0
- package/cypress/integration/components/skip-link.spec.js +9 -0
- package/cypress/plugins/index.js +1 -1
- package/cypress/support/commands.js +14 -0
- package/cypress/support/index.js +2 -0
- package/dist/_tokens/css/_tokens.css +1 -1
- package/dist/_tokens/js/_tokens-module.js +455 -1
- package/dist/_tokens/scss/_tokens.scss +4 -4
- package/dist/assets/icons.json +1 -1
- package/dist/assets/icons.svg +6 -1
- package/dist/js/index.js +1 -1
- package/fractal.js +2 -0
- package/package.json +59 -54
- package/server.js +1 -1
- package/src/components/accordion/accordion.config.js +9 -12
- package/src/components/accordion/accordion.js +12 -0
- package/src/components/inputs/file-upload/file-upload.js +1 -0
- package/src/components/inputs/textarea/character-count.js +3 -0
- package/src/components/modal/modal.js +3 -1
- package/src/components/notification/notification.js +3 -0
- package/src/components/skip-link/skip-link.njk +11 -1
- package/src/components/tabs/tabs.js +11 -0
- package/src/js/fractal-scripts/combobox.js +6 -0
- package/src/js/fractal-scripts/notification.js +3 -0
- package/src/js/fractal-scripts/switch-state.js +3 -0
- package/src/js/polyfills/arrayPrototypeFind.js +9 -6
- package/src/js/polyfills/closest.js +2 -1
- package/src/js/polyfills/objectAssign.js +9 -6
- package/tasks/colorTransforms.js +4 -0
- package/tasks/createMacroIndex.js +1 -0
- package/tasks/css.js +3 -0
- package/tasks/fractal.js +2 -0
- package/tasks/js-bundle.js +6 -2
- package/tasks/svgsprite.js +31 -21
- package/tasks/tokens.js +2 -0
- package/__tests__/unit/src/components/accordion.spec.js +0 -88
- package/__tests__/unit/src/components/modal.spec.js +0 -87
- package/__tests__/unit/src/components/switch-state.spec.js +0 -21
- package/cypress/integration/components/textarea.spec.js +0 -9
- /package/cypress/integration/components/{checkbox-list.spec.js → inputs/checkbox-list.spec.js} +0 -0
- /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
|
-
<
|
|
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">
|
|
26
|
+
<span class="strong">0% </span>
|
|
26
27
|
<span class="quiet">Statements</span>
|
|
27
|
-
<span class='fraction'>
|
|
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">
|
|
33
|
+
<span class="strong">0% </span>
|
|
33
34
|
<span class="quiet">Branches</span>
|
|
34
|
-
<span class='fraction'>
|
|
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">
|
|
40
|
+
<span class="strong">0% </span>
|
|
40
41
|
<span class="quiet">Functions</span>
|
|
41
|
-
<span class='fraction'>
|
|
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">
|
|
47
|
+
<span class="strong">0% </span>
|
|
47
48
|
<span class="quiet">Lines</span>
|
|
48
|
-
<span class='fraction'>
|
|
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
|
|
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
|
|
194
|
-
<
|
|
195
|
-
<
|
|
196
|
-
<
|
|
197
|
-
<
|
|
198
|
-
<
|
|
199
|
-
<
|
|
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"> </span>
|
|
207
|
+
<span class="cline-any cline-no"> </span>
|
|
208
|
+
<span class="cline-any cline-no"> </span>
|
|
209
|
+
<span class="cline-any cline-no"> </span>
|
|
210
|
+
<span class="cline-any cline-no"> </span>
|
|
211
|
+
<span class="cline-any cline-no"> </span>
|
|
212
|
+
<span class="cline-any cline-no"> </span>
|
|
200
213
|
<span class="cline-any cline-neutral"> </span>
|
|
201
|
-
<span class="cline-any cline-
|
|
214
|
+
<span class="cline-any cline-no"> </span>
|
|
202
215
|
<span class="cline-any cline-neutral"> </span>
|
|
203
216
|
<span class="cline-any cline-no"> </span>
|
|
204
217
|
<span class="cline-any cline-no"> </span>
|
|
@@ -206,6 +219,7 @@
|
|
|
206
219
|
<span class="cline-any cline-no"> </span>
|
|
207
220
|
<span class="cline-any cline-no"> </span>
|
|
208
221
|
<span class="cline-any cline-no"> </span>
|
|
222
|
+
<span class="cline-any cline-neutral"> </span>
|
|
209
223
|
<span class="cline-any cline-no"> </span>
|
|
210
224
|
<span class="cline-any cline-no"> </span>
|
|
211
225
|
<span class="cline-any cline-neutral"> </span>
|
|
@@ -215,85 +229,95 @@
|
|
|
215
229
|
<span class="cline-any cline-neutral"> </span>
|
|
216
230
|
<span class="cline-any cline-neutral"> </span>
|
|
217
231
|
<span class="cline-any cline-neutral"> </span>
|
|
218
|
-
<span class="cline-any cline-
|
|
232
|
+
<span class="cline-any cline-no"> </span>
|
|
219
233
|
<span class="cline-any cline-neutral"> </span>
|
|
220
|
-
<span class="cline-any cline-
|
|
221
|
-
<span class="cline-any cline-
|
|
222
|
-
<span class="cline-any cline-
|
|
234
|
+
<span class="cline-any cline-no"> </span>
|
|
235
|
+
<span class="cline-any cline-no"> </span>
|
|
236
|
+
<span class="cline-any cline-no"> </span>
|
|
223
237
|
<span class="cline-any cline-neutral"> </span>
|
|
224
238
|
<span class="cline-any cline-neutral"> </span>
|
|
225
239
|
<span class="cline-any cline-neutral"> </span>
|
|
226
|
-
<span class="cline-any cline-
|
|
240
|
+
<span class="cline-any cline-no"> </span>
|
|
227
241
|
<span class="cline-any cline-neutral"> </span>
|
|
228
|
-
<span class="cline-any cline-
|
|
229
|
-
<span class="cline-any cline-
|
|
242
|
+
<span class="cline-any cline-no"> </span>
|
|
243
|
+
<span class="cline-any cline-no"> </span>
|
|
230
244
|
<span class="cline-any cline-neutral"> </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"> </span>
|
|
236
|
-
<span class="cline-any cline-
|
|
237
|
-
<span class="cline-any cline-
|
|
238
|
-
<span class="cline-any cline-
|
|
239
|
-
<span class="cline-any cline-
|
|
246
|
+
<span class="cline-any cline-no"> </span>
|
|
247
|
+
<span class="cline-any cline-no"> </span>
|
|
248
|
+
<span class="cline-any cline-no"> </span>
|
|
249
|
+
<span class="cline-any cline-no"> </span>
|
|
240
250
|
<span class="cline-any cline-neutral"> </span>
|
|
241
|
-
<span class="cline-any cline-yes">1x</span>
|
|
242
251
|
<span class="cline-any cline-neutral"> </span>
|
|
252
|
+
<span class="cline-any cline-no"> </span>
|
|
253
|
+
<span class="cline-any cline-no"> </span>
|
|
254
|
+
<span class="cline-any cline-no"> </span>
|
|
255
|
+
<span class="cline-any cline-no"> </span>
|
|
243
256
|
<span class="cline-any cline-neutral"> </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"> </span>
|
|
258
|
+
<span class="cline-any cline-no"> </span>
|
|
247
259
|
<span class="cline-any cline-neutral"> </span>
|
|
248
|
-
<span class="cline-any cline-yes">1x</span>
|
|
249
260
|
<span class="cline-any cline-neutral"> </span>
|
|
250
|
-
<span class="cline-any cline-
|
|
261
|
+
<span class="cline-any cline-no"> </span>
|
|
262
|
+
<span class="cline-any cline-no"> </span>
|
|
251
263
|
<span class="cline-any cline-neutral"> </span>
|
|
252
264
|
<span class="cline-any cline-neutral"> </span>
|
|
253
|
-
<span class="cline-any cline-
|
|
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"> </span>
|
|
261
266
|
<span class="cline-any cline-neutral"> </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"> </span>
|
|
265
|
-
<span class="cline-any cline-yes">1x</span>
|
|
266
268
|
<span class="cline-any cline-no"> </span>
|
|
267
269
|
<span class="cline-any cline-neutral"> </span>
|
|
268
|
-
<span class="cline-any cline-
|
|
270
|
+
<span class="cline-any cline-neutral"> </span>
|
|
271
|
+
<span class="cline-any cline-no"> </span>
|
|
272
|
+
<span class="cline-any cline-no"> </span>
|
|
273
|
+
<span class="cline-any cline-no"> </span>
|
|
269
274
|
<span class="cline-any cline-no"> </span>
|
|
270
275
|
<span class="cline-any cline-no"> </span>
|
|
271
276
|
<span class="cline-any cline-neutral"> </span>
|
|
277
|
+
<span class="cline-any cline-no"> </span>
|
|
278
|
+
<span class="cline-any cline-no"> </span>
|
|
279
|
+
<span class="cline-any cline-no"> </span>
|
|
272
280
|
<span class="cline-any cline-neutral"> </span>
|
|
273
281
|
<span class="cline-any cline-neutral"> </span>
|
|
274
|
-
<span class="cline-any cline-
|
|
275
|
-
<span class="cline-any cline-
|
|
276
|
-
<span class="cline-any cline-yes">2x</span>
|
|
282
|
+
<span class="cline-any cline-no"> </span>
|
|
283
|
+
<span class="cline-any cline-no"> </span>
|
|
277
284
|
<span class="cline-any cline-neutral"> </span>
|
|
278
|
-
<span class="cline-any cline-
|
|
279
|
-
<span class="cline-any cline-
|
|
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"> </span>
|
|
286
|
+
<span class="cline-any cline-no"> </span>
|
|
284
287
|
<span class="cline-any cline-neutral"> </span>
|
|
285
288
|
<span class="cline-any cline-neutral"> </span>
|
|
286
|
-
<span class="cline-any cline-
|
|
289
|
+
<span class="cline-any cline-no"> </span>
|
|
290
|
+
<span class="cline-any cline-no"> </span>
|
|
291
|
+
<span class="cline-any cline-no"> </span>
|
|
287
292
|
<span class="cline-any cline-neutral"> </span>
|
|
288
293
|
<span class="cline-any cline-neutral"> </span>
|
|
289
|
-
<span class="cline-any cline-yes">1x</span>
|
|
290
294
|
<span class="cline-any cline-neutral"> </span>
|
|
291
|
-
<span class="cline-any cline-
|
|
292
|
-
<span class="cline-any cline-
|
|
293
|
-
<span class="cline-any cline-
|
|
294
|
-
<span class="cline-any cline-
|
|
295
|
+
<span class="cline-any cline-no"> </span>
|
|
296
|
+
<span class="cline-any cline-no"> </span>
|
|
297
|
+
<span class="cline-any cline-neutral"> </span>
|
|
298
|
+
<span class="cline-any cline-no"> </span>
|
|
295
299
|
<span class="cline-any cline-neutral"> </span>
|
|
296
|
-
<span class="cline-any cline-
|
|
300
|
+
<span class="cline-any cline-no"> </span>
|
|
301
|
+
<span class="cline-any cline-no"> </span>
|
|
302
|
+
<span class="cline-any cline-no"> </span>
|
|
303
|
+
<span class="cline-any cline-no"> </span>
|
|
304
|
+
<span class="cline-any cline-no"> </span>
|
|
305
|
+
<span class="cline-any cline-no"> </span>
|
|
306
|
+
<span class="cline-any cline-neutral"> </span>
|
|
307
|
+
<span class="cline-any cline-neutral"> </span>
|
|
308
|
+
<span class="cline-any cline-no"> </span>
|
|
309
|
+
<span class="cline-any cline-neutral"> </span>
|
|
310
|
+
<span class="cline-any cline-neutral"> </span>
|
|
311
|
+
<span class="cline-any cline-no"> </span>
|
|
312
|
+
<span class="cline-any cline-neutral"> </span>
|
|
313
|
+
<span class="cline-any cline-no"> </span>
|
|
314
|
+
<span class="cline-any cline-no"> </span>
|
|
315
|
+
<span class="cline-any cline-neutral"> </span>
|
|
316
|
+
<span class="cline-any cline-no"> </span>
|
|
317
|
+
<span class="cline-any cline-no"> </span>
|
|
318
|
+
<span class="cline-any cline-neutral"> </span>
|
|
319
|
+
<span class="cline-any cline-neutral"> </span>
|
|
320
|
+
<span class="cline-any cline-no"> </span>
|
|
297
321
|
<span class="cline-any cline-neutral"> </span>
|
|
298
322
|
<span class="cline-any cline-neutral"> </span>
|
|
299
323
|
<span class="cline-any cline-no"> </span>
|
|
@@ -319,20 +343,21 @@
|
|
|
319
343
|
<span class="cline-any cline-no"> </span>
|
|
320
344
|
<span class="cline-any cline-no"> </span>
|
|
321
345
|
<span class="cline-any cline-neutral"> </span>
|
|
346
|
+
<span class="cline-any cline-neutral"> </span>
|
|
322
347
|
<span class="cline-any cline-no"> </span>
|
|
323
348
|
<span class="cline-any cline-neutral"> </span>
|
|
324
349
|
<span class="cline-any cline-neutral"> </span>
|
|
325
350
|
<span class="cline-any cline-neutral"> </span>
|
|
326
351
|
<span class="cline-any cline-neutral"> </span>
|
|
327
|
-
<span class="cline-any cline-neutral"> </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"> </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
|
|
|
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> => {
|
|
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) => {</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
|
+
|
|
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: (
|
|
352
|
-
let breakpoint = 0
|
|
377
|
+
checkBreakpoint: <span class="fstat-no" title="function not covered" >(e</span>lement, screenWidth) => {
|
|
378
|
+
let breakpoint = <span class="cstat-no" title="statement not covered" >0;</span>
|
|
353
379
|
|
|
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
|
|
|
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
|
+
|
|
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
|
+
|
|
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
|
+
|
|
374
403
|
default:
|
|
375
|
-
return true
|
|
404
|
+
<span class="cstat-no" title="statement not covered" > return true;</span>
|
|
376
405
|
}
|
|
377
406
|
|
|
378
|
-
if (screenWidth > breakpoint) {
|
|
379
|
-
return false
|
|
407
|
+
<span class="cstat-no" title="statement not covered" > if (screenWidth > breakpoint) {</span>
|
|
408
|
+
<span class="cstat-no" title="statement not covered" > return false;</span>
|
|
380
409
|
}
|
|
381
410
|
|
|
382
|
-
return true
|
|
411
|
+
<span class="cstat-no" title="statement not covered" > return true;</span>
|
|
383
412
|
}
|
|
384
|
-
|
|
413
|
+
|
|
414
|
+
<span class="cstat-no" title="statement not covered" > return true;</span>
|
|
385
415
|
},
|
|
386
|
-
setAccordion: (
|
|
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
|
-
|
|
393
|
-
|
|
394
|
-
|
|
416
|
+
setAccordion: <span class="fstat-no" title="function not covered" >(a</span>ccordionTrigger, accordionContent) => {
|
|
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
|
+
|
|
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
|
|
|
399
|
-
|
|
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
|
+
|
|
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
|
-
|
|
434
|
+
|
|
435
|
+
<span class="cstat-no" title="statement not covered" > triggerButton.addEventListener('click', <span class="fstat-no" title="function not covered" >(e</span>lem) => {</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: (
|
|
408
|
-
const accordionTriggerSpan = element.querySelector(`.${accordionTriggerClass} > span`)
|
|
409
|
-
const accordionTriggerButton = document.createElement('button')
|
|
410
|
-
|
|
440
|
+
createButton: <span class="fstat-no" title="function not covered" >(e</span>lement) => {
|
|
441
|
+
const accordionTriggerSpan = <span class="cstat-no" title="statement not covered" >element.querySelector(`.${accordionTriggerClass} > span`);</span>
|
|
442
|
+
const accordionTriggerButton = <span class="cstat-no" title="statement not covered" >document.createElement('button');</span>
|
|
443
|
+
|
|
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
|
-
|
|
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
|
|
|
420
|
-
return accordionTriggerButton
|
|
454
|
+
<span class="cstat-no" title="statement not covered" > return accordionTriggerButton;</span>
|
|
421
455
|
},
|
|
422
|
-
switchLabel: (e) => {
|
|
423
|
-
const element = e
|
|
456
|
+
switchLabel: <span class="fstat-no" title="function not covered" >(e</span>) => {
|
|
457
|
+
const element = <span class="cstat-no" title="statement not covered" >e;</span>
|
|
458
|
+
|
|
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
|
|
|
425
|
-
|
|
426
|
-
|
|
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
|
-
|
|
465
|
+
|
|
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) => {
|
|
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
|
+
|
|
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
|
|
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
|
-
<
|
|
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">
|
|
26
|
+
<span class="strong">0% </span>
|
|
26
27
|
<span class="quiet">Statements</span>
|
|
27
|
-
<span class='fraction'>
|
|
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">
|
|
33
|
+
<span class="strong">0% </span>
|
|
33
34
|
<span class="quiet">Branches</span>
|
|
34
|
-
<span class='fraction'>
|
|
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">
|
|
40
|
+
<span class="strong">0% </span>
|
|
40
41
|
<span class="quiet">Functions</span>
|
|
41
|
-
<span class='fraction'>
|
|
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">
|
|
47
|
+
<span class="strong">0% </span>
|
|
47
48
|
<span class="quiet">Lines</span>
|
|
48
|
-
<span class='fraction'>
|
|
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
|
|
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
|
|
76
|
-
<td data-value="
|
|
77
|
-
<div class="chart"><div class="cover-fill" style="width:
|
|
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="
|
|
80
|
-
<td data-value="83" class="abs
|
|
81
|
-
<td data-value="
|
|
82
|
-
<td data-value="24" class="abs
|
|
83
|
-
<td data-value="
|
|
84
|
-
<td data-value="8" class="abs
|
|
85
|
-
<td data-value="
|
|
86
|
-
<td data-value="83" class="abs
|
|
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
|
|
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
|
-
<
|
|
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
|
|
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
|
-
<
|
|
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
|
|
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
|
-
<
|
|
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
|
|
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>
|