notification
notification copied to clipboard
fix: Clamp duration to setTimeout max value
Problem Description
The setTimeout used in this component has a maximum delay limit. If the duration exceeds this limit, it overflows and triggers immediately (treated as 0ms).
This causes issues for Ant Design's Message and Notification components (CodeSandbox):
import { App } from 'antd';
const { message } = App.useApp();
const maxDuration = Math.pow(2, 31) - 1; // ms
const exceededDuration = maxDuration + 1; // ms
message.info('', maxDuration / 1000); // ✅ Works: within limit, renders normally
message.info('', exceededDuration / 1000); // ❌ Fails: exceeds limit, closes immediately due to overflow
Proposed Solutions
I considered three approaches. This PR implements Option 2. Please let me know if you prefer a different approach.
- Treat overflow as
0: The component will never close (duration = 0) - Clamp to max value: Cap the duration at the maximum valid
setTimeoutlimit (closes after ~25 days) - Support exact duration: Strictly implement the specified duration using recursive
setTimeout
Why not Option 3? It has a low ROI (Return on Investment):
- Complexity: Requires extra code to handle recursion and race conditions
- Rarity: This is an extreme edge case
- Sufficiency: Option 2 is practically sufficient for all real-world use cases
Changes
- [x] Implemented Option 2
- [x] Added test cases
Impact
If the duration for a Message or Notification exceeds the limit:
- Before: The component flashed and disappeared immediately
- After: The duration is clamped to approximately 25 days
Summary by CodeRabbit
Release Notes
-
Bug Fixes
- 通知组件现在会将过长的持续时间限制在最大值,超出时会发出警告提示。
-
Tests
- 新增测试覆盖持续时间限制和警告机制的验证。
✏️ Tip: You can customize this high-level summary in your review settings.