HTMLElement.offset* by getBoundingClientRect() (#21788)

* Replace element.offet* by getBoundingClientRect()

* Use variable to store BoundingClientRect

* Fix cc issue...

diff --git a/js/src/collapse.js b/js/src/collapse.js
index 28c4493cc5d362ce9025492f1a696d75a72ac35e..ed3c064b1665b5dccec5062914b67e06fc94018a 100644 (file)
--- a/js/src/collapse.js
+++ b/js/src/collapse.js
@@ -211,10 +211,8 @@ const Collapse = (($) => {
       }
 
       const dimension       = this._getDimension()
-      const offsetDimension = dimension === Dimension.WIDTH ?
-        'offsetWidth' : 'offsetHeight'
 
-      this._element.style[dimension] = `${this._element[offsetDimension]}px`
+      this._element.style[dimension] = `${this._element.getBoundingClientRect()[dimension]}px`
 
       Util.reflow(this._element)
 

diff --git a/js/src/modal.js b/js/src/modal.js
index 213434f7706d6ff63a428b87ede89abf6f2fcbbe..9263efd536f3309ef5f6afb57215bcdfcaecf4a6 100644 (file)
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -450,7 +450,7 @@ const Modal = (($) => {
       const scrollDiv = document.createElement('div')
       scrollDiv.className = ClassName.SCROLLBAR_MEASURER
       document.body.appendChild(scrollDiv)
-      const scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth
+      const scrollbarWidth = scrollDiv.getBoundingClientRect().width - scrollDiv.clientWidth
       document.body.removeChild(scrollDiv)
       return scrollbarWidth
     }

diff --git a/js/src/scrollspy.js b/js/src/scrollspy.js
index 66b6080c84f0427058bb48194466aa5bedeacc65..15541b8fffc2d8b523a3ba29dbceb47a5919dca5 100644 (file)
--- a/js/src/scrollspy.js
+++ b/js/src/scrollspy.js
@@ -133,12 +133,15 @@ const ScrollSpy = (($) => {
             target = $(targetSelector)[0]
           }
 
-          if (target && (target.offsetWidth || target.offsetHeight)) {
-            // todo (fat): remove sketch reliance on jQuery position/offset
-            return [
-              $(target)[offsetMethod]().top + offsetBase,
-              targetSelector
-            ]
+          if (target) {
+            const targetBCR = target.getBoundingClientRect()
+            if (targetBCR.width || targetBCR.height) {
+              // todo (fat): remove sketch reliance on jQuery position/offset
+              return [
+                $(target)[offsetMethod]().top + offsetBase,
+                targetSelector
+              ]
+            }
           }
           return null
         })
@@ -198,7 +201,7 @@ const ScrollSpy = (($) => {
 
     _getOffsetHeight() {
       return this._scrollElement === window ?
-          window.innerHeight : this._scrollElement.offsetHeight
+          window.innerHeight : this._scrollElement.getBoundingClientRect().height
     }
 
     _process() {