title: Debugging WebView in React Native apps
body: <p>I have a React Native App that uses WebView to render an HTML page from the assets. The page has some javascript that does some processing. The problem is that I cannot see the <code>console.log</code> statements from the web view. I have tried the Chrome Remote <a href="https://developers.google.com/web/tools/chrome-devtools/remote-debugging/webviews" rel="noreferrer" title="Remote Debugging WebViews">Remote Debugging WebViews</a></p>
  
  <p>Here's how the code looks like. Note that for Android, I am trying to supply some native props to enable debugging.</p>
  
  <pre><code>import React from 'react';
  import Expo from 'expo';
  import { WebView } from 'react-native';
  
  export default class App extends React.Component {
  
    render() {
      const htmlURL = Expo.Asset.fromModule(require('./assets/index.html')).uri;
      return (
        &lt;WebView nativeConfig={{props: {webContentsDebuggingEnabled: true}}}  
        source={{uri: htmlURL}} /&gt;
      );
    }
  }
  
  
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      backgroundColor: '#fff',
      alignItems: 'center',
      justifyContent: 'center',
    },
  });
  </code></pre>
  
  <p>Any ideas around how that might work will be highly appreciated.</p>