fix: fix Firefox scroll bug and improve TextArea tests #72
+50
−8
Conversation
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
Walkthrough本次更改主要涉及在 Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~7 分钟 Assessment against linked issues
Poem
Note ⚡️ Unit Test Generation is now available in beta!Learn more here, or try it out under "Finishing Touches" below. ✨ Finishing Touches
🧪 Generate unit tests
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![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 (2)
src/ResizableTextArea.tsx (1)
69-69: Firefox 检测实现可以优化。当前使用
navigator.userAgent.includes('Firefox')检测 Firefox 浏览器。虽然功能正确，但用户代理字符串检测不够健壮，可能被用户修改或伪造。考虑使用更可靠的特性检测方法：
- const isFirefox = navigator.userAgent.includes('Firefox'); + const isFirefox = typeof InstallTrigger !== 'undefined';或者添加备用检测：
- const isFirefox = navigator.userAgent.includes('Firefox'); + const isFirefox = navigator.userAgent.includes('Firefox') || typeof InstallTrigger !== 'undefined';tests/index.spec.tsx (1)
40-74: 粘贴测试用例实现良好，但可以改进。这个测试用例正确验证了粘贴多行文本后的光标位置处理，与 PR 目标一致。测试模拟了粘贴事件、文本变更和光标设置。
建议以下改进：
- 简化测试逻辑，避免重复的
pasteEvent函数：- const pasteEvent = async () => { - fireEvent.focus(textArea); - - fireEvent.paste(textArea, { - clipboardData, - types: ['text/plain'], - items: [], - }); - - fireEvent.change(textArea, { target: { value: pasteData } }); - textArea.setSelectionRange(pasteData.length, pasteData.length); - - await wait(); - expect(textArea.selectionStart).toBe(pasteData.length); - expect(textArea.selectionEnd).toBe(pasteData.length); - fireEvent.change(textArea, { target: { value: '' } }); - await wait(); - expect(textArea.selectionStart).toBe(0); - expect(textArea.selectionEnd).toBe(0); - }; - - await pasteEvent(); - await pasteEvent(); + fireEvent.focus(textArea); + + fireEvent.paste(textArea, { + clipboardData, + types: ['text/plain'], + items: [], + }); + + fireEvent.change(textArea, { target: { value: pasteData } }); + textArea.setSelectionRange(pasteData.length, pasteData.length); + + await wait(); + expect(textArea.selectionStart).toBe(pasteData.length); + expect(textArea.selectionEnd).toBe(pasteData.length); + + fireEvent.change(textArea, { target: { value: '' } }); + await wait(); + expect(textArea.selectionStart).toBe(0); + expect(textArea.selectionEnd).toBe(0);
- 添加对粘贴内容包含尾随空行的特定测试（根据 issue #54444）：
it('paste text with trailing empty lines should position cursor correctly', async () => { const { container } = render( <TextArea autoSize={{ minRows: 2, maxRows: 6 }} />, ); const textArea = container.querySelector('textarea') as HTMLTextAreaElement; const pasteData = 'line1\nline2\n\n'; // 包含尾随空行 fireEvent.focus(textArea); fireEvent.paste(textArea, { clipboardData: { getData: jest.fn().mockReturnValue(pasteData) }, }); fireEvent.change(textArea, { target: { value: pasteData } }); await wait(); expect(textArea.selectionStart).toBe(pasteData.length); expect(textArea.selectionEnd).toBe(pasteData.length); });
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
src/ResizableTextArea.tsx(2 hunks)tests/index.spec.tsx(2 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
tests/index.spec.tsx (1)
tests/utils.ts (1)
wait(24-31)
🔇 Additional comments (4)
src/ResizableTextArea.tsx (3)
5-5: 代码导入顺序调整合理。将
classNames的导入移到raf之后，保持了导入的一致性。
71-71: Firefox 特定修复逻辑优化得当。添加 Firefox 检测条件避免了在其他浏览器中执行不必要的修复逻辑，这是一个很好的性能优化。只有在 Firefox 浏览器且 textarea 是活动元素时才执行修复。
72-73: 属性解构顺序调整无功能影响。将
scrollTop移到前面的解构顺序调整不会影响功能，这只是代码组织的变化。tests/index.spec.tsx (1)
274-290: 移除不稳定的光标位置断言是明智的选择。注释掉
setSelectionRange的监听和断言可以避免跨浏览器的光标位置差异导致的测试不稳定，改为验证scrollTop等于scrollHeight更加可靠。这与 issue #54444 中提到的浏览器差异问题相符。注释中正确引用了相关 issue，说明了移除这些断言的原因。
17 tasks
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #72 +/- ##
==========================================
- Coverage 99.03% 97.60% -1.44%
==========================================
Files 3 3
Lines 208 209 +1
Branches 63 63
==========================================
- Hits 206 204 -2
- Misses 2 5 +3 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
afc163
pushed a commit
that referenced
this pull request
Jul 28, 2025
|
antd 侧有个用例挂了： |
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.
🤔 This is a ...
🔗 Related Issues
fix ant-design/ant-design#54444
close ant-design/ant-design#54447
close #18
💡 Background and Solution
Input.Textarea cursor position error after pasting text
Listen to onPaste event and recalculate cursor position
📝 Change Log
Summary by CodeRabbit
Bug Fixes
Tests