title: react native webview onNavigationStateChange is not a function (when running jest test)
body: <p>I have a <code>import { WebView } from 'react-native-webview';</code> from the react-native-community. Which is implemented in my react-native app like this:</p>
  
  <pre><code>&lt;WebView
    key={ this.state.uri }
    source={{ uri: this.state.signedIn &amp;&amp; this.state.shareUrl || this.state.uri }}
    style={{ width: '100%', height: '100%' }}
    onMessage={this.onMessage}
    onNavigationStateChange={this.setWebViewUrlChanged}
    onLoadEnd={syntheticEvent =&gt; {
      this.setState({ loading: false });
    }}
    onLoadStart={syntheticEvent =&gt; {
      this.setState({ loading: true });
    }}
  /&gt;
  </code></pre>
  
  <p>The onNavigationStateChange prop is called when I, from the running application withing the webview call <code>window.location.realod(url)</code> </p>
  
  <p>My handler function looks like this:</p>
  
  <pre><code>setWebViewUrlChanged = webviewState =&gt; {
    if (webviewState.url !== this.state.initialUrl) {
      this.setState({ uri: webviewState.url });
    }
  };
  </code></pre>
  
  <p>And is tested on phone and emulator, it works perfectly. I have even console logged state before/after and confirmed that state is updated and the function is called.</p>
  
  <p>However, I am trying to test this with jest unit test. </p>
  
  <pre><code>it('should set webview uri', () =&gt; {
    console.log(snap.children[0].children[0].children[0].children[0].props);
    snap.children[0].children[0].children[0].children[0].props.onNavigationStateChange({ url: 'some-new-url' });
    expect(snap.state().uri).toEqual('some-new-url');
  });
  </code></pre>
  
  <p>When running the test I get error:</p>
  
  <blockquote>
    <p>TypeError:
    snap.children[0].children[0].children[0].children[0].props.onNavigationStateChange
    is not a function</p>
  </blockquote>
  
  <p>and from the console.log line above I get the webviews props, where this function is missing: </p>
  
  <pre><code>  { style:
       [ { flex: 1 },
         { backgroundColor: '#ffffff' },
         { width: '100%', height: '100%' } ],
      source:
       { uri: 'https://test-domain.eu.ngrok.io/static/dashboard/index.html' },
      injectedJavaScript: undefined,
      bounces: undefined,
      scrollEnabled: undefined,
      pagingEnabled: undefined,
      cacheEnabled: true,
      decelerationRate: undefined,
      contentInset: undefined,
      automaticallyAdjustContentInsets: undefined,
      hideKeyboardAccessoryView: undefined,
      allowsBackForwardNavigationGestures: undefined,
      incognito: undefined,
      userAgent: undefined,
      onLoadingStart: [Function],
      onLoadingFinish: [Function],
      onLoadingError: [Function],
      onLoadingProgress: [Function],
      onMessage: [Function],
      messagingEnabled: true,
      onShouldStartLoadWithRequest: [Function],
      scalesPageToFit: undefined,
      allowsInlineMediaPlayback: undefined,
      mediaPlaybackRequiresUserAction: undefined,
      dataDetectorTypes: undefined,
      useSharedProcessPool: true,
      allowsLinkPreview: undefined,
      showsHorizontalScrollIndicator: undefined,
      showsVerticalScrollIndicator: undefined,
      directionalLockEnabled: undefined }
  </code></pre>
  
  <p>So in the test rendered webview only the onMessage function is as in my object, but all my onLoadStart/End and the <code>onNavigationStateChange</code> are not rendered.</p>
  
  <p>But these functions that are missing works perfectly fine when project is compiled and running on device. How can I fix this, so that I can include unit tests for these functions?</p>
  
  <p>The snap shot used in the test case is generated like so:</p>
  
  <pre><code>import renderer from 'react-test-renderer';
  
  beforeEach(async () =&gt; {
    snapshot = renderer.create(&lt;App /&gt;);
    snap = snapshot.toJSON();
  });
  </code></pre>