fix: Safari Badge scroll number missing (#51598)
Some checks are pending
Publish Any Commit / build (push) Waiting to run
🔀 Sync mirror to Gitee / mirror (push) Waiting to run
✅ test / lint (push) Waiting to run
✅ test / test-react-legacy (16, 1/2) (push) Waiting to run
✅ test / test-react-legacy (16, 2/2) (push) Waiting to run
✅ test / test-react-legacy (17, 1/2) (push) Waiting to run
✅ test / test-react-legacy (17, 2/2) (push) Waiting to run
✅ test / test-node (push) Waiting to run
✅ test / test-react-latest (dom, 1/2) (push) Waiting to run
✅ test / test-react-latest (dom, 2/2) (push) Waiting to run
✅ test / test-react-latest-dist (dist, 1/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist, 2/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist-min, 1/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist-min, 2/2) (push) Blocked by required conditions
✅ test / test-coverage (push) Blocked by required conditions
✅ test / build (push) Waiting to run
✅ test / test lib/es module (es, 1/2) (push) Waiting to run
✅ test / test lib/es module (es, 2/2) (push) Waiting to run
✅ test / test lib/es module (lib, 1/2) (push) Waiting to run
✅ test / test lib/es module (lib, 2/2) (push) Waiting to run
👁️ Visual Regression Persist Start / test image (push) Waiting to run

* fix: Safari Badge scroll number missing

* test: update snapshot
This commit is contained in:
二货爱吃白萝卜 2024-11-13 11:12:39 +08:00 committed by GitHub
parent e713ea1f46
commit 021745f1ab
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 9 additions and 166 deletions

View File

@ -79,23 +79,29 @@ const SingleNumber: React.FC<Readonly<SingleNumberProps>> = (props) => {
unitNumberList.push(index);
}
const unit = prevCount < count ? 1 : -1;
// Fill with number unit nodes
const prevIndex = unitNumberList.findIndex((n) => n % 10 === prevValue);
unitNodes = unitNumberList.map((n, index) => {
// Cut list
const cutUnitNumberList =
unit < 0 ? unitNumberList.slice(0, prevIndex + 1) : unitNumberList.slice(prevIndex);
unitNodes = cutUnitNumberList.map((n, index) => {
const singleUnit = n % 10;
return (
<UnitNumber
{...props}
key={n}
value={singleUnit}
offset={index - prevIndex}
offset={unit < 0 ? index - prevIndex : index}
current={index === prevIndex}
/>
);
});
// Calculate container offset value
const unit = prevCount < count ? 1 : -1;
offsetStyle = {
transform: `translateY(${-getOffset(prevValue, value, unit)}00%)`,
};

View File

@ -305,60 +305,6 @@ exports[`Badge should render when count is changed 1`] = `
>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -900%; left: 0px;"
>
0
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -800%; left: 0px;"
>
1
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -700%; left: 0px;"
>
2
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -600%; left: 0px;"
>
3
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -500%; left: 0px;"
>
4
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -400%; left: 0px;"
>
5
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -300%; left: 0px;"
>
6
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -200%; left: 0px;"
>
7
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -100%; left: 0px;"
>
8
</span>
<span
class="ant-scroll-number-only-unit current"
>
9
</span>
@ -400,60 +346,6 @@ exports[`Badge should render when count is changed 2`] = `
>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -900%; left: 0px;"
>
1
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -800%; left: 0px;"
>
2
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -700%; left: 0px;"
>
3
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -600%; left: 0px;"
>
4
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -500%; left: 0px;"
>
5
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -400%; left: 0px;"
>
6
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -300%; left: 0px;"
>
7
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -200%; left: 0px;"
>
8
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: -100%; left: 0px;"
>
9
</span>
<span
class="ant-scroll-number-only-unit current"
>
0
</span>
@ -495,7 +387,6 @@ exports[`Badge should render when count is changed 3`] = `
>
<span
class="ant-scroll-number-only-unit current"
style=""
>
1
</span>
@ -579,60 +470,6 @@ exports[`Badge should render when count is changed 6`] = `
>
0
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: 100%; left: 0px;"
>
1
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: 200%; left: 0px;"
>
2
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: 300%; left: 0px;"
>
3
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: 400%; left: 0px;"
>
4
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: 500%; left: 0px;"
>
5
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: 600%; left: 0px;"
>
6
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: 700%; left: 0px;"
>
7
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: 800%; left: 0px;"
>
8
</span>
<span
class="ant-scroll-number-only-unit"
style="position: absolute; top: 900%; left: 0px;"
>
9
</span>
</span>
</bdi>
</sup>