From 4eb6074bb76dcb5e8c8d885caceb59d16000ced3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E7=88=B1=E5=90=83=E7=99=BD=E8=90=9D?=
 =?UTF-8?q?=E5=8D=9C?= <smith3816@gmail.com>
Date: Mon, 31 Jul 2023 18:26:33 +0800
Subject: [PATCH] fix: Anchor not trigger `getCurrentAnchor` when scroll
 (#43916)

* docs: update doc

* fix: getCurrentLink not trigger when scroll
---
 components/anchor/Anchor.tsx                |  7 ++++---
 components/anchor/__tests__/Anchor.test.tsx | 23 +++++++++++++++++++--
 components/anchor/index.en-US.md            |  2 +-
 components/anchor/index.zh-CN.md            |  2 +-
 4 files changed, 27 insertions(+), 7 deletions(-)

diff --git a/components/anchor/Anchor.tsx b/components/anchor/Anchor.tsx
index 73bfed9014..0a8e510fca 100644
--- a/components/anchor/Anchor.tsx
+++ b/components/anchor/Anchor.tsx
@@ -216,6 +216,8 @@ const AnchorContent: React.FC<InternalAnchorProps> = (props) => {
   };
 
   const setCurrentActiveLink = useEvent((link: string) => {
+    // FIXME: Seems a bug since this compare is not equals
+    // `activeLinkRef` is parsed value which will always trigger `onChange` event.
     if (activeLinkRef.current === link) {
       return;
     }
@@ -234,14 +236,13 @@ const AnchorContent: React.FC<InternalAnchorProps> = (props) => {
     if (animating.current) {
       return;
     }
-    if (typeof getCurrentAnchor === 'function') {
-      return;
-    }
+
     const currentActiveLink = getInternalCurrentAnchor(
       links,
       targetOffset !== undefined ? targetOffset : offsetTop || 0,
       bounds,
     );
+
     setCurrentActiveLink(currentActiveLink);
   }, [dependencyListItem, targetOffset, offsetTop]);
 
diff --git a/components/anchor/__tests__/Anchor.test.tsx b/components/anchor/__tests__/Anchor.test.tsx
index abc759c03f..7c21c8ec19 100644
--- a/components/anchor/__tests__/Anchor.test.tsx
+++ b/components/anchor/__tests__/Anchor.test.tsx
@@ -560,9 +560,12 @@ describe('Anchor Render', () => {
         { legacyRoot: true },
       );
 
-      expect(onChange).toHaveBeenCalledTimes(1);
-      fireEvent.click(container.querySelector(`a[href="#${hash2}"]`)!);
+      // Should be 2 times:
+      // 1. ''
+      // 2. hash1 (Since `getCurrentAnchor` still return same hash)
       expect(onChange).toHaveBeenCalledTimes(2);
+      fireEvent.click(container.querySelector(`a[href="#${hash2}"]`)!);
+      expect(onChange).toHaveBeenCalledTimes(3);
       expect(onChange).toHaveBeenLastCalledWith(`#${hash2}`);
     });
 
@@ -614,6 +617,22 @@ describe('Anchor Render', () => {
         fireEvent.scroll(window || document);
       }).not.toThrow();
     });
+
+    it('should repeat trigger when scrolling', () => {
+      const getCurrentAnchor = jest.fn();
+      render(
+        <Anchor
+          getCurrentAnchor={getCurrentAnchor}
+          items={[{ key: 'test', href: null as unknown as string, title: 'test' }]}
+        />,
+      );
+
+      for (let i = 0; i < 100; i += 1) {
+        getCurrentAnchor.mockReset();
+        fireEvent.scroll(window || document);
+        expect(getCurrentAnchor).toHaveBeenCalled();
+      }
+    });
   });
 
   describe('horizontal anchor', () => {
diff --git a/components/anchor/index.en-US.md b/components/anchor/index.en-US.md
index 71e0a602e2..48569f3a88 100644
--- a/components/anchor/index.en-US.md
+++ b/components/anchor/index.en-US.md
@@ -31,7 +31,7 @@ For displaying anchor hyperlinks on page and jumping between them.
 <code src="./demo/onChange.tsx">Listening for anchor link change</code>
 <code src="./demo/replace.tsx" iframe="200">Replace href in history</code>
 <code src="./demo/legacy-anchor.tsx" debug>Deprecated JSX demo</code>
-<code src="./demo/component-token.tsx" debug>Component Token</code>
+<code src="./demo/component-token.tsx" iframe="800" debug>Component Token</code>
 
 ## API
 
diff --git a/components/anchor/index.zh-CN.md b/components/anchor/index.zh-CN.md
index f9d2cccbba..2357e9e096 100644
--- a/components/anchor/index.zh-CN.md
+++ b/components/anchor/index.zh-CN.md
@@ -32,7 +32,7 @@ group:
 <code src="./demo/onChange.tsx">监听锚点链接改变</code>
 <code src="./demo/replace.tsx" iframe="200">替换历史中的 href</code>
 <code src="./demo/legacy-anchor.tsx" debug>废弃的 JSX 示例</code>
-<code src="./demo/component-token.tsx" debug>组件 Token</code>
+<code src="./demo/component-token.tsx" iframe="800" debug>组件 Token</code>
 
 ## API