feat: add toArray function to convert NodeList to Array

src/components/controls.js

@@ -1,4 +1,4 @@
-import { siblings } from '../utils/dom'
+import { siblings, toArray } from '../utils/dom'
 import { define } from '../utils/object'
 import supportsPassive from '../utils/detect-passive-event'
 
@@ -147,7 +147,7 @@ export default function (Glide, Components, Events) {
       const settings = Glide.settings
 
       lists.forEach(function (list) {
-        list.forEach(function (element) {
+        toArray(list).forEach(function (element) {
           element.classList.remove(settings.classes.arrow.disabled)
         })
       })
@@ -162,7 +162,7 @@ export default function (Glide, Components, Events) {
       const settings = Glide.settings
 
       lists.forEach(function (list) {
-        list.forEach(function (element) {
+        toArray(list).forEach(function (element) {
           element.classList.add(settings.classes.arrow.disabled)
         })
       })

src/components/html.js

@@ -1,5 +1,5 @@
 import { warn } from '../utils/log'
-import { exist } from '../utils/dom'
+import { exist, toArray } from '../utils/dom'
 import { define } from '../utils/object'
 import { isString } from '../utils/unit'
 
@@ -22,7 +22,7 @@ export default function (Glide, Components, Events) {
      * Collect slides
      */
     collectSlides () {
-      this.slides = Array.prototype.slice.call(this.wrapper.children).filter((slide) => {
+      this.slides = toArray(this.wrapper.children).filter((slide) => {
         return !slide.classList.contains(Glide.settings.classes.slide.clone)
       })
     }

src/utils/dom.js

@@ -34,3 +34,14 @@ export function exist (node) {
 
   return false
 }
+
+/**
+ * Coerces a NodeList to an Array.
+ *
+ * @param  {NodeList} nodeList
+ * @return {Array}
+ */
+
+export function toArray (nodeList) {
+  return Array.prototype.slice.call(nodeList)
+}

tests/unit/dom.test.js

@@ -1,4 +1,4 @@
-import { exist, siblings } from '../../src/utils/dom'
+import { exist, toArray, siblings } from '../../src/utils/dom'
 
 describe('Function', () => {
   beforeEach(() => {
@@ -21,4 +21,15 @@ describe('Function', () => {
 
     expect(siblings(children[1])).toHaveLength(2)
   })
+
+  test('`toArray` should return an array with the same elements when passed a NodeList', () => {
+    let children = document.querySelectorAll('.child')
+
+    // eslint-disable-next-line no-undef
+    expect(NodeList.prototype.isPrototypeOf(children)).toBe(true)
+    expect(Array.isArray(toArray(children))).toBe(true)
+    toArray(children).forEach((child, i) => {
+      expect(child).toEqual(children[i])
+    })
+  })
 })