reactNativeProps not passed to text component

Gregoirevda commented 2 years ago

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

jsamr commented 1 year ago

@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 bypassAnonymousTPhrasingNodes prop: 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.

dlee commented 6 days ago

I am also running into this bug. Both reactNativeProps and getReactNativeProps fail to pass the props to the underlying component.

meliorence / react-native-render-html