fix javascript issue with HTMLCollection loop

Wikiki · Jun 30, 2020 · b189fe9 · b189fe9
1 parent 2c45c11
commit b189fe9
Show file tree

Hide file tree

Showing 6 changed files with 13 additions and 4 deletions.
diff --git a/dist/js/bulma-slider.js b/dist/js/bulma-slider.js
@@ -167,7 +167,7 @@ var bulmaSlider = function (_EventEmitter) {
       var result = null;
       var outputs = document.getElementsByTagName('output') || [];
 
-      outputs.forEach(function (output) {
+      Array.from(outputs).forEach(function (output) {
         if (output.htmlFor == _this2.element.getAttribute('id')) {
           result = output;
           return true;

diff --git a/dist/js/bulma-slider.min.js b/dist/js/bulma-slider.min.js
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "bulma-slider",
-  "version": "2.0.3",
+  "version": "2.0.4",
   "description": "Display classic slider more sexy, in different colors, sizes, and states ",
   "main": "dist/js/bulma-slider.min.js",
   "style": "dist/css/bulma-slider.min.css",

diff --git a/src/js/index.js b/src/js/index.js
@@ -75,7 +75,7 @@ export default class bulmaSlider extends EventEmitter {
     let result = null;
     const outputs = document.getElementsByTagName('output') || [];
 
-    outputs.forEach(output => {
+    Array.from(outputs).forEach(output => {
       if (output.htmlFor == this.element.getAttribute('id')) {
         result = output;
         return true;

diff --git a/test/index.html b/test/index.html
@@ -20,6 +20,14 @@
     <input class="slider is-fullwidth is-danger" step="1" min="0" max="100" value="50" type="range">
 
     <input class="slider is-fullwidth is-info" step="1" min="0" max="100" value="50" type="range">
+
+    <input id="sliderWithValue" class="slider has-output is-fullwidth" min="0" max="100" value="50" step="1" type="range">
+    <output for="sliderWithValue">50</output>
+
+    <script src="js/bulma-slider.min.js"></script>
+    <script>
+        bulmaSlider.attach();
+    </script>
 </body>
 
 </html>