fix(Tabs): incorrect scrollspy position while inside a scroller

src/tabs/index.js

@@ -300,12 +300,14 @@ export default createComponent({
 
     scrollToCurrentContent() {
       if (this.scrollspy) {
-        this.clickedScroll = true;
-        const instance = this.children[this.currentIndex];
-        const el = instance && instance.$el;
+        const target = this.children[this.currentIndex];
+        const el = target?.$el;
+
         if (el) {
-          const to = Math.ceil(getElementTop(el)) - this.scrollOffset;
-          scrollTopTo(to, +this.duration, () => {
+          const to = getElementTop(el, this.scroller) - this.scrollOffset;
+
+          this.clickedScroll = true;
+          scrollTopTo(this.scroller, to, +this.duration, () => {
             this.clickedScroll = false;
           });
         }

src/tabs/utils.ts

@@ -1,5 +1,5 @@
 import { raf, cancelRaf } from '../utils/dom/raf';
-import { getRootScrollTop, setRootScrollTop } from '../utils/dom/scroll';
+import { getScrollTop, setScrollTop } from '../utils/dom/scroll';
 
 let scrollLeftRafId: number;
 
@@ -21,8 +21,14 @@ export function scrollLeftTo(el: HTMLElement, to: number, duration: number) {
   animate();
 }
 
-export function scrollTopTo(to: number, duration: number, cb: Function) {
-  let current = getRootScrollTop();
+export function scrollTopTo(
+  el: HTMLElement,
+  to: number,
+  duration: number,
+  callback: Function
+) {
+  let current = getScrollTop(el);
+
   const isDown = current < to;
   const frames = duration === 0 ? 1 : Math.round((duration * 1000) / 16);
   const step = (to - current) / frames;
@@ -34,12 +40,12 @@ export function scrollTopTo(to: number, duration: number, cb: Function) {
       current = to;
     }
 
-    setRootScrollTop(current);
+    setScrollTop(el, current);
 
     if ((isDown && current < to) || (!isDown && current > to)) {
       raf(animate);
-    } else {
-      cb && cb();
+    } else if (callback) {
+      callback();
     }
   }
 

src/utils/dom/scroll.ts

@@ -65,12 +65,14 @@ export function setRootScrollTop(value: number) {
   setScrollTop(document.body, value);
 }
 
-// get distance from element top to page top
-export function getElementTop(el: ScrollElement) {
+// get distance from element top to page top or scroller top
+export function getElementTop(el: ScrollElement, scroller?: HTMLElement) {
   if (isWindow(el)) {
     return 0;
   }
-  return el.getBoundingClientRect().top + getRootScrollTop();
+
+  const scrollTop = scroller ? getScrollTop(scroller) : getRootScrollTop();
+  return el.getBoundingClientRect().top + scrollTop;
 }
 
 export function getVisibleHeight(el: ScrollElement) {