why react native webview injectedJavascript doesn't work on IOS?

Question

I try to call a function from injectedJavascript of webview , in android it works fine , but on IOS it didn't work , could you help me on that , this is my webview :

<View style={container}>
        <WebView
          javaScriptEnabled={true}
          domStorageEnabled={true}
          injectedJavascript={this.jsCode.bind(this)}
          onNavigationStateChange={this.onNavigationStateChange}
          source={webapp}
          ref="WEBVIEW_REF"
          style={webView}
          decelerationRate="fast"
        />

      </View >

my function is :

jsCode() {
  let linn ='document.querySelector(".spl-bg2").style.color="blue";';
  return linn;
 }

needsleep · Accepted Answer · 2018-09-06 09:07:07Z

1

injectedJavaScript is supposed to be a string that gets evaluated as javascript when the WebView loads so in your case it should work like this

let linn ='document.querySelector(".spl-bg2").style.color="blue";';
return(
  <View style={container}>
    <WebView
      javaScriptEnabled={true}
      domStorageEnabled={true}
      injectedJavaScript ={linn}
      onNavigationStateChange={this.onNavigationStateChange}
      source={webapp}
      ref="WEBVIEW_REF"
      style={webView}
      decelerationRate="fast"
    />
  </View>)

Update

This is a working example of the above, that runs on a website and changes the colour of the first paragraph it finds:

https://snack.expo.io/rJHiavAwX

Have a look at it and maybe you will find your issue. Note that the prop name is injectedJavaScript and not injectedJavascript as you have it in your example.

edited Sep 6, 2018 at 9:07

answered Sep 6, 2018 at 8:29

needsleep

2,73513 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

salmanaacvf Over a year ago

Thanks for ur help , but unfortunately it didn't work , even with adding a single quote to linn ..

needsleep Over a year ago

I've updated my answer by adding a simple snack to demonstrate the functionality . If you're still having problems maybe set up a snack yourself and I will have a look. Good luck!

salmanaacvf Over a year ago

it wroks only if you put a direct link (ex : www.mysite.com) , in my case in source variable I am calling a local file (index.html) that contains links to visit

needsleep Over a year ago

Hm...It works with local html files too... Which makes me think that there is something wrong with the html file you're importing, maybe a javascript error that prevents your code from running. Is there any way to share the imported html file or a part of it?

Collectives™ on Stack Overflow

why react native webview injectedJavascript doesn't work on IOS?

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related