react-native-render-html
react-native-render-html copied to clipboard
reactNativeProps not passed to text component
Decision Table
- [X] My issue does not look like “The HTML attribute 'xxx' is ignored” (unless we claim support for it)
- [X] My issue does not look like “The HTML element
<yyy>is not rendered”
Good Faith Declaration
- [X] I have read the HELP document here: https://git.io/JBi6R
- [X] I have read the CONTRIBUTING document here: https://git.io/JJ0Pg
- [X] I have confirmed that this bug has not been reported yet
Description
reactNativeProps or getReactNativeProps aren't passed to react native Text components in custom or extended HTMLElementModel
React Native Information
System:
OS: macOS 12.5.1
CPU: (8) x64 Intel(R) Core(TM) i7-1068NG7 CPU @ 2.30GHz
Memory: 1.41 GB / 32.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 16.13.2 - ~/.nvm/versions/node/v16.13.2/bin/node
Yarn: 1.22.18 - ~/.nvm/versions/node/v16.13.2/bin/yarn
npm: 8.1.2 - ~/.nvm/versions/node/v16.13.2/bin/npm
Watchman: 2022.08.22.00 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.11.3
SDKs:
iOS SDK:
Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5
Android SDK:
API Levels: 27, 29, 30, 31
Build Tools: 28.0.3, 29.0.2, 30.0.2, 31.0.0, 32.0.0
System Images: android-26 | Google APIs Intel x86 Atom, android-29 | Intel x86 Atom_64, android-29 | Google APIs Intel x86 Atom, android-29 | Google Play Intel x86 Atom, android-30 | Google APIs Intel x86 Atom, android-30 | Google Play Intel x86 Atom
Android NDK: Not Found
IDEs:
Android Studio: 2020.3 AI-203.7717.56.2031.7678000
Xcode: 13.4.1/13F100 - /usr/bin/xcodebuild
Languages:
Java: 11.0.10 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: ^17.0.2 => 17.0.2
react-native: ^0.66.4 => 0.66.4
react-native-macos: Not Found
npmGlobalPackages:
*react-native*: Not Found
RNRH Version
6.3.1
Tested Platforms
- [X] Android
- [X] iOS
- [ ] Web
- [ ] MacOS
- [ ] Windows
Reproduction Platforms
- [X] Android
- [X] iOS
- [ ] Web
- [ ] MacOS
- [ ] Windows
Minimal, Reproducible Example
<RenderHtml
source={`<span>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</span>`}
customHTMLElementModels={{
span: defaultHTMLElementModels.span.extend({
reactNativeProps{
text: {
numberOfLines: 1,
},
},
})}
/>
Additional Notes
No response
@Gregoirevda How did you assess that reactNativeProps were not passed? Did you inspect the render tree with an inspector such as Flipper? numberOfLines only works for top-level Text components, not nested ones. This is a known limitation in React Native.
- See also
bypassAnonymousTPhrasingNodesprop: https://meliorence.github.io/react-native-render-html/api/renderhtmlconfig#bypassanonymoustphrasingnodes - Test with latest version, 6.3.4
Happy to take a closer look later on.