React-native-render-html: WebView deprecated

[mrondra]

Hi, works fine, just WebView is gonna be deprecated, could you please fix it?

Thanks

[dezudas]

+1

[Darvey]

Hi!
The react native doc say about WebView component:

Warning Please use the react-native-community/react-native-webview fork of this component instead. To reduce the surface area of React Native, is going to be removed from the React Native core. For more information, please read The Slimmening proposal.

The WebView component is used to render the iFrames.
waiting for the fix you can try this:

npm install --save react-native-webview
react-native link react-native-webview

then in the plugin folder, go to src/HTMLRenderers.js, remove WebView in {..} 'react-native';
and add this line
import {WebView} from 'react-native-webview';

[dezudas]

works, but is their any plan to make change in the component??

[chr314]

works, but is their any plan to make change in the component??

i created PR #247 2 months ago, still waiting for merge
if you don't want to edit the files you can use the package directly from my fork
in package.json change

"react-native-render-html": "^4.1.2",

to

"react-native-render-html": "git+https://github.com/chr314/react-native-render-html.git",

[Exilz]

I don't have enough time on my hands to maintain this plugin as I'd want to.
I will have to find maintainers at some point, I'll keep you posted on that.

[chr314]

Hey @Exilz
if you can please review the #247 because webview will be extracted from react-native in the next version 0.60 https://github.com/facebook/react-native/releases

the change is very small, have a look when you have time

thanks

[Exilz]

The related PR has been merged into master. Until it's properly reviewed and released on NPM by my colleague, you can make your package.json point towards the latest commit of this repo.

[vincentzierigen]

This is still an issue. On RN 0.60 if you try to embed an iframe, it will crash, as WebView is no longer part of RN.

[loikfb]

This bug was fixed from react-native-webview 5 days ago here https://github.com/react-native-community/react-native-webview/releases/tag/v7.0.1

@Exilz Pleas update your version of react-native-webview asap.

[captaincole]

@chr314 Thanks for the fork and the PR. I pulled from the latest master branch and attempted to pull from your fork but on both occasions when I need to render a webview from inside an HTML tag (what I use for react-native-render-html), it still throws an error.

"RNCWKWebView" was not found in the UIManager

I'm on React Native 61.1

Any thoughts on what might be happening? Are you able to render webviews successfully?

[captaincole]

To solve my problem above, I just wrote a custom renderer for any iframe tags that came in.

export const customRenderer = {
  iframe: (props: {
    class: string;
    type: string;
    width: string;
    height: string;
    src: string;
    allowfullscreen: string;
    style: string;
  }) => (
    <WebView
      style={{
        width: parseInt(props.width.split('px')[0]) || '100%',
        height: parseInt(props.height.split('px')[0]) || 225,
      }}
      source={{uri: props.src}}></WebView>
  ),
};

Follow on note, I had to fork the repo to bring the webview used here into alignment with the webview I use in 61.1 (7.4.0). I can make a PR for the update as everything else seems to work fine.

[jsamr]

I am closing because this issue has been resolved in a recent release.