Webview showing blank page instead of error page when failed to load

[fschai89]

Description

Webview showing blank page instead of error page (Webpage not available page, just like below image link)when failed to load.

http://i.stack.imgur.com/D3JD7.jpg

Reproduction

Close internet connection and try to load a webpage. Page will fail to load but not showing error page, but showing blank page. Actually it showing an error page but with blink og second it turn into blank page.

Solution

Need to fix it so it showing error page.

Additional Information

• React Native version: [0.37.0]
• Platform: [Android]
• Operating System: [MacOS]

[lacker]

I don't think it is supposed to show an error page when it fails to load - that doesn't seem to be in the spec for webview, for example. Does the underlying platform webview work that way?

[gorjanz]

React Native v.0.42.0

This is my code:

<View style={{ flex: 1, marginBottom: 20 }}>
        <WebView
          source={source}
          style={{ width: width, height: (this.state.height > 0) ? this.state.height + 20 : 0 }}

          javaScriptEnabled
          injectedJavaScript={HEIGHT_CORRECTION_SCRIPT}

          renderLoading={() => <ActivityIndicator size={'small'} />}
          renderError={() => <LoadingError />}

          onLoadEnd={this._onNavigationStateChange}
          onContentSizeChange={this._onNavigationStateChange}
          onNavigationStateChange={this._onNavigationStateChange}
        />
</View>

and I also have this error View, which is <LoadingError /> from above.

<View style={styles.container}>
      <Icon name="ios-warning-outline" size={30} style={styles.icon} />
      <Text style={styles.text}>{ERROR_MESSAGE}</Text>
</View>

When I place a console.log, inside the error view, I get this message in the logs, so it means that it is called. But I never get it shown on the screen. Instead I get some failure page, default one from the webview I guess...

Testing the error, with an iframe with bad url...

Does anyone has any know-how, or can help with, how to get the error view to show up?

[rogerluo410]

renderLoading={() => <ActivityIndicator size={'small'} />}

not work for me, on 0.44.2 for Android

[rogerluo410]

renderLoading={() => <ActivityIndicator size={'small'} />}

not work for me, on 0.44.2 for Android

[hramos]

Hi there! This issue is being closed because it has been inactive for a while. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. Either way, we're automatically closing issues after a period of inactivity. Please do not take it personally!

If you think this issue should definitely remain open, please let us know. The following information is helpful when it comes to determining if the issue should be re-opened:

• Does the issue still reproduce on the latest release candidate? Post a comment with the version you tested.
• If so, is there any information missing from the bug report? Post a comment with all the information required by the issue template.
• Is there a pull request that addresses this issue? Post a comment with the PR number so we can follow up.

If you would like to work on a patch to fix the issue, contributions are very welcome! Read through the contribution guide, and feel free to hop into #react-native if you need help planning your contribution.

[someok]

The problem is not fixed now!

React Native: 0.49.3
iOS: 11.0.3

[davidroman0O]

Same for me!
Not fixed
RN : 0.49.5
Only on Android for me

[twillzy]

-------------------NOT FIXED-----------------------
Bad url does not throw error on Android!

[scriptum]

Faced with same issue. Android API 16. RN 0.55.2

[lorenc-tomasz]

The same issue.

[hpelitebook745G2]

are there any updates? i still face this issue in RN 0.54.4

[danaee123]

The same issue in RN 0.55.4

[Kerita]

Seeing the same issue in RN 0.55.4