fix(demos): Convert NodeList to array for forEach; avoid fat arrow (#…

…1073) This resolves issues in the slider and snackbar demos for IE 11 and Edge.
material-components · Aug 8, 2017 · c6a1f2a · c6a1f2a
1 parent eb35255
commit c6a1f2a
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 8 deletions.
diff --git a/demos/slider.html b/demos/slider.html
@@ -288,8 +288,7 @@ <h2>Discrete Slider with markers</h2>
           });
 
           darkTheme.addEventListener('change', function() {
-            var examples = demoRoot.querySelectorAll('.example-slider-wrapper');
-            examples.forEach((example) => {
+            [].slice.call(demoRoot.querySelectorAll('.example-slider-wrapper')).forEach(function(example) {
               example.classList[ darkTheme.checked ? 'add' : 'remove']('mdc-theme--dark');
             });
           });
@@ -301,15 +300,13 @@ <h2>Discrete Slider with markers</h2>
           });
 
           useCustomColor.addEventListener('change', function() {
-            var examples = demoRoot.querySelectorAll('.example-slider-wrapper');
-            examples.forEach((example) => {
+            [].slice.call(demoRoot.querySelectorAll('.example-slider-wrapper')).forEach(function(example) {
               example.classList[ useCustomColor.checked ? 'add' : 'remove' ]('custom-bg');
             });
           });
 
           rtl.addEventListener('change', function() {
-            var examples = demoRoot.querySelectorAll('.example-slider-wrapper');
-            examples.forEach((example) => {
+            [].slice.call(demoRoot.querySelectorAll('.example-slider-wrapper')).forEach(function(example) {
               if (rtl.checked) {
                 example.setAttribute('dir', 'rtl');
               } else {

diff --git a/demos/snackbar.html b/demos/snackbar.html
@@ -213,7 +213,6 @@ <h2 class="mdc-typography--title">Basic Example</h2>
         var actionOnBottomInput = document.getElementById('action-on-bottom');
         var actionOnBottomCheckbox = document.getElementById('action-on-bottom-checkbox');
         var dismissOnActionInput = document.getElementById('dismiss-on-action');
-        var textFields = document.querySelectorAll('.mdc-textfield');
 
         // Since Action on Bottom cannot be checked if Multi-line Input
         // is not, we start with a disabled Action on Bottom option
@@ -271,7 +270,7 @@ <h2 class="mdc-typography--title">Basic Example</h2>
           document.body.classList.contains('mdc-theme--dark') ? document.body.classList.remove('mdc-theme--dark') : document.body.classList.add('mdc-theme--dark');
         });
 
-        textFields.forEach(function(tf) {
+        [].slice.call(document.querySelectorAll('.mdc-textfield')).forEach(function(tf) {
           mdc.textfield.MDCTextfield.attachTo(tf);
         })