refactor(plugins): improve how we query elements

diff --git a/js/src/carousel.js b/js/src/carousel.js
index d15b5e89882b1baa17801512b10959515212d168..7616e53bb4296f8ad16c777af35066d5bcf40d90 100644 (file)
--- a/js/src/carousel.js
+++ b/js/src/carousel.js
@@ -492,10 +492,11 @@ const Carousel = (($) => {
     .on(Event.CLICK_DATA_API, Selector.DATA_SLIDE, Carousel._dataApiClickHandler)
 
   $(window).on(Event.LOAD_DATA_API, () => {
-    $(Selector.DATA_RIDE).each(function () {
-      const $carousel = $(this)
+    const carousels = [].slice.call(document.querySelectorAll(Selector.DATA_RIDE))
+    for (let i = 0, len = carousels.length; i < len; i++) {
+      const $carousel = $(carousels[i])
       Carousel._jQueryInterface.call($carousel, $carousel.data())
-    })
+    }
   })
 
   /**

diff --git a/js/src/collapse.js b/js/src/collapse.js
index 2c48cf545205a13954abe2db2abb28ef71d8d4ed..e788abbe7b2d4fdcdffa55123311000ef93252fc 100644 (file)
--- a/js/src/collapse.js
+++ b/js/src/collapse.js
@@ -72,11 +72,14 @@ const Collapse = (($) => {
         `[data-toggle="collapse"][href="#${element.id}"],` +
         `[data-toggle="collapse"][data-target="#${element.id}"]`
       ))
-      const tabToggles = $(Selector.DATA_TOGGLE)
-      for (let i = 0; i < tabToggles.length; i++) {
-        const elem = tabToggles[i]
+      const toggleList = [].slice.call(document.querySelectorAll(Selector.DATA_TOGGLE))
+      for (let i = 0, len = toggleList.length; i < len; i++) {
+        const elem = toggleList[i]
         const selector = Util.getSelectorFromElement(elem)
-        if (selector !== null && $(selector).filter(element).length > 0) {
+        const filterElement = [].slice.call(document.querySelectorAll(selector))
+          .filter((foundElem) => foundElem === element)
+
+        if (selector !== null && filterElement.length > 0) {
           this._selector = selector
           this._triggerArray.push(elem)
         }
@@ -123,11 +126,9 @@ const Collapse = (($) => {
       let activesData
 
       if (this._parent) {
-        actives = $.makeArray(
-          $(this._parent)
-            .find(Selector.ACTIVES)
-            .filter(`[data-parent="${this._config.parent}"]`)
-        )
+        actives = [].slice.call(this._parent.querySelectorAll(Selector.ACTIVES))
+          .filter((elem) => elem.getAttribute('data-parent') === this._config.parent)
+
         if (actives.length === 0) {
           actives = null
         }
@@ -216,12 +217,13 @@ const Collapse = (($) => {
         .removeClass(ClassName.COLLAPSE)
         .removeClass(ClassName.SHOW)
 
-      if (this._triggerArray.length > 0) {
-        for (let i = 0; i < this._triggerArray.length; i++) {
+      const triggerArrayLength = this._triggerArray.length
+      if (triggerArrayLength > 0) {
+        for (let i = 0; i < triggerArrayLength; i++) {
           const trigger = this._triggerArray[i]
           const selector = Util.getSelectorFromElement(trigger)
           if (selector !== null) {
-            const $elem = $(selector)
+            const $elem = $([].slice.call(document.querySelectorAll(selector)))
             if (!$elem.hasClass(ClassName.SHOW)) {
               $(trigger).addClass(ClassName.COLLAPSED)
                 .attr('aria-expanded', false)

diff --git a/js/src/dropdown.js b/js/src/dropdown.js
index 7e7dff0755835d3d1259ff7a135e7cf96a5ffe8a..bef8da1a0c1ff9d123df492261db3bf02855fd58 100644 (file)
--- a/js/src/dropdown.js
+++ b/js/src/dropdown.js
@@ -333,8 +333,8 @@ const Dropdown = (($) => {
         return
       }
 
-      const toggles = $.makeArray($(Selector.DATA_TOGGLE))
-      for (let i = 0; i < toggles.length; i++) {
+      const toggles = [].slice.call(document.querySelectorAll(Selector.DATA_TOGGLE))
+      for (let i = 0, len = toggles.length; i < len; i++) {
         const parent = Dropdown._getParentFromElement(toggles[i])
         const context = $(toggles[i]).data(DATA_KEY)
         const relatedTarget = {

diff --git a/js/src/modal.js b/js/src/modal.js
index e8580eb0d21c9565710cba096f6127e34a259461..b091a79b5e84658c38b5028a55c6557affa86608 100644 (file)
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -430,23 +430,26 @@ const Modal = (($) => {
       if (this._isBodyOverflowing) {
         // Note: DOMNode.style.paddingRight returns the actual value or '' if not set
         //   while $(DOMNode).css('padding-right') returns the calculated value or 0 if not set
+        const fixedContent = [].slice.call(document.querySelectorAll(Selector.FIXED_CONTENT))
+        const stickyContent = [].slice.call(document.querySelectorAll(Selector.STICKY_CONTENT))
+        const navbarToggler = [].slice.call(document.querySelectorAll(Selector.NAVBAR_TOGGLER))
 
         // Adjust fixed content padding
-        $(Selector.FIXED_CONTENT).each((index, element) => {
+        $(fixedContent).each((index, element) => {
           const actualPadding = $(element)[0].style.paddingRight
           const calculatedPadding = $(element).css('padding-right')
           $(element).data('padding-right', actualPadding).css('padding-right', `${parseFloat(calculatedPadding) + this._scrollbarWidth}px`)
         })
 
         // Adjust sticky content margin
-        $(Selector.STICKY_CONTENT).each((index, element) => {
+        $(stickyContent).each((index, element) => {
           const actualMargin = $(element)[0].style.marginRight
           const calculatedMargin = $(element).css('margin-right')
           $(element).data('margin-right', actualMargin).css('margin-right', `${parseFloat(calculatedMargin) - this._scrollbarWidth}px`)
         })
 
         // Adjust navbar-toggler margin
-        $(Selector.NAVBAR_TOGGLER).each((index, element) => {
+        $(navbarToggler).each((index, element) => {
           const actualMargin = $(element)[0].style.marginRight
           const calculatedMargin = $(element).css('margin-right')
           $(element).data('margin-right', actualMargin).css('margin-right', `${parseFloat(calculatedMargin) + this._scrollbarWidth}px`)
@@ -461,7 +464,8 @@ const Modal = (($) => {
 
     _resetScrollbar() {
       // Restore fixed content padding
-      $(Selector.FIXED_CONTENT).each((index, element) => {
+      const fixedContent = [].slice.call(document.querySelectorAll(Selector.FIXED_CONTENT))
+      $(fixedContent).each((index, element) => {
         const padding = $(element).data('padding-right')
         if (typeof padding !== 'undefined') {
           $(element).css('padding-right', padding).removeData('padding-right')

diff --git a/js/src/scrollspy.js b/js/src/scrollspy.js
index 90905b05dd800d4180f8d6d27fe3d4d4b9c8c7fc..02cab5372d6d0b4d3fc5413a37c2611ecb9f7ee5 100644 (file)
--- a/js/src/scrollspy.js
+++ b/js/src/scrollspy.js
@@ -225,7 +225,8 @@ const ScrollSpy = (($) => {
         return
       }
 
-      for (let i = this._offsets.length; i--;) {
+      const offsetLength = this._offsets.length
+      for (let i = offsetLength; i--;) {
         const isActiveTarget = this._activeTarget !== this._targets[i] &&
             scrollTop >= this._offsets[i] &&
             (typeof this._offsets[i + 1] === 'undefined' ||
@@ -302,9 +303,10 @@ const ScrollSpy = (($) => {
    */
 
   $(window).on(Event.LOAD_DATA_API, () => {
-    const scrollSpys = $.makeArray($(Selector.DATA_SPY))
+    const scrollSpys = [].slice.call(document.querySelectorAll(Selector.DATA_SPY))
 
-    for (let i = scrollSpys.length; i--;) {
+    const scrollSpysLength = scrollSpys.length
+    for (let i = scrollSpysLength; i--;) {
       const $spy = $(scrollSpys[i])
       ScrollSpy._jQueryInterface.call($spy, $spy.data())
     }

diff --git a/js/src/util.js b/js/src/util.js
index c20678fe0f33ae968ba5e25767af5ba68dc6bcf1..e5521438e28e5ab3b433b2869fbb1bf5cf9a6b69 100644 (file)
--- a/js/src/util.js
+++ b/js/src/util.js
@@ -82,8 +82,7 @@ const Util = (($) => {
       }
 
       try {
-        const $selector = $(document).find(selector)
-        return $selector.length > 0 ? selector : null
+        return document.querySelector(selector) ? selector : null
       } catch (err) {
         return null
       }