fix(Sender): use document.execCommand for paste operation to support … #1527
Conversation
|
|
Summary of ChangesHello @Chiaki-xps, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! 此拉取请求旨在解决 Highlights
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
这个 PR 旨在修复 Sender 组件中粘贴操作无法被正确撤销的问题，通过使用 document.execCommand('insertText') 来将粘贴操作加入浏览器的撤销栈。这是一个聪明的解决方案，直接解决了 bug。我的审查主要关注所使用 API 的长期维护性。document.execCommand 是一个已被废弃的 API，未来可能会在浏览器中被移除。我提供了一些建议来降低这种风险，例如添加注释说明情况，以及在开发环境中记录潜在的错误，以提高代码的可维护性和健壮性。
| try { | ||
| success = document.execCommand('insertText', false, cleanText); | ||
| } catch (err) { | ||
| // ignore |
There was a problem hiding this comment.
静默地忽略错误（empty catch block）会使调试变得困难。一个好的实践是至少在开发环境中打印捕获到的错误。
例如：
if (process.env.NODE_ENV !== 'production') {
console.error('`insertText` command failed:', err);
}
|
Note Other AI code review bot(s) detectedCodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review. 📝 WalkthroughWalkthrough尝试在粘贴处理路径中优先使用浏览器的 Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 分钟
诗
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Chiaki-xps
force-pushed
the
fix-sender-paste-undo-behavior
branch
from
bc10156 to
9f64490
Compare
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
packages/x/components/sender/SlotTextArea.tsx (1)
714-732: 粘贴逻辑对 submitType 的处理需要与输入处理保持一致这里的整体设计合理——优先用
document.execCommand('insertText', false, cleanText)让粘贴进入浏览器原生撤销栈，失败时回退到insert路径——但换行清理逻辑存在一个细节不一致：
const cleanText = text.replace(/\n/g, '');无条件移除所有换行符- 而
removeSpecificBRs只在submitType === 'enter'时清理 BR 标签，在submitType === 'shiftEnter'模式下会保留 BR（允许多行）这导致：
submitType === 'enter'模式：手敲和粘贴都是单行 ✓submitType === 'shiftEnter'模式：手敲换行被保留，但粘贴换行被移除 ✗如果产品期望两种模式中的换行处理一致，建议按
submitType条件化cleanText，例如：const cleanText = submitType === 'enter' ? text.replace(/\n/g, '') : text;后续逻辑保持不变，统一使用
cleanText走execCommand+ fallback 即可。建议在shiftEnter模式下手动测试"粘贴多行文本 + Ctrl+Z 撤销"场景，确认当前行为是否符合交互预期。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
packages/x/components/sender/SlotTextArea.tsx(1 hunks)
🧰 Additional context used
🧠 Learnings (1)
📓 Common learnings
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时，需要用中文回复中文评论。该项目的文档支持中英双语。
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时，需要用中文回复中文评论。该项目的文档支持中英双语。
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: build preview
- GitHub Check: size
- GitHub Check: test
Bundle ReportChanges will decrease total bundle size by 1.19MB (-38.98%) ⬇️. This is within the configured threshold ✅ Detailed changes
Affected Assets, Files, and Routes:view changes for bundle: antdx-array-pushAssets Changed:
|
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #1527 +/- ##
=======================================
Coverage 94.69% 94.70%
=======================================
Files 137 137
Lines 3960 3967 +7
Branches 1123 1126 +3
=======================================
+ Hits 3750 3757 +7
Misses 207 207
Partials 3 3 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
1 participant
🤔 这个变动的性质是？
🔗 相关 Issue
💡 需求背景和解决方案
Bug 复现步骤：
问题表现：
并未撤销刚才的“粘贴”操作，而是执行了更早的“撤销剪切”。
结果：粘贴的内容还在，而被剪切的内容又被恢复了，导致文本重复出现在输入框中（即粘贴内容 + 恢复的剪切内容）。
原因分析：
原有的粘贴逻辑拦截了
onPaste事件后，通过手动 DOM 操作插入文本。这种方式不会被浏览器记录到 Undo Stack（撤销栈）中。因此，当用户按 Ctrl+Z 时，浏览器跳过了“粘贴”这一步（因为它不知道），直接撤销了上一步已知的操作（即“剪切”）。解决方案：
在
onPaste事件处理中，优先尝试使用document.execCommand('insertText', false, text)来插入文本。这是一个浏览器原生支持的命令，会自动将操作记录到 Undo/Redo 历史栈中，从而确保 Ctrl+Z 能正确撤销粘贴操作。📝 更新日志
Sendercomponent paste behavior to support native undo/redo properly.Sender组件在粘贴文本后无法正确撤销（Undo）的问题。Summary by CodeRabbit
✏️ Tip: You can customize this high-level summary in your review settings.