react / react/react-strict-dom
CSS lineClamp disables text selection on Android
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 3.6k
- Forks
- 206
- PR merge metrics
- No merged PRs in 30d
Description
Describe the issue
Root cause is a bug in React Native for Android (iOS works correctly). When userSelect:'auto' or selectable={true} is used in combination with numberOfLines on a React Native Text, Android clips overflow text rather than using the default ellipsizeMode:'tail'.
The workaround to restore the text overflow ellipsis is to set userSelect:'none' on the text for Android, which comes at the cost of text no longer being selectable.
Expected behavior
Text should be truncated with an ellipsis and remain user-selectable.
Steps to reproduce
React Native 0.75 or below. Android.
<html.span>- style of
lineClamp - text is no longer selectable
Test case
https://snack.expo.dev/rIIwaSlqQ6cHKlcO2Vatn?platform=android
Additional comments
Android hack to fix this https://stackoverflow.com/questions/14691511/textview-using-spannable-ellipsize-doesnt-work/40505388#40505388
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the behavior with the linked Snack on Android using React Native 0.75 or below, then locate the CSS lineClamp handling and its Android Text mapping in this repository. Confirm that selectable text both truncates with an ellipsis and remains selectable; the issue provides no file or test path, so the relevant implementation and regression test still need to be identified.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react-native
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100