Search code examples
reactjsuiwebviewwkwebviewreact-native-iosreact-native-webview

How to enable pop up in Web View?

Currently using "react-native-webview": "^6.11.1" in application. While loading a website, there's a pop up which need to be approved. How can I enable/allow webview to display the pop up?

Tried on a few things:

  1. Setting prop useWebKit to TRUE (WkWebview) and FALSE (UIWebview)
  2. Setting prop onShouldStartLoadWithRequest to return true for every URL

To be more specific, the pop I mentioned looks like below when you run it on Desktop Chrome. There should be one pop up blocker notification requesting you to allow pop up. enter image description here

Solution

  • TLDR;

    Append the following code in RNCWKWebView.m under method didMoveToWindow

    wkWebViewConfig.preferences.javaScriptCanOpenWindowsAutomatically = YES;
wkWebViewConfig.preferences.javaScriptEnabled = YES;

    Btw, im using WKWebView.

    Explanation

    They key here is javaScriptCanOpenWindowsAutomatically which is actually set to NO as default value for iOS according to Apple docs

    The default value is NO in iOS and YES in macOS.

    Setting the this value to YES, indicates whether JavaScript can open windows without user interaction. In this case, I'm tackling with the window.open() function from my website's javascript.