JavaScript not work in webview

[imlooke]

When I use the webview in my project，JavaScript not work in the HTML file，Here my code:
``
`

    import React, { Component } from 'react';
    import {
      StyleSheet,
      Text,
      View,
      WebView,
    } from 'react-native';

    export default class NoteEditor extends Component {
      render() {
        return (
          <WebView 
            style={styles.container} 
            source={require('./editor.html')}
            injectedJavaScript={'function myfunc() { alert(123) };myfunc();'}
            javaScriptEnabled={true}
            startInLoadingState={true}
          />

        );
      }
    };

    const styles = StyleSheet.create({
      container: {
        flex: 1,
      },
    });

`

-I use RN 0.29.2
-in RN 0.27 is ok
what should I do? thanks

[Kureev]

iOS / Android?

[ChinaGoodProgrammer]

me too！

[Kureev]

Just tried on the fresh project:


Corresponding code:

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  WebView,
  View
} from 'react-native';

class example extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to React Native!
        </Text>
        <Text style={styles.instructions}>
          To get started, edit index.ios.js
        </Text>
                <WebView
          automaticallyAdjustContentInsets={false}
          style={{height: 350, width: 300}}
          source={require('./test.html')}
          javaScriptEnabled={true}
          domStorageEnabled={true}
          decelerationRate="normal"
          startInLoadingState={true}
          scalesPageToFit={true}
        />
        <Text style={styles.instructions}>
          Press Cmd+R to reload,{'\n'}
          Cmd+D or shake for dev menu
        </Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

AppRegistry.registerComponent('example', () => example);

[Kureev]

I think you have a problem with styling. Try fixed dimensions and/or adjust your layout. Let me know if it helps.

[Kureev]

Your example with alert also works:


[ChinaGoodProgrammer]

Offline package does not work！

[ChinaGoodProgrammer]

in iOS。

[ChinaGoodProgrammer]

The injection of js code doesn't work in the release environment。

[ChinaGoodProgrammer]

@Kureev

[ChinaGoodProgrammer]

@Kureev
Please help me thank you！

[imlooke]

@Kureev，Android,
I test your code as same, but not work all the time
And I try to update RN to 0.30,not work, too
I even test this in three phones ,dose not work....
android6.0,5.1,4.4,
but in RN 0.27 is work..

[Kureev]

I think the problem is in the release mode. Probably, something is broken in the packager.

[imlooke]

what should I do for this time?back to RN 0.27?,or init a new project?
thanks for your help

[imlooke]

@Kureev,it must be.now I back to 0.27 is not work,too.
**something is broken in the packager.**what should I do to solve this?

[grabbou]

@Kureev shouldn't this issue be converted to StackOverflow?

[Kureev]

@grabbou not sure. Probably, this issue can be reworded to "WebView doesn't work in Release mode".

[namse]

I installed 0.30 with cli command react-native init AwesomeProject, and webview works pretty well even on release offline bundle mode.

[Kureev]

Then I'm about to close this one as far as its fixed in 0.30.

[Kureev]

@facebook-github-bot close

[ghost]

@Kureev tells me to close this issue. If you think it should still be opened let us know why.

[tapradhan]

Javascript in webview is not working in ios after release.but works in debugging mode

[arash-hacker]

#16133
hey guys check my answer
it work with RN >=0.54