[bugfix] Tabs: incorrect line position in some cases (#3961)

src/list/index.js

@@ -1,7 +1,8 @@
 import { createNamespace } from '../utils';
-import Loading from '../loading';
+import { isHidden } from '../utils/dom/style';
 import { BindEventMixin } from '../mixins/bind-event';
 import { getScrollEventTarget } from '../utils/dom/scroll';
+import Loading from '../loading';
 
 const [createComponent, bem, t] = createNamespace('list');
 
@@ -78,11 +79,7 @@ export default createComponent({
       const scrollerHeight = scrollerRect.bottom - scrollerRect.top;
 
       /* istanbul ignore next */
-      if (
-        !scrollerHeight ||
-        window.getComputedStyle(el).display === 'none' ||
-        el.offsetParent === null
-      ) {
+      if (!scrollerHeight || isHidden(el)) {
         return false;
       }
 

src/list/test/__snapshots__/demo.spec.js.snap

@@ -15,7 +15,10 @@ exports[`renders demo correctly 1`] = `
         <div class="van-pull-refresh">
           <div class="van-pull-refresh__track" style="transition: 0ms;">
             <div class="van-pull-refresh__head"></div>
-            <div role="feed" class="van-list">
+            <div role="feed" class="van-list" aria-busy="true">
+              <div class="van-list__loading">
+                <div class="van-loading van-loading--circular"><span class="van-loading__spinner van-loading__spinner--circular" style="color: rgb(201, 201, 201); width: 16px; height: 16px;"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span><span class="van-loading__text">加载中...</span></div>
+              </div>
               <div class="van-list__placeholder"></div>
             </div>
           </div>

src/list/test/index.spec.js

@@ -1,14 +1,6 @@
 import List from '..';
 import { mount, later, mockGetBoundingClientRect } from '../../../test/utils';
 
-function mockOffsetParent(el) {
-  Object.defineProperty(el, 'offsetParent', {
-    get() {
-      return {};
-    }
-  });
-}
-
 test('load event', async () => {
   const wrapper = mount(List);
 
@@ -16,8 +8,6 @@ test('load event', async () => {
     wrapper.vm.loading = value;
   });
 
-  mockOffsetParent(wrapper.vm.$el);
-
   await later();
   expect(wrapper.emitted('load')).toBeTruthy();
   expect(wrapper.emitted('input')).toBeTruthy();
@@ -37,8 +27,6 @@ test('error loaded, click error-text and reload', async () => {
     }
   });
 
-  mockOffsetParent(wrapper.vm.$el);
-
   await later();
 
   expect(wrapper.emitted('load')).toBeFalsy();
@@ -70,8 +58,6 @@ test('finished', async () => {
     }
   });
 
-  mockOffsetParent(wrapper.vm.$el);
-
   await later();
   expect(wrapper.emitted('load')).toBeFalsy();
   expect(wrapper.emitted('input')).toBeFalsy();
@@ -114,7 +100,6 @@ test('check the case that scroller is not window', async () => {
   const listRef = wrapper.find({
     ref: 'list'
   });
-  mockOffsetParent(listRef.vm.$el);
 
   await later();
   expect(listRef.emitted('load')).toBeTruthy();
@@ -133,8 +118,6 @@ test('check the direction props', async () => {
     }
   });
 
-  mockOffsetParent(wrapper.vm.$el);
-
   await later();
 
   let children = wrapper.findAll('.van-list > div');