@madgex/design-system 1.60.7 → 1.60.9

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 (85) hide show
  1. package/__tests__/unit/src/components/accordion.spec.js +16 -12
  2. package/coverage/cobertura-coverage.xml +58 -173
  3. package/coverage/components/accordion/accordion.js.html +63 -42
  4. package/coverage/components/accordion/index.html +15 -15
  5. package/coverage/components/inputs/combobox/combobox.js.html +1 -1
  6. package/coverage/components/inputs/combobox/index.html +1 -1
  7. package/coverage/components/inputs/combobox/vue-components/Combobox.vue.html +1 -1
  8. package/coverage/components/inputs/combobox/vue-components/ListBoxOption.vue.html +1 -1
  9. package/coverage/components/inputs/combobox/vue-components/index.html +1 -1
  10. package/coverage/components/inputs/file-upload/file-upload.js.html +1 -1
  11. package/coverage/components/inputs/file-upload/index.html +1 -1
  12. package/coverage/components/inputs/textarea/character-count.js.html +1 -1
  13. package/coverage/components/inputs/textarea/index.html +1 -1
  14. package/coverage/components/modal/index.html +1 -1
  15. package/coverage/components/modal/modal.js.html +1 -1
  16. package/coverage/components/notification/index.html +1 -1
  17. package/coverage/components/notification/notification.js.html +1 -1
  18. package/coverage/components/popover/index.html +1 -1
  19. package/coverage/components/popover/popover.js.html +1 -1
  20. package/coverage/components/switch-state/index.html +1 -1
  21. package/coverage/components/switch-state/switch-state.js.html +1 -1
  22. package/coverage/components/tabs/index.html +1 -1
  23. package/coverage/components/tabs/tabs.js.html +1 -1
  24. package/coverage/index.html +17 -47
  25. package/coverage/js/common.js.html +1 -1
  26. package/coverage/js/fractal-scripts/combobox.js.html +1 -1
  27. package/coverage/js/fractal-scripts/index.html +1 -1
  28. package/coverage/js/fractal-scripts/notification.js.html +1 -1
  29. package/coverage/js/fractal-scripts/switch-state.js.html +1 -1
  30. package/coverage/js/index-fractal.js.html +1 -1
  31. package/coverage/js/index-polyfills.js.html +1 -1
  32. package/coverage/js/index-vue.js.html +3 -6
  33. package/coverage/js/index.html +1 -1
  34. package/coverage/js/index.js.html +1 -1
  35. package/coverage/js/polyfills/arrayPrototypeFind.js.html +1 -1
  36. package/coverage/js/polyfills/closest.js.html +1 -1
  37. package/coverage/js/polyfills/index.html +1 -1
  38. package/coverage/js/polyfills/objectAssign.js.html +1 -1
  39. package/coverage/js/polyfills/remove.js.html +1 -1
  40. package/coverage/tokens/_config.js.html +1 -1
  41. package/coverage/tokens/index.html +1 -1
  42. package/dist/_tokens/css/_tokens.css +1 -1
  43. package/dist/_tokens/js/_tokens-module.js +1 -1
  44. package/dist/_tokens/scss/_tokens.scss +1 -1
  45. package/dist/assets/icons.json +1 -1
  46. package/dist/css/index.css +1 -1
  47. package/dist/js/index.js +5 -5
  48. package/package.json +1 -1
  49. package/src/components/{macro-index.njk → _macro-index.njk} +0 -1
  50. package/src/components/accordion/README.md +18 -7
  51. package/src/components/accordion/_template.njk +46 -52
  52. package/src/components/accordion/accordion.config.js +8 -8
  53. package/src/components/accordion/accordion.js +39 -32
  54. package/src/components/accordion/accordion.njk +2 -1
  55. package/src/components/accordion/accordion.scss +15 -15
  56. package/src/components/inputs/_form-elements.scss +60 -19
  57. package/src/components/inputs/checkbox/README.md +3 -1
  58. package/src/components/inputs/checkbox/_template.njk +81 -18
  59. package/src/components/inputs/checkbox/checkbox.config.js +206 -1
  60. package/src/components/inputs/checkbox/checkbox.njk +5 -1
  61. package/src/components/inputs/label/_template.njk +39 -29
  62. package/src/components/popover/popover.scss +1 -0
  63. package/src/js/index-vue.js +1 -2
  64. package/src/layout/forms/forms.config.js +20 -20
  65. package/src/layout/forms/forms.njk +11 -12
  66. package/src/scss/components/__index.scss +0 -1
  67. package/tasks/createMacroIndex.js +1 -1
  68. package/__tests__/unit/src/components/multiselect.spec.js +0 -91
  69. package/coverage/components/inputs/multi-select/index.html +0 -110
  70. package/coverage/components/inputs/multi-select/multi-select.js.html +0 -175
  71. package/coverage/components/inputs/multi-select/vue-components/MultiSelect.vue.html +0 -229
  72. package/coverage/components/inputs/multi-select/vue-components/MultiSelectCheckbox.vue.html +0 -349
  73. package/coverage/components/inputs/multi-select/vue-components/MultiSelectCheckboxGroup.vue.html +0 -274
  74. package/coverage/components/inputs/multi-select/vue-components/index.html +0 -140
  75. package/cypress/integration/components/multi-select.spec.js +0 -9
  76. package/src/components/inputs/multi-select/README.md +0 -18
  77. package/src/components/inputs/multi-select/_macro.njk +0 -3
  78. package/src/components/inputs/multi-select/_template.njk +0 -57
  79. package/src/components/inputs/multi-select/multi-select.config.js +0 -178
  80. package/src/components/inputs/multi-select/multi-select.js +0 -32
  81. package/src/components/inputs/multi-select/multi-select.njk +0 -16
  82. package/src/components/inputs/multi-select/multi-select.scss +0 -39
  83. package/src/components/inputs/multi-select/vue-components/MultiSelect.vue +0 -50
  84. package/src/components/inputs/multi-select/vue-components/MultiSelectCheckbox.vue +0 -90
  85. package/src/components/inputs/multi-select/vue-components/MultiSelectCheckboxGroup.vue +0 -65
