react-native: [WebView] WebView on android can`t execute javascript

              <WebView
                style={[styles.webview, {
                    height: this.state.height || 400
                }]}
                javaScriptEnabled={true}
                bounces={false}
                onNavigationStateChange={this._onNavigationStateChange}
                html={this._getHTML(content)}
            />

javascript inside WebView page do not execute. On iOS it works fine.

About this issue

Original URL
State: closed
Created 8 years ago
Reactions: 3
Comments: 29 (12 by maintainers)

Most upvoted comments

Set true both javaScriptEnabled and domStorageEnabled

javaScriptEnabled={true}
domStorageEnabled={true}

iineva on Nov 30, 2016

The issue seems to depend on the android SDK version. using 23 fails and it works using version 24 and 25 . this might require more testing on real device like samsung to see if it works on 23 on some real devices.

jpoutrin on Mar 10, 2017

Worked for me by adding baseUrl like this:

nopopon on Jul 26, 2016

on android I got it finally to work after I’ve put semicolon “;” at the end of every command, for example;

this works:

let jsCode = `
      document.body.style.backgroundColor = \'#6DAF45\';

      var menuButton = document.getElementById("responsive-menu-button");
      menuButton.parentNode.removeChild(menuButton);

      var header = document.getElementById("header");
      header.style.visibility = \'hidden\';
      header.style.height = 0;

      var innerBannerArea = document.getElementById("inner-banner-area");
      innerBannerArea.style.height = 1;
      innerBannerArea.style.opacity = 0.0;

      var footer = document.getElementById("footer");
      footer.style.visibility = \'hidden\';
    `

and this breaks the whole javascript, check line 2 in “jsCode” in the variable:

let jsCode = `
      document.body.style.backgroundColor = \'#6DAF45\';

      var menuButton = document.getElementById("responsive-menu-button");
      menuButton.parentNode.removeChild(menuButton)

      var header = document.getElementById("header");
      header.style.visibility = \'hidden\';
      header.style.height = 0;

      var innerBannerArea = document.getElementById("inner-banner-area");
      innerBannerArea.style.height = 1;
      innerBannerArea.style.opacity = 0.0;

      var footer = document.getElementById("footer");
      footer.style.visibility = \'hidden\';
    `

menuButton.parentNode.removeChild(menuButton) <- is missing semicolon

Goran1708 on Mar 7, 2017

I can confirm that WebView Javascript code is not executed on android 4.4.2 device (API 19) and maybe some higher versions of android. Neither inside <script></script> blocks in html, neither inside injectedJavaScript prop. Tried everything described here. I use RN 0.50.0. Have someone faced with this issue and solved it somehow?

ghost on Apr 6, 2018

I’ve figured out Android WebView bug. Even in Android API >= 23 and react-native 0.52. => If your JavaScript code contain any comment => javascript will not run

I have to remove every comments in order for JavaScript to run.

In ios, comments is fine. Android is so weird.

solominh on Mar 31, 2018

I tried to use react-native-webview-android the Javscript inside page didnt execute. But javascript through injectedJavaScript` worked

magicismight on Jan 6, 2016

@satya164 I have tried that. Didnt work. Tried to use injectedJavaScript didnt work either

magicismight on Jan 6, 2016