Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

React Native Android app that uses websockets is crashing as webview is not loaded #21822

Closed
bakkiraju opened this issue Oct 17, 2018 · 12 comments
Labels
Bug Component: WebView Related to the WebView component. Issue: Author Provided Repro This issue can be reproduced in Snack or an attached project. Platform: Android Android applications. Resolution: Locked This issue was locked by the bot.

Comments

@bakkiraju
Copy link

Environment

Run react-native info in your terminal and paste its contents here.
React Native Environment Info:
System:
OS: Windows 10
CPU: x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz
Memory: 8.46 GB / 31.81 GB
Binaries:
Yarn: 1.9.4 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD
IDEs:
Android Studio: Version 3.1.0.0 AI-173.4907809

Description

Describe your issue in detail. Include screenshots if needed. If this is a regression, let us know.
React native app with WebSockets runs fine on Android Virtual Device, but fails with following error message stack trace on physical android device.Not sure why WebView is in the picture here as I dont explicitly use it
anywhere in the code

" This error can also happen due to a require() error during initialization or failure to call AppRegistry.registerComponent.
E/WebViewFactory: Chromium WebView package does not exist"

"android.webkit.WebViewFactory$MissingWebViewPackageException: Failed to load WebView provider: No WebView installed"

Caused by: android.webkit.WebViewFactory$MissingWebViewPackageException: Failed to load WebView provider: No WebView installed
at android.webkit.WebViewFactory.getWebViewContextAndSetProvider(WebViewFactory.java:319)
at android.webkit.WebViewFactory.getProviderClass(WebViewFactory.java:383)
at android.webkit.WebViewFactory.getProvider(WebViewFactory.java:194)
at android.webkit.CookieManager.getInstance(CookieManager.java:39)
at com.facebook.react.modules.network.ForwardingCookieHandler.getCookieManager(ForwardingCookieHandler.java:161)
at com.facebook.react.modules.network.ForwardingCookieHandler.get(ForwardingCookieHandler.java:59)
at okhttp3.JavaNetCookieJar.loadForRequest(JavaNetCookieJar.java:59)
at com.facebook.react.modules.network.ReactCookieJarContainer.loadForRequest(ReactCookieJarContainer.java:42)
at okhttp3.internal.http.BridgeInterceptor.intercept(BridgeInterceptor.java:84)
at okhttp3.internal.http.RealInterceptorChain.proceed(RealInterceptorChain.java:147)
at okhttp3.internal.http.RetryAndFollowUpInterceptor.intercept(RetryAndFollowUpInterceptor.java:126)
at okhttp3.internal.http.RealInterceptorChain.proceed(RealInterceptorChain.java:147)
at okhttp3.internal.http.RealInterceptorChain.proceed(RealInterceptorChain.java:121)
at okhttp3.RealCall.getResponseWithInterceptorChain(RealCall.java:200)
at okhttp3.RealCall$AsyncCall.execute(RealCall.java:147)
at okhttp3.internal.NamedRunnable.run(NamedRunnable.java:32)
at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1162)
at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:636)
at java.lang.Thread.run(Thread.java:764)

Reproducible Demo

Any React native project using standard out of box websockets.
React native app deployed to device using command
"react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native run-android"

@react-native-bot react-native-bot added Platform: Android Android applications. Component: WebView Related to the WebView component. 🔶Components labels Oct 17, 2018
@radko93
Copy link
Contributor

radko93 commented Oct 17, 2018

Can you create a repro for this? Without it we cannot help.

@bakkiraju
Copy link
Author

bakkiraju commented Oct 18, 2018

Can you create a repro for this? Without it we cannot help.

a sample demo app at https://github.com/bakkiraju/sampleRNWSProj , it reproduces what I am seeing on my end.

Also in my project folder when I do

find . -name WebSocket*

I see

