diff --git a/src/VirtualTable/BodyGrid.tsx b/src/VirtualTable/BodyGrid.tsx index cc1548cc6..e3aa85f49 100644 --- a/src/VirtualTable/BodyGrid.tsx +++ b/src/VirtualTable/BodyGrid.tsx @@ -93,6 +93,17 @@ const Grid = React.forwardRef((props, ref) => { }, }); + // https://github.com/ant-design/ant-design/issues/54734 + Object.defineProperty(obj, 'scrollTop', { + get: () => listRef.current?.getScrollInfo().y || 0, + + set: (value: number) => { + listRef.current?.scrollTo({ + top: value, + }); + }, + }); + return obj; }); diff --git a/tests/Virtual.spec.tsx b/tests/Virtual.spec.tsx index f9170c7d5..2d3843d31 100644 --- a/tests/Virtual.spec.tsx +++ b/tests/Virtual.spec.tsx @@ -6,7 +6,10 @@ import { resetWarned } from 'rc-util/lib/warning'; import React from 'react'; import { VirtualTable, type Reference, type VirtualTableProps } from '../src'; +const identity = (value: any) => value; + global.scrollToConfig = null; +global.collectGetScrollInfoReturn = identity; vi.mock('rc-virtual-list', async () => { const RealVirtualList = ((await vi.importActual('rc-virtual-list')) as any).default; @@ -20,6 +23,10 @@ vi.mock('rc-virtual-list', async () => { global.scrollToConfig = config; return myRef.current.scrollTo(config); }, + getScrollInfo: () => { + const originResult = myRef.current.getScrollInfo(); + return global.collectGetScrollInfoReturn(originResult); + }, })); return ; @@ -59,7 +66,8 @@ describe('Table.Virtual', () => { beforeEach(() => { scrollLeftCalled = false; setScrollLeft.mockReset(); - global.scrollToConfig = null; + global.scrollToConfig = vi.fn(identity); + // global.collectGetScrollInfoReturn.mockReset(); vi.useFakeTimers(); resetWarned(); }); @@ -563,4 +571,26 @@ describe('Table.Virtual', () => { ).toBeTruthy(); }); }); + + /** + * In antd, we need to call the scrollTop method through ref to achieve scrolling. + * see: https://github.com/ant-design/ant-design/issues/54734 + */ + it('should get and set scrollTop correctly', async () => { + const ref = React.createRef(); + + global.collectGetScrollInfoReturn = (origin: any) => ({ + ...origin, + y: 50, + }); + + getTable({ internalRefs: { body: ref } }); + + expect(ref.current.scrollTop).toBe(50); + + ref.current.scrollTop = 200; + expect(global.scrollToConfig).toEqual({ + top: 200, + }); + }); });