fix: remove make array util function (#30430)

17 files changed, 53 insertions, 89 deletions

diff --git a/js/src/carousel.js b/js/src/carousel.js
index 7230d5aaf7..509f7ca9d8 100644
--- a/js/src/carousel.js
+++ b/js/src/carousel.js
@@ -12,7 +12,6 @@ import {
   getElementFromSelector,
   getTransitionDurationFromElement,
   isVisible,
-  makeArray,
   reflow,
   triggerTransitionEnd,
   typeCheckConfig
@@ -322,7 +321,7 @@ class Carousel {
       }
     }
 
-    makeArray(SelectorEngine.find(SELECTOR_ITEM_IMG, this._element)).forEach(itemImg => {
+    SelectorEngine.find(SELECTOR_ITEM_IMG, this._element).forEach(itemImg => {
       EventHandler.on(itemImg, EVENT_DRAG_START, e => e.preventDefault())
     })
 
@@ -358,7 +357,7 @@ class Carousel {
 
   _getItemIndex(element) {
     this._items = element && element.parentNode ?
-      makeArray(SelectorEngine.find(SELECTOR_ITEM, element.parentNode)) :
+      SelectorEngine.find(SELECTOR_ITEM, element.parentNode) :
       []
 
     return this._items.indexOf(element)
@@ -601,7 +600,8 @@ EventHandler
   .on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_SLIDE, Carousel.dataApiClickHandler)
 
 EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
-  const carousels = makeArray(SelectorEngine.find(SELECTOR_DATA_RIDE))
+  const carousels = SelectorEngine.find(SELECTOR_DATA_RIDE)
+
   for (let i = 0, len = carousels.length; i < len; i++) {
     Carousel.carouselInterface(carousels[i], Data.getData(carousels[i], DATA_KEY))
   }
diff --git a/js/src/collapse.js b/js/src/collapse.js
index 3b78c5cdb3..fde3e0a9ed 100644
--- a/js/src/collapse.js
+++ b/js/src/collapse.js
@@ -13,7 +13,6 @@ import {
   getElementFromSelector,
   getTransitionDurationFromElement,
   isElement,
-  makeArray,
   reflow,
   typeCheckConfig
 } from './util/index'
@@ -72,16 +71,17 @@ class Collapse {
     this._isTransitioning = false
     this._element = element
     this._config = this._getConfig(config)
-    this._triggerArray = makeArray(SelectorEngine.find(
+    this._triggerArray = SelectorEngine.find(
       `${SELECTOR_DATA_TOGGLE}[href="#${element.id}"],` +
       `${SELECTOR_DATA_TOGGLE}[data-target="#${element.id}"]`
-    ))
+    )
+
+    const toggleList = SelectorEngine.find(SELECTOR_DATA_TOGGLE)
 
-    const toggleList = makeArray(SelectorEngine.find(SELECTOR_DATA_TOGGLE))
     for (let i = 0, len = toggleList.length; i < len; i++) {
       const elem = toggleList[i]
       const selector = getSelectorFromElement(elem)
-      const filterElement = makeArray(SelectorEngine.find(selector))
+      const filterElement = SelectorEngine.find(selector)
         .filter(foundElem => foundElem === element)
 
       if (selector !== null && filterElement.length) {
@@ -133,7 +133,7 @@ class Collapse {
     let activesData
 
     if (this._parent) {
-      actives = makeArray(SelectorEngine.find(SELECTOR_ACTIVES, this._parent))
+      actives = SelectorEngine.find(SELECTOR_ACTIVES, this._parent)
         .filter(elem => {
           if (typeof this._config.parent === 'string') {
             return elem.getAttribute('data-parent') === this._config.parent
@@ -307,7 +307,7 @@ class Collapse {
 
     const selector = `${SELECTOR_DATA_TOGGLE}[data-parent="${parent}"]`
 
-    makeArray(SelectorEngine.find(selector, parent))
+    SelectorEngine.find(selector, parent)
       .forEach(element => {
         const selected = getElementFromSelector(element)
 
@@ -390,7 +390,7 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
 
   const triggerData = Manipulator.getDataAttributes(this)
   const selector = getSelectorFromElement(this)
-  const selectorElements = makeArray(SelectorEngine.find(selector))
+  const selectorElements = SelectorEngine.find(selector)
 
   selectorElements.forEach(element => {
     const data = Data.getData(element, DATA_KEY)
diff --git a/js/src/dom/selector-engine.js b/js/src/dom/selector-engine.js
index c18ec4136f..bbed1b720e 100644
--- a/js/src/dom/selector-engine.js
+++ b/js/src/dom/selector-engine.js
@@ -6,7 +6,6 @@
  */
 
 import { find as findFn, findOne } from './polyfill'
-import { makeArray } from '../util/index'
 
 /**
  * ------------------------------------------------------------------------
@@ -22,7 +21,7 @@ const SelectorEngine = {
   },
 
   find(selector, element = document.documentElement) {
-    return findFn.call(element, selector)
+    return [].concat(...findFn.call(element, selector))
   },
 
   findOne(selector, element = document.documentElement) {
@@ -30,9 +29,9 @@ const SelectorEngine = {
   },
 
   children(element, selector) {
-    const children = makeArray(element.children)
+    const children = [].concat(...element.children)
 
-    return children.filter(child => this.matches(child, selector))
+    return children.filter(child => child.matches(selector))
   },
 
   parents(element, selector) {
@@ -59,7 +58,7 @@ const SelectorEngine = {
     let previous = element.previousElementSibling
 
     while (previous) {
-      if (this.matches(previous, selector)) {
+      if (previous.matches(selector)) {
         return [previous]
       }
 
diff --git a/js/src/dropdown.js b/js/src/dropdown.js
index b8f8c22b8c..aab1d6bd2a 100644
--- a/js/src/dropdown.js
+++ b/js/src/dropdown.js
@@ -10,7 +10,6 @@ import {
   getElementFromSelector,
   isElement,
   isVisible,
-  makeArray,
   noop,
   typeCheckConfig
 } from './util/index'
@@ -190,8 +189,8 @@ class Dropdown {
     // only needed because of broken event delegation on iOS
     // https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
     if ('ontouchstart' in document.documentElement &&
-      !makeArray(SelectorEngine.closest(parent, SELECTOR_NAVBAR_NAV)).length) {
-      makeArray(document.body.children)
+      !SelectorEngine.closest(parent, SELECTOR_NAVBAR_NAV)) {
+      [].concat(...document.body.children)
         .forEach(elem => EventHandler.on(elem, 'mouseover', null, noop()))
     }
 
@@ -378,7 +377,8 @@ class Dropdown {
       return
     }
 
-    const toggles = makeArray(SelectorEngine.find(SELECTOR_DATA_TOGGLE))
+    const toggles = SelectorEngine.find(SELECTOR_DATA_TOGGLE)
+
     for (let i = 0, len = toggles.length; i < len; i++) {
       const parent = Dropdown.getParentFromElement(toggles[i])
       const context = Data.getData(toggles[i], DATA_KEY)
@@ -414,7 +414,7 @@ class Dropdown {
       // If this is a touch-enabled device we remove the extra
       // empty mouseover listeners we added for iOS support
       if ('ontouchstart' in document.documentElement) {
-        makeArray(document.body.children)
+        [].concat(...document.body.children)
           .forEach(elem => EventHandler.off(elem, 'mouseover', null, noop()))
       }
 
@@ -472,7 +472,7 @@ class Dropdown {
       return
     }
 
-    const items = makeArray(SelectorEngine.find(SELECTOR_VISIBLE_ITEMS, parent))
+    const items = SelectorEngine.find(SELECTOR_VISIBLE_ITEMS, parent)
       .filter(isVisible)
 
     if (!items.length) {
diff --git a/js/src/modal.js b/js/src/modal.js
index bcf13454fe..ca77359cab 100644
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -12,7 +12,6 @@ import {
   getElementFromSelector,
   getTransitionDurationFromElement,
   isVisible,
-  makeArray,
   reflow,
   typeCheckConfig
 } from './util/index'
@@ -456,7 +455,7 @@ class Modal {
       //   while $(DOMNode).css('padding-right') returns the calculated value or 0 if not set
 
       // Adjust fixed content padding
-      makeArray(SelectorEngine.find(SELECTOR_FIXED_CONTENT))
+      SelectorEngine.find(SELECTOR_FIXED_CONTENT)
         .forEach(element => {
           const actualPadding = element.style.paddingRight
           const calculatedPadding = window.getComputedStyle(element)['padding-right']
@@ -465,7 +464,7 @@ class Modal {
         })
 
       // Adjust sticky content margin
-      makeArray(SelectorEngine.find(SELECTOR_STICKY_CONTENT))
+      SelectorEngine.find(SELECTOR_STICKY_CONTENT)
         .forEach(element => {
           const actualMargin = element.style.marginRight
           const calculatedMargin = window.getComputedStyle(element)['margin-right']
@@ -486,7 +485,7 @@ class Modal {
 
   _resetScrollbar() {
     // Restore fixed content padding
-    makeArray(SelectorEngine.find(SELECTOR_FIXED_CONTENT))
+    SelectorEngine.find(SELECTOR_FIXED_CONTENT)
       .forEach(element => {
         const padding = Manipulator.getDataAttribute(element, 'padding-right')
         if (typeof padding !== 'undefined') {
@@ -496,7 +495,7 @@ class Modal {
       })
 
     // Restore sticky content and navbar-toggler margin
-    makeArray(SelectorEngine.find(`${SELECTOR_STICKY_CONTENT}`))
+    SelectorEngine.find(`${SELECTOR_STICKY_CONTENT}`)
       .forEach(element => {
         const margin = Manipulator.getDataAttribute(element, 'margin-right')
         if (typeof margin !== 'undefined') {
diff --git a/js/src/scrollspy.js b/js/src/scrollspy.js
index dd68ed386e..0f04020f84 100644
--- a/js/src/scrollspy.js
+++ b/js/src/scrollspy.js
@@ -9,7 +9,6 @@ import {
   getjQuery,
   getSelectorFromElement,
   getUID,
-  makeArray,
   typeCheckConfig
 } from './util/index'
 import Data from './dom/data'
@@ -116,7 +115,7 @@ class ScrollSpy {
 
     this._scrollHeight = this._getScrollHeight()
 
-    const targets = makeArray(SelectorEngine.find(this._selector))
+    const targets = SelectorEngine.find(this._selector)
 
     targets
       .map(element => {
@@ -286,7 +285,7 @@ class ScrollSpy {
   }
 
   _clear() {
-    makeArray(SelectorEngine.find(this._selector))
+    SelectorEngine.find(this._selector)
       .filter(node => node.classList.contains(CLASS_NAME_ACTIVE))
       .forEach(node => node.classList.remove(CLASS_NAME_ACTIVE))
   }
@@ -324,7 +323,7 @@ class ScrollSpy {
  */
 
 EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
-  makeArray(SelectorEngine.find(SELECTOR_DATA_SPY))
+  SelectorEngine.find(SELECTOR_DATA_SPY)
     .forEach(spy => new ScrollSpy(spy, Manipulator.getDataAttributes(spy)))
 })
 
diff --git a/js/src/tab.js b/js/src/tab.js
index f7ec299466..29985872c9 100644
--- a/js/src/tab.js
+++ b/js/src/tab.js
@@ -11,7 +11,6 @@ import {
   emulateTransitionEnd,
   getElementFromSelector,
   getTransitionDurationFromElement,
-  makeArray,
   reflow
 } from './util/index'
 import Data from './dom/data'
@@ -85,7 +84,7 @@ class Tab {
 
     if (listElement) {
       const itemSelector = listElement.nodeName === 'UL' || listElement.nodeName === 'OL' ? SELECTOR_ACTIVE_UL : SELECTOR_ACTIVE
-      previous = makeArray(SelectorEngine.find(itemSelector, listElement))
+      previous = SelectorEngine.find(itemSelector, listElement)
       previous = previous[previous.length - 1]
     }
 
@@ -190,7 +189,7 @@ class Tab {
       const dropdownElement = SelectorEngine.closest(element, SELECTOR_DROPDOWN)
 
       if (dropdownElement) {
-        makeArray(SelectorEngine.find(SELECTOR_DROPDOWN_TOGGLE))
+        SelectorEngine.find(SELECTOR_DROPDOWN_TOGGLE)
           .forEach(dropdown => dropdown.classList.add(CLASS_NAME_ACTIVE))
       }
 
diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index b723b1ba83..c493b15eeb 100644
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -13,7 +13,6 @@ import {
   getTransitionDurationFromElement,
   getUID,
   isElement,
-  makeArray,
   noop,
   typeCheckConfig
 } from './util/index'
@@ -301,7 +300,7 @@ class Tooltip {
       // only needed because of broken event delegation on iOS
       // https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
       if ('ontouchstart' in document.documentElement) {
-        makeArray(document.body.children).forEach(element => {
+        [].concat(...document.body.children).forEach(element => {
           EventHandler.on(element, 'mouseover', noop())
         })
       }
@@ -354,7 +353,7 @@ class Tooltip {
     // If this is a touch-enabled device we remove the extra
     // empty mouseover listeners we added for iOS support
     if ('ontouchstart' in document.documentElement) {
-      makeArray(document.body.children)
+      [].concat(...document.body.children)
         .forEach(element => EventHandler.off(element, 'mouseover', noop))
     }
 
diff --git a/js/src/util/index.js b/js/src/util/index.js
index 001201b4bc..c9331e2170 100644
--- a/js/src/util/index.js
+++ b/js/src/util/index.js
@@ -127,14 +127,6 @@ const typeCheckConfig = (componentName, config, configTypes) => {
     })
 }
 
-const makeArray = nodeList => {
-  if (!nodeList) {
-    return []
-  }
-
-  return [].slice.call(nodeList)
-}
-
 const isVisible = element => {
   if (!element) {
     return false
@@ -200,7 +192,6 @@ export {
   isElement,
   emulateTransitionEnd,
   typeCheckConfig,
-  makeArray,
   isVisible,
   findShadowRoot,
   noop,
diff --git a/js/src/util/sanitizer.js b/js/src/util/sanitizer.js
index f86cbe88a6..0f896b2c4b 100644
--- a/js/src/util/sanitizer.js
+++ b/js/src/util/sanitizer.js
@@ -5,8 +5,6 @@
  * --------------------------------------------------------------------------
  */
 
-import { makeArray } from './index'
-
 const uriAttrs = [
   'background',
   'cite',
@@ -103,7 +101,7 @@ export function sanitizeHtml(unsafeHtml, whiteList, sanitizeFn) {
   const domParser = new window.DOMParser()
   const createdDocument = domParser.parseFromString(unsafeHtml, 'text/html')
   const whitelistKeys = Object.keys(whiteList)
-  const elements = makeArray(createdDocument.body.querySelectorAll('*'))
+  const elements = [].concat(...createdDocument.body.querySelectorAll('*'))
 
   for (let i = 0, len = elements.length; i < len; i++) {
     const el = elements[i]
@@ -115,7 +113,7 @@ export function sanitizeHtml(unsafeHtml, whiteList, sanitizeFn) {
       continue
     }
 
-    const attributeList = makeArray(el.attributes)
+    const attributeList = [].concat(...el.attributes)
     const whitelistedAttributes = [].concat(whiteList['*'] || [], whiteList[elName] || [])
 
     attributeList.forEach(attr => {
diff --git a/js/tests/unit/alert.spec.js b/js/tests/unit/alert.spec.js
index 8a3d33dcf8..9372215b65 100644
--- a/js/tests/unit/alert.spec.js
+++ b/js/tests/unit/alert.spec.js
@@ -1,5 +1,5 @@
 import Alert from '../../src/alert'
-import { makeArray, getTransitionDurationFromElement } from '../../src/util/index'
+import { getTransitionDurationFromElement } from '../../src/util/index'
 
 /** Test helpers */
 import { getFixture, clearFixture, jQueryMock } from '../helpers/fixture'
@@ -30,7 +30,7 @@ describe('Alert', () => {
       const button = document.querySelector('button')
 
       button.click()
-      expect(makeArray(document.querySelectorAll('.alert')).length).toEqual(0)
+      expect(document.querySelectorAll('.alert').length).toEqual(0)
     })
 
     it('should close an alert without instantiating it manually with the parent selector', () => {
@@ -43,7 +43,7 @@ describe('Alert', () => {
       const button = document.querySelector('button')
 
       button.click()
-      expect(makeArray(document.querySelectorAll('.alert')).length).toEqual(0)
+      expect(document.querySelectorAll('.alert').length).toEqual(0)
     })
   })
 
@@ -56,7 +56,7 @@ describe('Alert', () => {
       const alert = new Alert(alertEl)
 
       alertEl.addEventListener('closed.bs.alert', () => {
-        expect(makeArray(document.querySelectorAll('.alert')).length).toEqual(0)
+        expect(document.querySelectorAll('.alert').length).toEqual(0)
         expect(spy).not.toHaveBeenCalled()
         done()
       })
@@ -75,7 +75,7 @@ describe('Alert', () => {
       })
 
       alertEl.addEventListener('closed.bs.alert', () => {
-        expect(makeArray(document.querySelectorAll('.alert')).length).toEqual(0)
+        expect(document.querySelectorAll('.alert').length).toEqual(0)
         done()
       })
 
diff --git a/js/tests/unit/collapse.spec.js b/js/tests/unit/collapse.spec.js
index 3122ae6f4b..7eb0f598ec 100644
--- a/js/tests/unit/collapse.spec.js
+++ b/js/tests/unit/collapse.spec.js
@@ -1,6 +1,5 @@
 import Collapse from '../../src/collapse'
 import EventHandler from '../../src/dom/event-handler'
-import { makeArray } from '../../src/util/index'
 
 /** Test helpers */
 import { getFixture, clearFixture, jQueryMock } from '../helpers/fixture'
@@ -139,7 +138,7 @@ describe('Collapse', () => {
       const collapseEl1 = fixtureEl.querySelector('#collapse1')
       const collapseEl2 = fixtureEl.querySelector('#collapse2')
 
-      const collapseList = makeArray(fixtureEl.querySelectorAll('.collapse'))
+      const collapseList = [].concat(...fixtureEl.querySelectorAll('.collapse'))
         .map(el => new Collapse(el, {
           parent,
           toggle: false
diff --git a/js/tests/unit/dom/selector-engine.spec.js b/js/tests/unit/dom/selector-engine.spec.js
index 727f106214..781d0ce1b5 100644
--- a/js/tests/unit/dom/selector-engine.spec.js
+++ b/js/tests/unit/dom/selector-engine.spec.js
@@ -1,5 +1,4 @@
 import SelectorEngine from '../../../src/dom/selector-engine'
-import { makeArray } from '../../../src/util/index'
 
 /** Test helpers */
 import { getFixture, clearFixture } from '../../helpers/fixture'
@@ -29,7 +28,7 @@ describe('SelectorEngine', () => {
 
       const div = fixtureEl.querySelector('div')
 
-      expect(makeArray(SelectorEngine.find('div', fixtureEl))).toEqual([div])
+      expect(SelectorEngine.find('div', fixtureEl)).toEqual([div])
     })
 
     it('should find elements globaly', () => {
@@ -37,7 +36,7 @@ describe('SelectorEngine', () => {
 
       const div = fixtureEl.querySelector('#test')
 
-      expect(makeArray(SelectorEngine.find('#test'))).toEqual([div])
+      expect(SelectorEngine.find('#test')).toEqual([div])
     })
 
     it('should handle :scope selectors', () => {
@@ -52,7 +51,7 @@ describe('SelectorEngine', () => {
       const listEl = fixtureEl.querySelector('ul')
       const aActive = fixtureEl.querySelector('.active')
 
-      expect(makeArray(SelectorEngine.find(':scope > li > .active', listEl))).toEqual([aActive])
+      expect(SelectorEngine.find(':scope > li > .active', listEl)).toEqual([aActive])
     })
   })
 
@@ -75,8 +74,8 @@ describe('SelectorEngine', () => {
       </ul>`
 
       const list = fixtureEl.querySelector('ul')
-      const liList = makeArray(fixtureEl.querySelectorAll('li'))
-      const result = makeArray(SelectorEngine.children(list, 'li'))
+      const liList = [].concat(...fixtureEl.querySelectorAll('li'))
+      const result = SelectorEngine.children(list, 'li')
 
       expect(result).toEqual(liList)
     })
diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js
index 62d0835ee9..c5fbc3a273 100644
--- a/js/tests/unit/modal.spec.js
+++ b/js/tests/unit/modal.spec.js
@@ -1,6 +1,5 @@
 import Modal from '../../src/modal'
 import EventHandler from '../../src/dom/event-handler'
-import { makeArray } from '../../src/util/index'
 
 /** Test helpers */
 import { getFixture, clearFixture, createEvent, jQueryMock } from '../helpers/fixture'
@@ -31,11 +30,11 @@ describe('Modal', () => {
     document.body.classList.remove('modal-open')
     document.body.removeAttribute('style')
     document.body.removeAttribute('data-padding-right')
-    const backdropList = makeArray(document.querySelectorAll('.modal-backdrop'))
 
-    backdropList.forEach(backdrop => {
-      document.body.removeChild(backdrop)
-    })
+    document.querySelectorAll('.modal-backdrop')
+      .forEach(backdrop => {
+        document.body.removeChild(backdrop)
+      })
 
     document.body.style.paddingRight = '0px'
   })
diff --git a/js/tests/unit/popover.spec.js b/js/tests/unit/popover.spec.js
index 1c6cd389c9..acaf0a48c2 100644
--- a/js/tests/unit/popover.spec.js
+++ b/js/tests/unit/popover.spec.js
@@ -1,5 +1,4 @@
 import Popover from '../../src/popover'
-import { makeArray } from '../../src/util/index'
 
 /** Test helpers */
 import { getFixture, clearFixture, jQueryMock } from '../helpers/fixture'
@@ -14,7 +13,7 @@ describe('Popover', () => {
   afterEach(() => {
     clearFixture()
 
-    const popoverList = makeArray(document.querySelectorAll('.popover'))
+    const popoverList = document.querySelectorAll('.popover')
 
     popoverList.forEach(popoverEl => {
       document.body.removeChild(popoverEl)
diff --git a/js/tests/unit/tooltip.spec.js b/js/tests/unit/tooltip.spec.js
index 338638a2d7..ed89315e0b 100644
--- a/js/tests/unit/tooltip.spec.js
+++ b/js/tests/unit/tooltip.spec.js
@@ -1,6 +1,6 @@
 import Tooltip from '../../src/tooltip'
 import EventHandler from '../../src/dom/event-handler'
-import { makeArray, noop } from '../../src/util/index'
+import { noop } from '../../src/util/index'
 
 /** Test helpers */
 import { getFixture, clearFixture, jQueryMock, createEvent } from '../helpers/fixture'
@@ -15,9 +15,7 @@ describe('Tooltip', () => {
   afterEach(() => {
     clearFixture()
 
-    const tooltipList = makeArray(document.querySelectorAll('.tooltip'))
-
-    tooltipList.forEach(tooltipEl => {
+    document.querySelectorAll('.tooltip').forEach(tooltipEl => {
       document.body.removeChild(tooltipEl)
     })
   })
diff --git a/js/tests/unit/util/index.spec.js b/js/tests/unit/util/index.spec.js
index 57ca1a9c73..541c10baa7 100644
--- a/js/tests/unit/util/index.spec.js
+++ b/js/tests/unit/util/index.spec.js
@@ -244,20 +244,6 @@ describe('Util', () => {
     })
   })
 
-  describe('makeArray', () => {
-    it('should convert node list to array', () => {
-      const nodeList = document.querySelectorAll('div')
-
-      expect(Array.isArray(nodeList)).toEqual(false)
-      expect(Array.isArray(Util.makeArray(nodeList))).toEqual(true)
-    })
-
-    it('should return an empty array if the nodeList is undefined', () => {
-      expect(Util.makeArray(null)).toEqual([])
-      expect(Util.makeArray(undefined)).toEqual([])
-    })
-  })
-
   describe('isVisible', () => {
     it('should return false if the element is not defined', () => {
       expect(Util.isVisible(null)).toEqual(false)