test: add test case

react-component · Aug 24, 2023 · d55620c · d55620c
1 parent 7eeb7e0
commit d55620c
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 5 deletions.
diff --git a/tests/common/util.tsx b/tests/common/util.tsx
@@ -20,11 +20,12 @@ export interface HackInfo {
   add?: number;
   more?: number;
   extra?: number;
+  dropdown?: number;
 }
 
 export function getOffsetSizeFunc(info: HackInfo = {}) {
   return function getOffsetSize() {
-    const { container = 50, extra = 10, tabNode = 20, add = 10, more = 10 } = info;
+    const { container = 50, extra = 10, tabNode = 20, add = 10, more = 10, dropdown = 10 } = info;
 
     if (this.classList.contains('rc-tabs-nav')) {
       return container;
@@ -70,9 +71,9 @@ export function getOffsetSizeFunc(info: HackInfo = {}) {
     // if (this.className.includes('rc-tabs-nav-more')) {
     //   return info.more || 10;
     // }
-    // if (this.className.includes('rc-tabs-dropdown')) {
-    //   return info.dropdown || 10;
-    // }
+    if (this.className.includes('rc-tabs-dropdown')) {
+      return dropdown;
+    }
 
     throw new Error(`className not match ${this.className}`);
   };
@@ -81,6 +82,9 @@ export function getOffsetSizeFunc(info: HackInfo = {}) {
 export function btnOffsetPosition() {
   // eslint-disable-next-line @typescript-eslint/no-invalid-this
   const btn = this as HTMLButtonElement;
+  if (!btn.parentNode) {
+    return 0;
+  }
   const btnList = Array.from(btn.parentNode.childNodes).filter(ele =>
     (ele as HTMLElement).className.includes('rc-tabs-tab'),
   );

diff --git a/tests/index.test.tsx b/tests/index.test.tsx
@@ -6,7 +6,7 @@ import React from 'react';
 import Tabs from '../src';
 import type { TabsProps } from '../src/Tabs';
 import type { HackInfo } from './common/util';
-import { getOffsetSizeFunc } from './common/util';
+import { getOffsetSizeFunc, waitFakeTimer } from './common/util';
 
 global.animated = null;
 
@@ -583,4 +583,14 @@ describe('Tabs.Basic', () => {
   it('key could be number', () => {
     render(<Tabs items={[{key: 1 as any, label: 'test'}]} />)
   })
+
+  it('support getIndicatorLength',  async () => {
+    const { container, rerender } = render(getTabs({ getIndicatorLength: 10 }));
+    await waitFakeTimer();
+    expect(container.querySelector('.rc-tabs-ink-bar')).toHaveStyle({ width: '10px' });
+
+    rerender(getTabs({ getIndicatorLength: (origin) => origin - 2 }));
+    await waitFakeTimer();
+    expect(container.querySelector('.rc-tabs-ink-bar')).toHaveStyle({ width: '18px' });
+  })
 });