React-native-render-html: [Bug] Crash on 6.x

[sayem314]

Oath

I swear that I have completed these tasks before submitting:

• [x] I have read the contribution guidelines here: https://git.io/JJ0Pg
• [x] I have read the documentation here: https://git.io/JJcAl
• [x] I have confirmed that this bug has not been reported yet

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”

Bug Report

React Native

info Fetching system and libraries information...
System:
    OS: Linux 5.8 Pop!_OS 20.04 LTS
    CPU: (4) x64 Intel(R) Core(TM) i3-4160 CPU @ 3.60GHz
    Memory: 3.55 GB / 6.74 GB
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 14.15.4 - /tmp/yarn--1611686397311-0.6913527698593382/node
    Yarn: 1.22.5 - /tmp/yarn--1611686397311-0.6913527698593382/yarn
    npm: 6.14.10 - /usr/bin/npm
    Watchman: Not Found
  SDKs:
    Android SDK:
      API Levels: 28, 29, 30
      Build Tools: 28.0.3, 29.0.2, 30.0.2
      Android NDK: Not Found
  IDEs:
    Android Studio: Not Found
  Languages:
    Java: 1.8.0_275 - /usr/bin/javac
    Python: 2.7.18 - /usr/bin/python
  npmPackages:
    @react-native-community/cli: Not Found
    react: 16.13.1 => 16.13.1 
    react-native: 0.63.4 => 0.63.4 
  npmGlobalPackages:
    *react-native*: Not Found

Libraries

• react-native-render-html: ^6.0.0-alpha.10
• react-native-webview: N/A

Devices

• Device 1 emulator (Google Pixel 3)
  
  
  
  • OS: Android 10.0
  
  

Reproducible Demo

https://snack.expo.io/@sayem314/883c7a

[sayem314]

Another warning.

[Wed Jan 27 2021 19:20:46.378]  INFO     Transient Render Tree update:
 •TDocument(tag=html)
  └─•TBlock(tag=body)
    └─•TBlock(tag=div,classes=public)
      └─•TBlock(tag=div,classes=body)
        └─•TBlock(tag=div,classes=d-flex flex-items-baseline border-bottom border-gray py-3)
          ├─•TBlock(tag=span)
          │ └─•TBlock(tag=a,anchor[/rails])
          │   └─•TBlock(tag=img,classes=avatar)
          └─•TBlock(tag=div,classes=d-flex flex-column width-full)
            ├─•TBlock(tag=div)
            │ └─•TBlock(tag=div,classes=d-flex flex-items-baseline)
            │   └─•TBlock(tag=div)
            │     └─•TPhrasing(anonymous)
            │       ├─•TText(tag=a,classes=link-gray-dark no-underline text-bold wb-break-all d-inline-block,data["rails"],anchor[/rails])
            │       ├─•TText(anonymous,data[" made "])
            │       ├─•TText(tag=a,classes=link-gray-dark no-underline text-bold wb-break-all d-inline-block,data["rails/tailwindcss-rails"],anchor[/rails/tailwindcss-rails])
            │       ├─•TText(anonymous,data[" public"])
            │       └─•TPhrasing(tag=span,classes=f6 text-gray-light no-wrap ml-1)
            └─•TBlock(tag=div,classes=Box p-3 my-2)
              └─•TBlock(tag=div)
                ├─•TBlock(tag=div,classes=f4 lh-condensed text-bold text-gray-dark)
                │ └─•TPhrasing(anonymous)
                │   └─•TText(tag=a,classes=link-gray-dark no-underline text-bold wb-break-all d-inline-block,data["rails/tailwindcss-rails"],anchor[/rails/tailwindcss-rails])
                ├─•TBlock(tag=div,classes=dashboard-break-word text-gray mt-1 mb-0 repo-description)
                │ └─•TBlock(tag=p)
                └─•TBlock(tag=p,classes=f6 text-gray mt-2 mb-0)
                  ├─•TPhrasing(anonymous)
                  │ └─•TPhrasing(tag=span,classes=d-inline-block text-gray mr-3)
                  │   └─•TPhrasing(tag=span,classes=ml-0)
                  │     ├─•TText(tag=span,classes=repo-language-color,data[""])
                  │     ├─•TText(anonymous,data[" "])
                  │     └─•TText(tag=span,data["CSS"])
                  ├─•TBlock(tag=span)
                  │ ├─•TBlock(tag=svg,classes=octicon octicon-star mr-1)
                  │ │ └─•TEmpty(tag=path)
                  │ └─•TPhrasing(anonymous)
                  │   └─•TText(anonymous,data["494"])
                  └─•TPhrasing(anonymous)
                    └─•TText(tag=span,data["Updated Jan 27"])

Reproducible Demo

https://snack.expo.io/@sayem314/742275

[jsamr]

@sayem314 Thanks a lot for pointing out that issue. I believe this happens when the list-style-type is not supported by the renderer. In the meantime, I have reworked the list renderer. Please try-out the alpha.11 I have just released!

[sayem314]

New Error!

[jsamr]

@sayem314 Works for me, see https://snack.expo.io/@jsamr/rnrh-453

You need to replace html prop with source={{html}}, see the full changelog here!

EDIT: I agree the error should be more legible, I'll address that in an upcoming release.

[sayem314]

Yes sorry now it's working.

[jsamr]

@sayem314 Thanks again for your feedback, it is with reports like yours that the library can become each day a little bit better. Closing now, but feel free to open new reports if you encounter any issues.