test: useLockScroll whether the element scroll is in the end ant-desi…

…gn#6253

src/utils/tests/use-lock-scroll.test.tsx

@@ -1,11 +1,12 @@
 import React, { useRef } from 'react'
-import { render, fireEvent } from 'testing'
+import { render, fireEvent, renderHook, createEvent } from 'testing'
 import { useLockScroll } from '../use-lock-scroll'
 
 describe('useLockScroll', () => {
-  test('onTouchMove', async () => {
-    const handleTouch = jest.fn()
-    const TestComponent = () => {
+  let TestComponent: React.FC<{ handleTouch?: () => void }>
+
+  beforeEach(() => {
+    TestComponent = (props: { handleTouch?: () => void }) => {
       const divRef = useRef<HTMLDivElement>(null)
 
       useLockScroll(divRef, true)
@@ -15,21 +16,28 @@ describe('useLockScroll', () => {
           ref={divRef}
           data-testid='lock'
           style={{
-            height: 200,
+            height: '200px',
             overflow: 'scroll',
             cursor: 'grab',
             touchAction: 'none',
           }}
-          onTouchMove={handleTouch}
+          onTouchMove={() => props.handleTouch && props.handleTouch()}
         >
           {new Array(10).fill({}).map((_, i) => (
-            <h1 key={i}> Test component {i}</h1>
+            <h1 key={i} style={{ height: '25px' }}>
+              {' '}
+              Test component {i}
+            </h1>
           ))}
         </div>
       )
     }
+  })
 
-    const { getByTestId } = render(<TestComponent />)
+  test('onTouchMove', async () => {
+    const handleTouch = jest.fn()
+
+    const { getByTestId } = render(<TestComponent handleTouch={handleTouch} />)
 
     const testEl = getByTestId('lock')
 
@@ -45,4 +53,46 @@ describe('useLockScroll', () => {
 
     expect(handleTouch).toHaveBeenCalled()
   })
+
+  test('Scroll To Bottom', async () => {
+    const { getByTestId } = render(<TestComponent />)
+
+    const testEl = getByTestId('lock')
+
+    jest.spyOn(testEl, 'scrollHeight', 'get').mockImplementation(() => 200)
+
+    const scrollTop = jest.spyOn(testEl, 'scrollTop', 'get')
+    scrollTop.mockImplementationOnce(() => 150)
+
+    jest.spyOn(testEl, 'getBoundingClientRect').mockImplementation(() => ({
+      height: 20,
+      top: 0,
+      left: 0,
+      x: 0,
+      y: 0,
+      bottom: 0,
+      right: 0,
+      width: 0,
+      toJSON: () => {},
+    }))
+
+    fireEvent.touchStart(testEl, {
+      touches: [{ clientX: 0, clientY: 100 }],
+    })
+
+    const triggerTruthy = fireEvent.touchMove(testEl, {
+      touches: [{ clientX: 0, clientY: 20 }],
+    })
+    // 滚动事件正常触发
+    expect(triggerTruthy).toBeTruthy()
+
+    // 滚动事件被取消
+    scrollTop.mockImplementationOnce(() => 180)
+
+    const triggerFalsy = fireEvent.touchMove(testEl, {
+      touches: [{ clientX: 0, clientY: 10 }],
+    })
+
+    expect(triggerFalsy).toBeFalsy()
+  })
 })