Fixes #10964 TextInput maxLength cuts Unicode characters (Emojis) #22463
Conversation
Summary: 1. When maxLength is set on TextInput, and allowedLength is 1, when the user picks an emoji character which length is 2 (or 3, 4), then maxLegnth will call `[@"😁" substringToIndex:1]` which will result in clearing all text already input (issue facebook#10929 [iOS][TextInput] emoji after a new line make the line disappear). 2. Fix for this is to check the existence of emoji characters（NSStringEnumerationByComposedCharacterSequences）and shrink allowedLength, ensure that emoji character was rejected as an unit.
facebook-github-bot
added
the
CLA Signed
Generated by 🚫 dangerJS |
hzxiaosheng
changed the title
react-native-bot
added
🔶Components
Component: Text
Component: TextInput
|
Should we provide first class support for this and actually use the number of characters instead of the number of bytes in the string? This would mean counting characters with [NSString enumerateSubstringsInRange] and compare that to the maxLength instead of using [NSString length]. If we go for this we might want to also update the Android implementation for consistency. |
|
cc @cpojer I think you like emojis |
There was a problem hiding this comment.
@hzxiaosheng Hey, please rebase the branch first, sorry for that, it's our fault.
And I think we need treat any emoji as 1 glyph, so here may wrong, because we still use substring's length to compare with allowedLength.
| // Fix TextInput maxlength cuts Unicode caracters (Emojis) #10964 | ||
| [text enumerateSubstringsInRange:NSMakeRange(0, text.length) options:NSStringEnumerationByComposedCharacterSequences usingBlock:^(NSString * _Nullable substring, NSRange substringRange, NSRange enclosingRange, BOOL * _Nonnull stop){ | ||
| // ensure emoji character was not cut | ||
| if(substringRange.location + substring.length > allowedLength){ |
There was a problem hiding this comment.
@hzxiaosheng Hey, please rebase the branch first, sorry for that, it's our fault.
And I think we need treat any emoji as 1 glyph, so here may wrong, because we still use substring's length to compare with allowedLength.
|
@hzxiaosheng could you rebase and fix up this PR? |
|
@cpojer Seems he/she is inactive recently, if you want to fix ASAP, I'll take over this issue. 😂 |
|
Closing because of inactivity. Feel free to send a PR with a proper fix. |
Fixes #10964
Fixes #10929
Summary:
When maxLength is set on TextInput, and allowedLength is 1, when the user picks an emoji character which length is 2 (or 3, 4), then maxLegnth will call
[@"😁" substringToIndex:1]which will result in clearing all text already input (issue [iOS][TextInput] emoji after a new line make the line disappear #10929 [iOS][TextInput] emoji after a new line make the line disappear).Fix for this is to check the existence of emoji characters（NSStringEnumerationByComposedCharacterSequences）and shrink allowedLength, ensure that emoji character was rejected as an unit.
Test Plan:
Use the RNTester app and navigate to TextInput test page and we can test input emojis in the "TextInput maxLength" section to replay the bug and verify this commit.
Changelog:
[IOS] [BUG] [TextInput] Fixes #10964 TextInput maxLength cuts Unicode characters (Emojis).