package/__tests__/unit/src/components/accordion.spec.js CHANGED
@@ -4,10 +4,10 @@ import accordion from '../../../../src/components/accordion/accordion';
4
4
  window.getComputedStyle = jest.fn().mockReturnValue({ 'font-size': '16px' });
5
5
 
6
6
  describe('Accordion - checkBreakpoint', () => {
7
- let element = {
7
+ const element = {
8
8
  dataset: {
9
- bp: ''
10
- }
9
+ bp: '',
10
+ },
11
11
  };
12
12
  beforeEach(() => {});
13
13
  it('shows accordion when no bp is set', async () => {
@@ -49,19 +49,20 @@ describe('Accordion - checkBreakpoint', () => {
49
49
  });
50
50
 
51
51
  describe('Accordion - createButton', () => {
52
- let element = document.createElement('div');
53
- element.innerHTML = '<div class="mds-accordion__trigger"><span>this is the span</span></div>';
52
+ const element = document.createElement('div');
53
+ element.classList.add('mds-accordion-trigger');
54
+ element.innerHTML = '<span>this is the span</span>';
54
55
  beforeEach(() => {});
55
56
  it('created the button and contains correct attrs', async () => {
56
57
  expect.assertions(2);
57
- const accordionTriggerButton = accordion.createButton('accordionId', element);
58
+ const accordionTriggerButton = accordion.createButton('accordionTriggerId', element);
58
59
  expect(accordionTriggerButton.innerHTML).toContain('this is the span');
59
- expect(accordionTriggerButton.classList).toEqual(expect.objectContaining({ '0': 'mds-accordion__trigger-button' }));
60
+ expect(accordionTriggerButton.classList).toEqual(expect.objectContaining({ '0': 'mds-accordion-trigger__button' }));
60
61
  });
61
62
  });
62
63
 
63
64
  describe('Accordion - switchLabel', () => {
64
- let element = document.createElement('span');
65
+ const element = document.createElement('span');
65
66
  element.dataset.labelinverse = 'view less';
66
67
  element.textContent = 'view more';
67
68
  beforeEach(() => {});
@@ -73,12 +74,15 @@ describe('Accordion - switchLabel', () => {
73
74
  });
74
75
 
75
76
  describe('Accordion - setAccordion', () => {
76
- let element = document.createElement('div');
77
- element.innerHTML = '<div class="mds-accordion__trigger"><span>this is the span</span></div><div class="mds-accordion__content">this is the content</div>';
77
+ const accordionTrigger = document.createElement('div');
78
+ accordionTrigger.classList.add('mds-accordion-trigger');
79
+ accordionTrigger.innerHTML = '<span><span class="mds-accordion-trigger__label">label</span></span>';
80
+ const accordionContent = document.createElement('div');
81
+ accordionContent.classList.add('mds-accordion-content');
78
82
  beforeEach(() => {});
79
83
  it('set accordion button', async () => {
80
84
  expect.assertions(1);
81
- accordion.setAccordion(element);
82
- expect(element.textContent).toContain('this is the span');
85
+ accordion.setAccordion(accordionTrigger, accordionContent);
86
+ expect(accordionTrigger.textContent).toContain('label');
83
87
  });
84
88
  });
package/coverage/cobertura-coverage.xml CHANGED
@@ -1,52 +1,52 @@
1
1
  <?xml version="1.0" ?>
2
2
  <!DOCTYPE coverage SYSTEM "http://cobertura.sourceforge.net/xml/coverage-04.dtd">
3
- <coverage lines-valid="522" lines-covered="212" line-rate="0.4061" branches-valid="153" branches-covered="51" branch-rate="0.3333" timestamp="1604068875351" complexity="0" version="0.1">
3
+ <coverage lines-valid="504" lines-covered="206" line-rate="0.40869999999999995" branches-valid="151" branches-covered="51" branch-rate="0.33770000000000006" timestamp="1604577133224" complexity="0" version="0.1">
4
4
  <sources>
5
5
  <source>/var/lib/jenkins/jobs/madgex-design-system/branches/master/workspace</source>
6
6
  </sources>
7
7
  <packages>
8
- <package name="components.accordion" line-rate="0.7465" branch-rate="0.625">
8
+ <package name="components.accordion" line-rate="0.7237" branch-rate="0.6111">
9
9
  <classes>
10
- <class name="accordion.js" filename="src/components/accordion/accordion.js" line-rate="0.7465" branch-rate="0.625">
10
+ <class name="accordion.js" filename="src/components/accordion/accordion.js" line-rate="0.7237" branch-rate="0.6111">
11
11
  <methods>
12
12
  <method name="(anonymous_0)" hits="0" signature="()V">
13
13
  <lines>
14
- <line number="10" hits="0"/>
14
+ <line number="9" hits="0"/>
15
15
  </lines>
16
16
  </method>
17
17
  <method name="(anonymous_1)" hits="0" signature="()V">
18
18
  <lines>
19
- <line number="14" hits="0"/>
19
+ <line number="13" hits="0"/>
20
20
  </lines>
21
21
  </method>
22
22
  <method name="(anonymous_2)" hits="6" signature="()V">
23
23
  <lines>
24
- <line number="23" hits="6"/>
24
+ <line number="24" hits="6"/>
25
25
  </lines>
26
26
  </method>
27
27
  <method name="(anonymous_3)" hits="1" signature="()V">
28
28
  <lines>
29
- <line number="58" hits="1"/>
29
+ <line number="59" hits="1"/>
30
30
  </lines>
31
31
  </method>
32
32
  <method name="(anonymous_4)" hits="0" signature="()V">
33
33
  <lines>
34
- <line number="68" hits="0"/>
34
+ <line number="72" hits="0"/>
35
35
  </lines>
36
36
  </method>
37
37
  <method name="(anonymous_5)" hits="2" signature="()V">
38
38
  <lines>
39
- <line number="73" hits="2"/>
39
+ <line number="77" hits="2"/>
40
40
  </lines>
41
41
  </method>
42
42
  <method name="(anonymous_6)" hits="1" signature="()V">
43
43
  <lines>
44
- <line number="87" hits="1"/>
44
+ <line number="93" hits="1"/>
45
45
  </lines>
46
46
  </method>
47
47
  <method name="(anonymous_7)" hits="0" signature="()V">
48
48
  <lines>
49
- <line number="97" hits="0"/>
49
+ <line number="103" hits="0"/>
50
50
  </lines>
51
51
  </method>
52
52
  </methods>
@@ -57,71 +57,76 @@
57
57
  <line number="4" hits="1" branch="false"/>
58
58
  <line number="5" hits="1" branch="false"/>
59
59
  <line number="6" hits="1" branch="false"/>
60
- <line number="7" hits="1" branch="false"/>
61
- <line number="9" hits="1" branch="false"/>
60
+ <line number="8" hits="1" branch="false"/>
61
+ <line number="10" hits="0" branch="false"/>
62
62
  <line number="11" hits="0" branch="false"/>
63
- <line number="12" hits="0" branch="false"/>
63
+ <line number="13" hits="0" branch="false"/>
64
64
  <line number="14" hits="0" branch="false"/>
65
65
  <line number="15" hits="0" branch="false"/>
66
66
  <line number="16" hits="0" branch="true" condition-coverage="0% (0/2)"/>
67
67
  <line number="17" hits="0" branch="false"/>
68
68
  <line number="19" hits="0" branch="false"/>
69
- <line number="24" hits="6" branch="false"/>
70
- <line number="26" hits="6" branch="true" condition-coverage="100% (2/2)"/>
71
- <line number="27" hits="5" branch="false"/>
69
+ <line number="20" hits="0" branch="false"/>
70
+ <line number="25" hits="6" branch="false"/>
71
+ <line number="27" hits="6" branch="true" condition-coverage="100% (2/2)"/>
72
72
  <line number="28" hits="5" branch="false"/>
73
- <line number="32" hits="5" branch="true" condition-coverage="100% (4/4)"/>
74
- <line number="34" hits="2" branch="false"/>
73
+ <line number="29" hits="5" branch="false"/>
74
+ <line number="33" hits="5" branch="true" condition-coverage="100% (4/4)"/>
75
75
  <line number="35" hits="2" branch="false"/>
76
- <line number="37" hits="1" branch="false"/>
76
+ <line number="36" hits="2" branch="false"/>
77
77
  <line number="38" hits="1" branch="false"/>
78
78
  <line number="39" hits="1" branch="false"/>
79
79
  <line number="40" hits="1" branch="false"/>
80
- <line number="42" hits="1" branch="false"/>
80
+ <line number="41" hits="1" branch="false"/>
81
81
  <line number="43" hits="1" branch="false"/>
82
82
  <line number="44" hits="1" branch="false"/>
83
83
  <line number="45" hits="1" branch="false"/>
84
- <line number="47" hits="1" branch="false"/>
85
- <line number="50" hits="4" branch="true" condition-coverage="100% (2/2)"/>
86
- <line number="51" hits="3" branch="false"/>
87
- <line number="54" hits="1" branch="false"/>
88
- <line number="56" hits="1" branch="false"/>
89
- <line number="59" hits="1" branch="false"/>
84
+ <line number="46" hits="1" branch="false"/>
85
+ <line number="48" hits="1" branch="false"/>
86
+ <line number="51" hits="4" branch="true" condition-coverage="100% (2/2)"/>
87
+ <line number="52" hits="3" branch="false"/>
88
+ <line number="55" hits="1" branch="false"/>
89
+ <line number="57" hits="1" branch="false"/>
90
90
  <line number="60" hits="1" branch="false"/>
91
91
  <line number="61" hits="1" branch="false"/>
92
92
  <line number="62" hits="1" branch="false"/>
93
93
  <line number="63" hits="1" branch="false"/>
94
94
  <line number="64" hits="1" branch="false"/>
95
95
  <line number="65" hits="1" branch="false"/>
96
- <line number="66" hits="1" branch="false"/>
97
- <line number="68" hits="1" branch="false"/>
98
- <line number="69" hits="0" branch="false"/>
99
- <line number="70" hits="0" branch="false"/>
100
- <line number="74" hits="2" branch="false"/>
101
- <line number="75" hits="2" branch="false"/>
102
- <line number="76" hits="2" branch="false"/>
103
- <line number="77" hits="2" branch="false"/>
96
+ <line number="66" hits="1" branch="true" condition-coverage="50% (1/2)"/>
97
+ <line number="67" hits="1" branch="false"/>
98
+ <line number="69" hits="1" branch="false"/>
99
+ <line number="70" hits="1" branch="false"/>
100
+ <line number="72" hits="1" branch="false"/>
101
+ <line number="73" hits="0" branch="false"/>
102
+ <line number="74" hits="0" branch="false"/>
104
103
  <line number="78" hits="2" branch="false"/>
105
104
  <line number="79" hits="2" branch="false"/>
106
105
  <line number="80" hits="2" branch="false"/>
107
- <line number="81" hits="2" branch="true" condition-coverage="50% (1/2)"/>
108
106
  <line number="82" hits="2" branch="false"/>
107
+ <line number="83" hits="2" branch="false"/>
108
+ <line number="84" hits="2" branch="false"/>
109
109
  <line number="85" hits="2" branch="false"/>
110
- <line number="88" hits="1" branch="false"/>
111
- <line number="90" hits="1" branch="true" condition-coverage="50% (1/2)"/>
112
- <line number="91" hits="1" branch="false"/>
113
- <line number="92" hits="1" branch="false"/>
114
- <line number="93" hits="1" branch="false"/>
115
- <line number="95" hits="1" branch="false"/>
116
- <line number="98" hits="0" branch="false"/>
117
- <line number="99" hits="0" branch="false"/>
118
- <line number="100" hits="0" branch="false"/>
119
- <line number="102" hits="0" branch="true" condition-coverage="0% (0/2)"/>
120
- <line number="103" hits="0" branch="false"/>
110
+ <line number="86" hits="2" branch="false"/>
111
+ <line number="87" hits="2" branch="true" condition-coverage="50% (1/2)"/>
112
+ <line number="88" hits="2" branch="false"/>
113
+ <line number="91" hits="2" branch="false"/>
114
+ <line number="94" hits="1" branch="false"/>
115
+ <line number="96" hits="1" branch="true" condition-coverage="50% (1/2)"/>
116
+ <line number="97" hits="1" branch="false"/>
117
+ <line number="98" hits="1" branch="false"/>
118
+ <line number="99" hits="1" branch="false"/>
119
+ <line number="101" hits="1" branch="false"/>
121
120
  <line number="104" hits="0" branch="false"/>
122
- <line number="106" hits="0" branch="false"/>
123
- <line number="107" hits="0" branch="false"/>
121
+ <line number="105" hits="0" branch="false"/>
122
+ <line number="107" hits="0" branch="true" condition-coverage="0% (0/2)"/>
123
+ <line number="108" hits="0" branch="false"/>
124
124
  <line number="109" hits="0" branch="false"/>
125
+ <line number="110" hits="0" branch="false"/>
126
+ <line number="112" hits="0" branch="false"/>
127
+ <line number="113" hits="0" branch="false"/>
128
+ <line number="114" hits="0" branch="false"/>
129
+ <line number="116" hits="0" branch="false"/>
125
130
  </lines>
126
131
  </class>
127
132
  </classes>
@@ -484,126 +489,6 @@
484
489
  </class>
485
490
  </classes>
486
491
  </package>
487
- <package name="components.inputs.multi-select" line-rate="0" branch-rate="0">
488
- <classes>
489
- <class name="multi-select.js" filename="src/components/inputs/multi-select/multi-select.js" line-rate="0" branch-rate="0">
490
- <methods>
491
- <method name="constructOptionsList" hits="0" signature="()V">
492
- <lines>
493
- <line number="6" hits="0"/>
494
- </lines>
495
- </method>
496
- <method name="(anonymous_1)" hits="0" signature="()V">
497
- <lines>
498
- <line number="8" hits="0"/>
499
- </lines>
500
- </method>
501
- <method name="(anonymous_2)" hits="0" signature="()V">
502
- <lines>
503
- <line number="28" hits="0"/>
504
- </lines>
505
- </method>
506
- </methods>
507
- <lines>
508
- <line number="3" hits="0" branch="false"/>
509
- <line number="4" hits="0" branch="false"/>
510
- <line number="7" hits="0" branch="false"/>
511
- <line number="8" hits="0" branch="false"/>
512
- <line number="9" hits="0" branch="false"/>
513
- <line number="10" hits="0" branch="false"/>
514
- <line number="11" hits="0" branch="false"/>
515
- <line number="12" hits="0" branch="false"/>
516
- <line number="20" hits="0" branch="false"/>
517
- <line number="29" hits="0" branch="false"/>
518
- </lines>
519
- </class>
520
- </classes>
521
- </package>
522
- <package name="components.inputs.multi-select.vue-components" line-rate="0.6154" branch-rate="0.5">
523
- <classes>
524
- <class name="MultiSelect.vue" filename="src/components/inputs/multi-select/vue-components/MultiSelect.vue" line-rate="0.6" branch-rate="1">
525
- <methods>
526
- <method name="_default" hits="0" signature="()V">
527
- <lines>
528
- <line number="26" hits="0"/>
529
- </lines>
530
- </method>
531
- <method name="provide" hits="4" signature="()V">
532
- <lines>
533
- <line number="33" hits="4"/>
534
- </lines>
535
- </method>
536
- <method name="data" hits="4" signature="()V">
537
- <lines>
538
- <line number="38" hits="4"/>
539
- </lines>
540
- </method>
541
- <method name="options" hits="0" signature="()V">
542
- <lines>
543
- <line number="45" hits="0"/>
544
- </lines>
545
- </method>
546
- </methods>
547
- <lines>
548
- <line number="8" hits="1" branch="false"/>
549
- <line number="26" hits="0" branch="false"/>
550
- <line number="34" hits="4" branch="false"/>
551
- <line number="39" hits="4" branch="false"/>
552
- <line number="46" hits="0" branch="false"/>
553
- </lines>
554
- </class>
555
- <class name="MultiSelectCheckbox.vue" filename="src/components/inputs/multi-select/vue-components/MultiSelectCheckbox.vue" line-rate="0.6667000000000001" branch-rate="0.5">
556
- <methods>
557
- <method name="data" hits="20" signature="()V">
558
- <lines>
559
- <line number="64" hits="20"/>
560
- </lines>
561
- </method>
562
- <method name="get" hits="20" signature="()V">
563
- <lines>
564
- <line number="72" hits="20"/>
565
- </lines>
566
- </method>
567
- <method name="set" hits="0" signature="()V">
568
- <lines>
569
- <line number="76" hits="0"/>
570
- </lines>
571
- </method>
572
- <method name="toggleExpansion" hits="1" signature="()V">
573
- <lines>
574
- <line number="82" hits="1"/>
575
- </lines>
576
- </method>
577
- <method name="toggleChecked" hits="0" signature="()V">
578
- <lines>
579
- <line number="85" hits="0"/>
580
- </lines>
581
- </method>
582
- </methods>
583
- <lines>
584
- <line number="65" hits="20" branch="false"/>
585
- <line number="73" hits="20" branch="true" condition-coverage="50% (1/2)"/>
586
- <line number="74" hits="20" branch="false"/>
587
- <line number="77" hits="0" branch="false"/>
588
- <line number="83" hits="1" branch="false"/>
589
- <line number="86" hits="0" branch="false"/>
590
- </lines>
591
- </class>
592
- <class name="MultiSelectCheckboxGroup.vue" filename="src/components/inputs/multi-select/vue-components/MultiSelectCheckboxGroup.vue" line-rate="0.5" branch-rate="1">
593
- <methods>
594
- <method name="_default" hits="0" signature="()V">
595
- <lines>
596
- <line number="49" hits="0"/>
597
- </lines>
598
- </method>
599
- </methods>
600
- <lines>
601
- <line number="35" hits="1" branch="false"/>
602
- <line number="49" hits="0" branch="false"/>
603
- </lines>
604
- </class>
605
- </classes>
606
- </package>
607
492
  <package name="components.inputs.textarea" line-rate="0" branch-rate="0">
608
493
  <classes>
609
494
  <class name="character-count.js" filename="src/components/inputs/textarea/character-count.js" line-rate="0" branch-rate="0">
@@ -1170,17 +1055,17 @@
1170
1055
  <methods>
1171
1056
  <method name="(anonymous_0)" hits="0" signature="()V">
1172
1057
  <lines>
1173
- <line number="13" hits="0"/>
1058
+ <line number="12" hits="0"/>
1174
1059
  </lines>
1175
1060
  </method>
1176
1061
  </methods>
1177
1062
  <lines>
1063
+ <line number="6" hits="0" branch="false"/>
1178
1064
  <line number="7" hits="0" branch="false"/>
1179
- <line number="8" hits="0" branch="false"/>
1065
+ <line number="9" hits="0" branch="false"/>
1180
1066
  <line number="10" hits="0" branch="false"/>
1181
- <line number="11" hits="0" branch="false"/>
1067
+ <line number="12" hits="0" branch="false"/>
1182
1068
  <line number="13" hits="0" branch="false"/>
1183
- <line number="14" hits="0" branch="false"/>
1184
1069
  </lines>
1185
1070
  </class>
1186
1071
  <class name="index.js" filename="src/js/index.js" line-rate="0" branch-rate="1">
package/coverage/components/accordion/accordion.js.html CHANGED
@@ -22,16 +22,16 @@
22
22
  <div class='clearfix'>
23
23
 
24
24
  <div class='fl pad1y space-right2'>
25
- <span class="strong">74.65% </span>
25
+ <span class="strong">72.37% </span>
26
26
  <span class="quiet">Statements</span>
27
- <span class='fraction'>53/71</span>
27
+ <span class='fraction'>55/76</span>
28
28
  </div>
29
29
 
30
30
 
31
31
  <div class='fl pad1y space-right2'>
32
- <span class="strong">62.5% </span>
32
+ <span class="strong">61.11% </span>
33
33
  <span class="quiet">Branches</span>
34
- <span class='fraction'>10/16</span>
34
+ <span class='fraction'>11/18</span>
35
35
  </div>
36
36
 
37
37
 
@@ -43,9 +43,9 @@
43
43
 
44
44
 
45
45
  <div class='fl pad1y space-right2'>
46
- <span class="strong">74.65% </span>
46
+ <span class="strong">72.37% </span>
47
47
  <span class="quiet">Lines</span>
48
- <span class='fraction'>53/71</span>
48
+ <span class='fraction'>55/76</span>
49
49
  </div>
50
50
 
51
51
 
@@ -169,8 +169,14 @@
169
169
  <a name='L111'></a><a href='#L111'>111</a>
170
170
  <a name='L112'></a><a href='#L112'>112</a>
171
171
  <a name='L113'></a><a href='#L113'>113</a>
172
- <a name='L114'></a><a href='#L114'>114</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">1x</span>
173
- <span class="cline-any cline-yes">1x</span>
172
+ <a name='L114'></a><a href='#L114'>114</a>
173
+ <a name='L115'></a><a href='#L115'>115</a>
174
+ <a name='L116'></a><a href='#L116'>116</a>
175
+ <a name='L117'></a><a href='#L117'>117</a>
176
+ <a name='L118'></a><a href='#L118'>118</a>
177
+ <a name='L119'></a><a href='#L119'>119</a>
178
+ <a name='L120'></a><a href='#L120'>120</a>
179
+ <a name='L121'></a><a href='#L121'>121</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">1x</span>
174
180
  <span class="cline-any cline-yes">1x</span>
175
181
  <span class="cline-any cline-yes">1x</span>
176
182
  <span class="cline-any cline-yes">1x</span>
@@ -186,8 +192,10 @@
186
192
  <span class="cline-any cline-no">&nbsp;</span>
187
193
  <span class="cline-any cline-no">&nbsp;</span>
188
194
  <span class="cline-any cline-no">&nbsp;</span>
195
+ <span class="cline-any cline-no">&nbsp;</span>
189
196
  <span class="cline-any cline-neutral">&nbsp;</span>
190
197
  <span class="cline-any cline-no">&nbsp;</span>
198
+ <span class="cline-any cline-no">&nbsp;</span>
191
199
  <span class="cline-any cline-neutral">&nbsp;</span>
192
200
  <span class="cline-any cline-neutral">&nbsp;</span>
193
201
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -237,6 +245,9 @@
237
245
  <span class="cline-any cline-yes">1x</span>
238
246
  <span class="cline-any cline-neutral">&nbsp;</span>
239
247
  <span class="cline-any cline-yes">1x</span>
248
+ <span class="cline-any cline-yes">1x</span>
249
+ <span class="cline-any cline-neutral">&nbsp;</span>
250
+ <span class="cline-any cline-yes">1x</span>
240
251
  <span class="cline-any cline-no">&nbsp;</span>
241
252
  <span class="cline-any cline-no">&nbsp;</span>
242
253
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -245,6 +256,8 @@
245
256
  <span class="cline-any cline-yes">2x</span>
246
257
  <span class="cline-any cline-yes">2x</span>
247
258
  <span class="cline-any cline-yes">2x</span>
259
+ <span class="cline-any cline-neutral">&nbsp;</span>
260
+ <span class="cline-any cline-yes">2x</span>
248
261
  <span class="cline-any cline-yes">2x</span>
249
262
  <span class="cline-any cline-yes">2x</span>
250
263
  <span class="cline-any cline-yes">2x</span>
@@ -268,39 +281,41 @@
268
281
  <span class="cline-any cline-neutral">&nbsp;</span>
269
282
  <span class="cline-any cline-no">&nbsp;</span>
270
283
  <span class="cline-any cline-no">&nbsp;</span>
271
- <span class="cline-any cline-no">&nbsp;</span>
272
284
  <span class="cline-any cline-neutral">&nbsp;</span>
273
285
  <span class="cline-any cline-no">&nbsp;</span>
274
286
  <span class="cline-any cline-no">&nbsp;</span>
275
287
  <span class="cline-any cline-no">&nbsp;</span>
288
+ <span class="cline-any cline-no">&nbsp;</span>
276
289
  <span class="cline-any cline-neutral">&nbsp;</span>
277
290
  <span class="cline-any cline-no">&nbsp;</span>
278
291
  <span class="cline-any cline-no">&nbsp;</span>
292
+ <span class="cline-any cline-no">&nbsp;</span>
279
293
  <span class="cline-any cline-neutral">&nbsp;</span>
280
294
  <span class="cline-any cline-no">&nbsp;</span>
281
295
  <span class="cline-any cline-neutral">&nbsp;</span>
282
296
  <span class="cline-any cline-neutral">&nbsp;</span>
283
297
  <span class="cline-any cline-neutral">&nbsp;</span>
284
298
  <span class="cline-any cline-neutral">&nbsp;</span>
285
- <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">const accordionClass = 'mds-accordion';
286
- const accordionTriggerClass = 'mds-accordion__trigger';
287
- const accordionTriggerButtonClass = 'mds-accordion__trigger-button';
288
- const accordionContentClass = 'mds-accordion__content';
289
- const accordionExpandedClass = 'mds-accordion--expanded';
299
+ <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">const accordionTriggerClass = 'mds-accordion-trigger';
300
+ const accordionTriggerButtonClass = 'mds-accordion-trigger__button';
301
+ const accordionTriggerLabelClass = 'mds-accordion-trigger__label';
302
+ const accordionTriggerExpandedClass = 'mds-accordion-trigger--expanded';
303
+ const accordionContentExpandedClass = 'mds-accordion-content--expanded';
290
304
  const accordionLabelInverseData = 'data-labelinverse';
291
- const accordionTriggerLabelClass = 'mds-accordion__trigger-label';
292
305
  &nbsp;
293
306
  const accordion = {
294
307
  init: <span class="fstat-no" title="function not covered" >()</span> =&gt; {
295
- const accordionList = <span class="cstat-no" title="statement not covered" >Array.from(document.querySelectorAll(`.${accordionClass}`));</span>
308
+ const accordionTriggerList = <span class="cstat-no" title="statement not covered" >Array.from(document.querySelectorAll(`.${accordionTriggerClass}`));</span>
296
309
  const screenWidth = <span class="cstat-no" title="statement not covered" >window.innerWidth;</span>
297
310
  &nbsp;
298
- <span class="cstat-no" title="statement not covered" > accordionList.forEach(<span class="fstat-no" title="function not covered" >(e</span>lement) =&gt; {</span>
299
- const isAccordion = <span class="cstat-no" title="statement not covered" >accordion.checkBreakpoint(element, screenWidth);</span>
311
+ <span class="cstat-no" title="statement not covered" > accordionTriggerList.forEach(<span class="fstat-no" title="function not covered" >(t</span>rigger) =&gt; {</span>
312
+ const accordionContent = <span class="cstat-no" title="statement not covered" >trigger.nextElementSibling;</span>
313
+ const isAccordion = <span class="cstat-no" title="statement not covered" >accordion.checkBreakpoint(trigger, screenWidth);</span>
300
314
  <span class="cstat-no" title="statement not covered" > if (isAccordion) {</span>
301
- <span class="cstat-no" title="statement not covered" > accordion.setAccordion(element);</span>
315
+ <span class="cstat-no" title="statement not covered" > accordion.setAccordion(trigger, accordionContent);</span>
302
316
  } else {
303
- <span class="cstat-no" title="statement not covered" > element.classList.add(accordionExpandedClass);</span>
317
+ <span class="cstat-no" title="statement not covered" > trigger.classList.add(accordionTriggerExpandedClass);</span>
318
+ <span class="cstat-no" title="statement not covered" > accordionContent.classList.add(accordionContentExpandedClass);</span>
304
319
  }
305
320
  });
306
321
  },
@@ -339,29 +354,34 @@ const accordion = {
339
354
  }
340
355
  return true;
341
356
  },
342
- setAccordion: (element) =&gt; {
343
- const accordionId = element.id;
344
- const accordionTrigger = element.querySelector(`.${accordionTriggerClass}`);
345
- const accordionContent = element.querySelector(`.${accordionContentClass}`);
346
- const accordionTriggerButton = accordion.createButton(accordionId, element);
347
- accordionTrigger.classList.remove('mds-display-none');
348
- accordionContent.setAttribute('aria-labelledby', `accordion-trigger-${accordionId}`);
349
- accordionTrigger.innerHTML = '';
350
- accordionTrigger.appendChild(accordionTriggerButton);
357
+ setAccordion: (accordionTrigger, accordionContent) =&gt; {
358
+ const triggerContainer = accordionTrigger;
359
+ const accordionTriggerId = triggerContainer.id;
360
+ const label = triggerContainer.querySelector('.mds-accordion-trigger__label');
361
+ const labelText = label.innerText;
362
+ const triggerButton = accordion.createButton(accordionTriggerId, triggerContainer);
363
+ triggerContainer.classList.remove('mds-display-none');
364
+ <span class="missing-if-branch" title="else path not taken" >E</span>if (accordionContent.nodeName.toLowerCase() !== 'fieldset') {
365
+ accordionContent.setAttribute('aria-label', labelText);
366
+ }
367
+ triggerContainer.innerHTML = '';
368
+ triggerContainer.appendChild(triggerButton);
351
369
  &nbsp;
352
- accordionTriggerButton.addEventListener('click', <span class="fstat-no" title="function not covered" >(e</span>lem) =&gt; {
370
+ triggerButton.addEventListener('click', <span class="fstat-no" title="function not covered" >(e</span>lem) =&gt; {
353
371
  <span class="cstat-no" title="statement not covered" > elem.preventDefault();</span>
354
- <span class="cstat-no" title="statement not covered" > accordion.toggleExpand(accordionTriggerButton);</span>
372
+ <span class="cstat-no" title="statement not covered" > accordion.toggleExpand(triggerButton, triggerContainer, accordionContent);</span>
355
373
  });
356
374
  },
357
- createButton: (accordionId, element) =&gt; {
375
+ createButton: (accordionTriggerId, element) =&gt; {
358
376
  const accordionTriggerSpan = element.querySelector(`.${accordionTriggerClass} &gt; span`);
359
377
  const accordionTriggerButton = document.createElement('button');
360
378
  accordionTriggerButton.className = accordionTriggerButtonClass;
361
- accordionTriggerButton.classList.add('mds-button', 'mds-button--plain', 'mds-padding-b0');
362
- accordionTriggerButton.setAttribute('id', `accordion-trigger-${accordionId}`);
379
+ // can't use multiple arguments in classList.add() due to IE
380
+ accordionTriggerButton.classList.add('mds-button');
381
+ accordionTriggerButton.classList.add('mds-button--plain');
382
+ accordionTriggerButton.classList.add('mds-padding-b0');
383
+ accordionTriggerButton.setAttribute('id', accordionTriggerId);
363
384
  accordionTriggerButton.setAttribute('aria-expanded', false);
364
- accordionTriggerButton.setAttribute('aria-controls', `accordion-content-${accordionId}`);
365
385
  <span class="missing-if-branch" title="else path not taken" >E</span>if (accordionTriggerSpan) {
366
386
  accordionTriggerButton.appendChild(accordionTriggerSpan);
367
387
  }
@@ -378,17 +398,18 @@ const accordion = {
378
398
  }
379
399
  return element;
380
400
  },
381
- toggleExpand: <span class="fstat-no" title="function not covered" >(e</span>) =&gt; {
382
- const accordionTriggerButton = <span class="cstat-no" title="statement not covered" >e;</span>
383
- const accordionTriggerButtonLabel = <span class="cstat-no" title="statement not covered" >e.querySelector(`.${accordionTriggerLabelClass}`);</span>
384
- const accordionParent = <span class="cstat-no" title="statement not covered" >accordionTriggerButton.closest(`.${accordionClass}`);</span>
401
+ toggleExpand: <span class="fstat-no" title="function not covered" >(t</span>riggerButton, triggerContainer, accordionContent) =&gt; {
402
+ const accordionTriggerButton = <span class="cstat-no" title="statement not covered" >triggerButton;</span>
403
+ const accordionTriggerButtonLabel = <span class="cstat-no" title="statement not covered" >triggerButton.querySelector(`.${accordionTriggerLabelClass}`);</span>
385
404
  &nbsp;
386
405
  <span class="cstat-no" title="statement not covered" > if (accordionTriggerButton.getAttribute('aria-expanded') === 'false') {</span>
387
406
  <span class="cstat-no" title="statement not covered" > accordionTriggerButton.setAttribute('aria-expanded', true);</span>
388
- <span class="cstat-no" title="statement not covered" > accordionParent.classList.add(accordionExpandedClass);</span>
407
+ <span class="cstat-no" title="statement not covered" > triggerContainer.classList.add(accordionTriggerExpandedClass);</span>
408
+ <span class="cstat-no" title="statement not covered" > accordionContent.classList.add(accordionContentExpandedClass);</span>
389
409
  } else {
390
410
  <span class="cstat-no" title="statement not covered" > accordionTriggerButton.setAttribute('aria-expanded', false);</span>
391
- <span class="cstat-no" title="statement not covered" > accordionParent.classList.remove(accordionExpandedClass);</span>
411
+ <span class="cstat-no" title="statement not covered" > triggerContainer.classList.remove(accordionTriggerExpandedClass);</span>
412
+ <span class="cstat-no" title="statement not covered" > accordionContent.classList.remove(accordionContentExpandedClass);</span>
392
413
  }
393
414
  <span class="cstat-no" title="statement not covered" > accordion.switchLabel(accordionTriggerButtonLabel);</span>
394
415
  },
@@ -402,7 +423,7 @@ export default accordion;
402
423
  <div class='footer quiet pad2 space-top1 center small'>
403
424
  Code coverage generated by
404
425
  <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
405
- at Fri Oct 30 2020 14:41:15 GMT+0000 (Greenwich Mean Time)
426
+ at Thu Nov 05 2020 11:52:13 GMT+0000 (Greenwich Mean Time)
406
427
  </div>
407
428
  </div>
408
429
  <script src="../../prettify.js"></script>