From 26d86fce2a10f5c9e295b0acf5e6381ff21368b4 Mon Sep 17 00:00:00 2001 From: Johann-S Date: Wed, 25 Mar 2020 15:35:02 +0100 Subject: [PATCH] fix: remove make array util function (#30430) --- js/src/carousel.js | 8 ++++---- js/src/collapse.js | 16 ++++++++-------- js/src/dom/selector-engine.js | 9 ++++----- js/src/dropdown.js | 12 ++++++------ js/src/modal.js | 9 ++++----- js/src/scrollspy.js | 7 +++---- js/src/tab.js | 5 ++--- js/src/tooltip.js | 5 ++--- js/src/util/index.js | 9 --------- js/src/util/sanitizer.js | 6 ++---- js/tests/unit/alert.spec.js | 10 +++++----- js/tests/unit/collapse.spec.js | 3 +-- js/tests/unit/dom/selector-engine.spec.js | 11 +++++------ js/tests/unit/modal.spec.js | 9 ++++----- js/tests/unit/popover.spec.js | 3 +-- js/tests/unit/tooltip.spec.js | 6 ++---- js/tests/unit/util/index.spec.js | 14 -------------- 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', () => { ` 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)