./node_modules/jsdom/lib/jsdom/living/generated/WebSocket.js
./node_modules/jsdom/lib/jsdom/living/websockets/WebSocket-impl-browser.js
./node_modules/jsdom/lib/jsdom/living/websockets/WebSocket-impl.js
./node_modules/react-devtools-core/node_modules/ws/lib/WebSocket.js
./node_modules/react-devtools-core/node_modules/ws/lib/WebSocketServer.js
./node_modules/react-native/Libraries/WebSocket
./node_modules/react-native/Libraries/WebSocket/WebSocket.js
./node_modules/react-native/Libraries/WebSocket/WebSocketEvent.js
./node_modules/react-native/Libraries/WebSocket/WebSocketInterceptor.js
./node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/websocket/WebSocketModule.java
./node_modules/ws/lib/WebSocket.js
./node_modules/ws/lib/WebSocketServer.js

Is is possible that browser implementation of websockets is getting picked which causes the following stack trace on device
image

@radko93 radko93 added the Issue: Author Provided Repro This issue can be reproduced in Snack or an attached project. label Oct 18, 2018
@bakkiraju
Copy link
Author

Looks like the react native generated Android app not using OkHttp implementation, I wrote a native Java Android app using OkHttp and it worked on my device as expected. Any leads from community on how to proceed with debugging this problem is greatly appreciated. Thanks

@dryganets
Copy link
Contributor

react-native uses okhttp WebSockets. The problem root cause is that your device is missing WebView for some reason.

react-native replaces okhttp cookies manager with the android's ForwardingCookieManager which relies on WebView. (Probably to share the cookies with WebView?)

We are seeing this crash in production too. There is only a small fraction of devices have no WebView.

@bakkiraju
Copy link
Author

react-native uses okhttp WebSockets. The problem root cause is that your device is missing WebView for some reason.
Can I side load the missing webview in form of apk using adb or do something equivalent to get past this issue ?

@dryganets
Copy link
Contributor

You need to install it from the AppStore.
I have no idea how did you manage to remove it though.
It is usually impossible to uninstall the WebView app.

@bakkiraju
Copy link
Author

bakkiraju commented Nov 27, 2018

It is usually impossible to uninstall the WebView app.

I dont think I removed it, I got the device from other team,
Is there a way to look into list of apk's or equivalent process to make sure the webview is really absent from my android image ?

Something like

adb shell ps -A

should tell me if webview process is available ?

@dryganets
Copy link
Contributor

adb shell pm list package | grep web

for me output is:
package:com.google.android.webview

@bakkiraju
Copy link
Author

I see chromium webview as well, do you think that is causing the conflict ?

Any idea on how I get get it out of the way and try my react-native app with android.webview

$ adb shell pm list package | grep web
package:com.android.webview
package:org.chromium.webview_shell

@bakkiraju
Copy link
Author

Managed to remove the webshell with following comand

adb shell cmd package uninstall -k --user 0 org.chromium.webview_shell

rebooted the device and

verified that I only have package:android.webview

$ adb shell pm list package | grep web
package:com.android.webview

Ran my react native app again,
I see the same crash I originally had (red screen in report above). So concluding that its not chromium.webview_shell .

Wondering why I keep getting "No WebView Installed" even though I see a webview in the package list, probably got to do with some timing issue where my program is aborting out before the webview could load and become available ?

@dryganets
Copy link
Contributor

dryganets commented Nov 28, 2018

Not sure, you could try to make a simple app which reproduces the issue.

This call is causing the problem:

private CookieManager getCookieManager() {
if (mCookieManager == null) {
possiblyWorkaroundSyncManager(mContext);
mCookieManager = CookieManager.getInstance();
if (USES_LEGACY_STORE) {
mCookieManager.removeExpiredCookie();
}
}

If you are able to repro it on your device with react-native maybe you could make a standalone app doing this call. I'm not sure what is the root cause of this problem.
Maybe it is just a race condition caused by the bad timing, maybe it will be 100% repro on your device this is something you need to experiment with to come up with fix/workaround of the problem.

Options to play with it in react-native code base:

@cpojer
Copy link
Contributor

cpojer commented Mar 19, 2019

This issue has been moved to react-native-webview/react-native-webview#432.

@cpojer cpojer closed this as completed Mar 19, 2019
@facebook facebook locked as resolved and limited conversation to collaborators Mar 19, 2020
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Mar 19, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Bug Component: WebView Related to the WebView component. Issue: Author Provided Repro This issue can be reproduced in Snack or an attached project. Platform: Android Android applications. Resolution: Locked This issue was locked by the bot.
Projects
None yet
Development

No branches or pull requests

6 participants