fix: motion configuration does not work properly#53902
Merged
thinkasany merged 10 commits intomasterfrom Jun 6, 2025
Merged
Conversation
|
|
Contributor
📝 WalkthroughSummary by CodeRabbit
## Summary by CodeRabbit
- **测试**
- 统一测试中全局配置的设置方式，新增了辅助函数和组件以禁用动效，提升测试一致性和可维护性。
- 优化了控制台错误监控，减少无关警告对测试输出的干扰。
- 简化了部分测试用例的上下文包装和生命周期管理。
- **文档**
- 公开了全局配置属性接口，便于外部模块访问和类型推断。
## Walkthrough
本次更改主要优化了 ConfigProvider 及其 motion 配置的逻辑。MotionWrapper 组件中引入了 MotionCacheContext 以支持嵌套组件共享 motion 状态，结合上下文和 ref 标志决定是否包裹 MotionProvider。测试用例统一引入禁用 motion 的配置包装器，提升测试一致性。同时，GlobalConfigProps 接口被导出以便外部访问。
## Changes
| 文件/分组 | 变更摘要 |
|-------------------------------------------------------------------|---------------------------------------------------------------------------------------------|
| components/config-provider/MotionWrapper.tsx | 新增 MotionCacheContext，上下文与 ref 结合决定是否包裹 MotionProvider，支持嵌套组件共享状态。 |
| components/config-provider/index.tsx | 为 GlobalConfigProps 接口添加了 export 关键字，提升其模块外部可见性。 |
| components/modal/__tests__/confirm.test.tsx | 引入 configWarp 辅助函数统一配置，所有 ConfigProvider.config 调用改用 configWarp，完善错误抑制。 |
| components/modal/__tests__/hook.test.tsx | 新增 ConfigWarp 组件，所有 contextHolder 测试均用其包裹，统一禁用 motion 的上下文环境。 |
| components/config-provider/__tests__/index.test.tsx | 新增测试验证 motion 配置切换不会导致组件重新挂载。 |
| tests/utils.tsx | 修改 customRender 函数参数类型，允许传入更灵活的 RenderOptions 配置。 |
## Sequence Diagram(s)
```mermaid
sequenceDiagram
participant Parent
participant MotionWrapper
participant MotionCacheContext
participant MotionProvider
participant Children
Parent->>MotionWrapper: 渲染(motion)
MotionWrapper->>MotionCacheContext: 提供 needWrapMotionProvider 状态
MotionWrapper->>MotionProvider: 条件包裹 Children
MotionProvider->>Children: 渲染Assessment against linked issues
Assessment against linked issues: Out-of-scope changesNo out-of-scope changes detected. Suggested reviewers
Poem
|
Contributor
|
|
WalkthroughThis pull request addresses a bug where the motion configuration does not work properly when Changes
|
Contributor
👁 Visual Regression Report for PR #53902 Passed ✅
🎊 Congrats! No visual-regression diff found. 
|
Contributor
size-limit report 📦
|
More templates
commit: |
Bundle ReportChanges will increase total bundle size by 152 bytes (0.0%) ⬆️. This is within the configured threshold ✅ Detailed changes
Affected Assets, Files, and Routes:view changes for bundle: antd.min-array-pushAssets Changed:
|
Deploying ant-design with
|
| Latest commit: |
2b7b1c1
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://12ab0774.ant-design.pages.dev |
| Branch Preview URL: | https://motion.ant-design.pages.dev |
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## master #53902 +/- ##
=========================================
Coverage 100.00% 100.00%
=========================================
Files 774 774
Lines 14023 14027 +4
Branches 3713 3713
=========================================
+ Hits 14023 14027 +4 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
nareshrajkumar866
approved these changes
May 24, 2025
afc163
reviewed
May 31, 2025
zombieJ
reviewed
Jun 4, 2025
zombieJ
reviewed
Jun 4, 2025
zombieJ
reviewed
Jun 4, 2025
Contributor
There was a problem hiding this comment.
Pull Request Overview
This PR fixes motion settings not being applied when nesting multiple ConfigProvider layers by introducing a motion context and updating tests and types accordingly.
- Added a
MotionCacheContextto propagate a “no-motion” flag across nested providers - Updated
MotionWrapperto wrap children withMotionProviderwhen any ancestor disables motion - Refactored modal tests to use a
ConfigWarp/configWarphelper for consistent motion configuration and exportedGlobalConfigPropsfor type safety
Reviewed Changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| components/config-provider/MotionWrapper.tsx | Introduce MotionCacheContext and adjust wrapping logic |
| components/config-provider/index.tsx | Export GlobalConfigProps for external use |
| components/modal/tests/hook.test.tsx | Replace manual motion mocking with ConfigWarp component |
| components/modal/tests/confirm.test.tsx | Replace CSSMotion mock with configWarp global setup |
Comments suppressed due to low confidence (1)
components/modal/tests/hook.test.tsx:27
- [nitpick] Component helpers should start with an uppercase letter. Rename
configWarpin confirm tests toConfigWarpfor consistency, or vice versa in this file.
const ConfigWarp = (conf?: ConfigProviderProps) => {
zombieJ
reviewed
Jun 6, 2025
Member
Author
|
测试结果
|
Contributor
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
tests/utils.tsx (1)
32-33: 类型更改允许覆盖默认包装器，请确认这是预期行为参数类型从
Omit<RenderOptions, 'wrapper'>更改为Partial<RenderOptions>现在允许传递wrapper选项，这将覆盖默认的StrictMode包装器。虽然这为测试提供了更大的灵活性（如在新的动作配置测试中看到的wrapper: undefined!），但也改变了函数的核心行为。请确认这种行为变更是有意为之，并考虑在文档中说明这种覆盖能力。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
components/config-provider/MotionWrapper.tsx(1 hunks)components/config-provider/__tests__/index.test.tsx(2 hunks)tests/utils.tsx(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- components/config-provider/MotionWrapper.tsx
⏰ Context from checks skipped due to timeout of 90000ms (17)
- GitHub Check: test lib/es module (es, 2/2)
- GitHub Check: test lib/es module (es, 1/2)
- GitHub Check: test-react-legacy (17, 2/2)
- GitHub Check: test-react-legacy (17, 1/2)
- GitHub Check: build
- GitHub Check: test-react-legacy (16, 2/2)
- GitHub Check: test-react-legacy (16, 1/2)
- GitHub Check: test-react-latest (dom, 2/2)
- GitHub Check: test-react-latest (dom, 1/2)
- GitHub Check: visual-diff snapshot (2/2)
- GitHub Check: build preview
- GitHub Check: lint
- GitHub Check: visual-diff snapshot (1/2)
- GitHub Check: build
- GitHub Check: size
- GitHub Check: Analyze (javascript)
- GitHub Check: build
🔇 Additional comments (2)
components/config-provider/__tests__/index.test.tsx (2)
10-10: 导入顺序调整Form 导入被移动到 Input 之前，这是一个小的整理性变更。
189-226: 优秀的测试用例验证动作配置修复这个新测试用例很好地验证了 PR 的核心修复：
- 使用
mountTime计数器巧妙地追踪组件重新挂载- 测试了
motion: false -> true -> false的完整状态转换序列- 使用
wrapper: undefined!覆盖默认包装器，与utils.tsx的更改配合使用- 每次状态变更后都断言
mountTime保持为 1，确保没有发生不必要的重新挂载这个测试直接验证了嵌套 ConfigProvider 中动作配置的修复是否有效，完全符合 PR 目标。
zombieJ
approved these changes
Jun 6, 2025
thinkasany
approved these changes
Jun 6, 2025
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
中文版模板 / Chinese template
🤔 This is a ...
🔗 Related Issues
💡 Background and Solution
ConfigProvider 多层嵌套后 motion 失效
📝 Change Log