quasar 1.16.3 → 1.17.0

package/src/utils/scroll.js

@@ -1,25 +1,53 @@
 import { isSSR } from '../plugins/Platform.js'
-import { css } from './dom.js'
+import { css, getElement } from './dom.js'
 
-const scrollTargets = isSSR === false
-  ? [ null, document, document.body, document.scrollingElement, document.documentElement ]
-  : []
+const scrollTargets = isSSR === true
+  ? []
+  : [ null, document, document.body, document.scrollingElement, document.documentElement ]
 
-export function getScrollTarget (el, target) {
-  if (typeof target === 'string') {
-    try {
-      target = document.querySelector(target)
-    }
-    catch (err) {
-      target = void 0
-    }
+let rtlHasScrollBugStatus
+export function rtlHasScrollBug () {
+  if (isSSR === true) {
+    return false
   }
 
-  if (target === void 0 || target === null) {
-    target = el.closest('.scroll,.scroll-y,.overflow-auto')
+  if (rtlHasScrollBugStatus === void 0) {
+    const scroller = document.createElement('div')
+    const spacer = document.createElement('div')
+
+    Object.assign(scroller.style, {
+      direction: 'rtl',
+      width: '1px',
+      height: '1px',
+      overflow: 'auto'
+    })
+
+    Object.assign(spacer.style, {
+      width: '1000px',
+      height: '1px'
+    })
+
+    scroller.appendChild(spacer)
+    document.body.appendChild(scroller)
+    scroller.scrollLeft = -1000
+
+    rtlHasScrollBugStatus = scroller.scrollLeft >= 0
+
+    scroller.remove()
   }
-  else if (target._isVue === true && target.$el !== void 0) {
-    target = target.$el
+
+  return rtlHasScrollBugStatus
+}
+
+export function getScrollTarget (el, targetEl) {
+  let target = getElement(targetEl)
+
+  if (target === null) {
+    if (el !== Object(el) || typeof el.closest !== 'function') {
+      return window
+    }
+
+    target = el.closest('.scroll,.scroll-y,.overflow-auto')
   }
 
   return scrollTargets.includes(target)
@@ -35,23 +63,23 @@ export function getScrollWidth (el) {
   return (el === window ? document.body : el).scrollWidth
 }
 
-export function getScrollPosition (scrollTarget) {
-  if (scrollTarget === window) {
-    return window.pageYOffset || window.scrollY || document.body.scrollTop || 0
-  }
-  return scrollTarget.scrollTop
+export function getVerticalScrollPosition (scrollTarget) {
+  return scrollTarget === window
+    ? window.pageYOffset || window.scrollY || document.body.scrollTop || 0
+    : scrollTarget.scrollTop
 }
 
+export const getScrollPosition = getVerticalScrollPosition
+
 export function getHorizontalScrollPosition (scrollTarget) {
-  if (scrollTarget === window) {
-    return window.pageXOffset || window.scrollX || document.body.scrollLeft || 0
-  }
-  return scrollTarget.scrollLeft
+  return scrollTarget === window
+    ? window.pageXOffset || window.scrollX || document.body.scrollLeft || 0
+    : scrollTarget.scrollLeft
 }
 
-export function animScrollTo (el, to, duration = 0 /* , prevTime */) {
-  const prevTime = arguments[3] === void 0 ? performance.now() : arguments[3]
-  const pos = getScrollPosition(el)
+export function animVerticalScrollTo (el, to, duration = 0 /* , prevTime */) {
+  const prevTime = arguments[ 3 ] === void 0 ? performance.now() : arguments[ 3 ]
+  const pos = getVerticalScrollPosition(el)
 
   if (duration <= 0) {
     if (pos !== to) {
@@ -65,13 +93,15 @@ export function animScrollTo (el, to, duration = 0 /* , prevTime */) {
     const newPos = pos + (to - pos) / Math.max(frameTime, duration) * frameTime
     setScroll(el, newPos)
     if (newPos !== to) {
-      animScrollTo(el, to, duration - frameTime, nowTime)
+      animVerticalScrollTo(el, to, duration - frameTime, nowTime)
     }
   })
 }
 
+export const animScrollTo = animVerticalScrollTo
+
 export function animHorizontalScrollTo (el, to, duration = 0 /* , prevTime */) {
-  const prevTime = arguments[3] === void 0 ? performance.now() : arguments[3]
+  const prevTime = arguments[ 3 ] === void 0 ? performance.now() : arguments[ 3 ]
   const pos = getHorizontalScrollPosition(el)
 
   if (duration <= 0) {
@@ -107,14 +137,16 @@ function setHorizontalScroll (scrollTarget, offset) {
   scrollTarget.scrollLeft = offset
 }
 
-export function setScrollPosition (scrollTarget, offset, duration) {
+export function setVerticalScrollPosition (scrollTarget, offset, duration) {
   if (duration) {
-    animScrollTo(scrollTarget, offset, duration)
+    animVerticalScrollTo(scrollTarget, offset, duration)
     return
   }
   setScroll(scrollTarget, offset)
 }
 
+export const setScrollPosition = setVerticalScrollPosition
+
 export function setHorizontalScrollPosition (scrollTarget, offset, duration) {
   if (duration) {
     animHorizontalScrollTo(scrollTarget, offset, duration)
@@ -125,7 +157,7 @@ export function setHorizontalScrollPosition (scrollTarget, offset, duration) {
 
 let size
 export function getScrollbarWidth () {
-  if (size !== undefined) {
+  if (size !== void 0) {
     return size
   }
 
@@ -175,14 +207,14 @@ export function hasScrollbar (el, onY = true) {
       el.scrollHeight > el.clientHeight && (
         el.classList.contains('scroll') ||
         el.classList.contains('overflow-auto') ||
-        ['auto', 'scroll'].includes(window.getComputedStyle(el)['overflow-y'])
+        [ 'auto', 'scroll' ].includes(window.getComputedStyle(el)['overflow-y'])
       )
     )
     : (
       el.scrollWidth > el.clientWidth && (
         el.classList.contains('scroll') ||
         el.classList.contains('overflow-auto') ||
-        ['auto', 'scroll'].includes(window.getComputedStyle(el)['overflow-x'])
+        [ 'auto', 'scroll' ].includes(window.getComputedStyle(el)['overflow-x'])
       )
     )
 }
@@ -194,12 +226,16 @@ export default {
   getScrollWidth,
 
   getScrollPosition,
+  getVerticalScrollPosition,
   getHorizontalScrollPosition,
+  rtlHasScrollBug,
 
   animScrollTo,
+  animVerticalScrollTo,
   animHorizontalScrollTo,
 
   setScrollPosition,
+  setVerticalScrollPosition,
   setHorizontalScrollPosition,
 
   getScrollbarWidth,