Programmatically add webview to react ui element

[digzou]

Hi,
I am posting this question after spending days trying to add a webview dynamically from native code to a LinearLayout created through reactnative. I have provided some code at the end but just to give a brief I'm trying to instantiate and add a webview programmatically to a Layout element created through react native. The Layout object is itself a custom element that extends a ViewGroupManager. I can access the layout element because I am able to remove it's existing children and I'm able to change the layouts background color.

The webview loads a static string with HTML code.

REACT NATIVE PART
Layout element

XYZ_CONTAINER extends ViewGroupManager<ViewGroup> 
{
    public static final String REACT_CLASS = "XYZ_CONTAINER";

    @ReactProp(name = "nativeTag")
    public void setId(LinearLayout layout, int id) {
        layout.setId(id);
    }
}

App.js

<XYZ_CONTAINER nativeTag={49}>
    <Text>Hello</Text>
</ZineOneInlineMessageView>

ANDROID NATIVE

// parentview is instance of XYZ_CONTAINER
parentview.setBackgroundColor(Color.GREEN); // Color gets updated
((ViewGroup) parentview).addView(wv); //But this line fails

// Webview Structure
WebView wv = new WebView(this.context);
wv.setWebViewClient(CUSTOM_CLIENT);
wv.getSettings().setJavaScriptEnabled(true);
wv.addJavascriptInterface(model, varName);
wv.getSettings().setLoadWithOverviewMode(true);
wv.getSettings().setUseWideViewPort(true);
wv.loadDataWithBaseURL(Session.getHost(), this._msgJson, "text/html", "utf-8", null);

There are no specific error logs but I do see some logs every time I run the code :

W/ResourceType: No package identifier when getting name for resource number 0x00000000
W/cr_ChildProcLH: Create a new ChildConnectionAllocator with package name = com.android.chrome, sandboxed = true
I/cr_BrowserStartup: Initializing chromium process, singleProcess=false
W/ResourceType: Failure getting entry for 0x7f1204f5 (t=17 e=1269) (error -2147483647)
    --------- beginning of system
D/EgretLoader: EgretLoader(Context context)
D/EgretLoader: The context is not activity
E/libEGL: validate_display:99 error 3008 (EGL_BAD_DISPLAY)
W/cr_media: Requires BLUETOOTH permission
W/ContentCatcher: Failed to notify a WebView
W/VideoCapabilities: Unrecognized profile 2130706433 for video/avc
    Unrecognized profile 2130706434 for video/avc
W/cr_CrashFileManager: /data/user/0/com.rnsample/cache/WebView/Crash Reports does not exist or is not a directory
W/Utils: could not parse long range '175-174'
W/VideoCapabilities: Unrecognized profile 2130706433 for video/avc
    Unrecognized profile 2130706434 for video/avc
W/VideoCapabilities: Unrecognized profile 2130706433 for video/avc
    Unrecognized profile 2130706434 for video/avc
W/VideoCapabilities: Unrecognized profile/level 0/3 for video/mpeg2
W/VideoCapabilities: Unrecognized profile/level 0/3 for video/mpeg2
W/VideoCapabilities: Unsupported mime video/mp4v-esdp
I/VideoCapabilities: Unsupported profile 4 for video/mp4v-es
W/ContentCatcher: Failed to notify a WebView

Thanks!

[react-native-bot]

We are automatically closing this issue because it does not appear to follow any of the provided issue templates.

👉 Click here if you want to report a reproducible bug or regression in React Native.