react-native-webview/react-native-webview

React Native Cross-Platform WebView

React Native WebView

React Native WebView is a community-maintained WebView component for React Native. It is intended to be a replacement for the built-in WebView (which was removed from core).

Maintainers

Many thanks to these companies for providing us with time to work on open source.
Please note that maintainers spend a lot of free time working on this too so feel free to sponsor them, it really makes a difference.

• Thibault Malbranche (Twitter @titozzz) from Brigad
  Sponsor me ❤️ !

Windows and macOS are managed by Microsoft, notably:

• Alexander Sklar (Twitter @alexsklar) from React Native for Windows
• Chiara Mooney from React Native for Windows @ Microsoft

Shout-out to Jamon Holmgren from Infinite Red for helping a lot with the repo when he had more available time.

Disclaimer

Maintaining WebView is very complex because it is often used for many different use cases (rendering SVGs, PDFs, login flows, and much more). We also support many platforms and both architectures of react-native.

Since WebView was extracted from the React Native core, nearly 500 pull requests have been merged.
Considering that we have limited time, issues will mostly serve as a discussion place for the community, while we will prioritize reviewing and merging pull requests.

Platform compatibility

This project is compatible with iOS, Android, Windows and macOS.
This project supports both the old (paper) and the new architecture (fabric).
This project is compatible with expo.

Getting Started

Read our Getting Started Guide. If any step seems unclear, please create a pull request.

Versioning

This project follows semantic versioning. We do not hesitate to release breaking changes but they will be in a major version.

Usage

Import the WebView component from react-native-webview and use it like so:

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

// ...
const MyWebComponent = () => {
  return <WebView source={{ uri: 'https://reactnative.dev/' }} style={{ flex: 1 }} />;
}

For more, read the API Reference and Guide. If you're interested in contributing, check out the Contributing Guide.

Common issues

• If you're getting Invariant Violation: Native component for "RNCWebView does not exist" it likely means you forgot to run react-native link or there was some error with the linking process
• If you encounter a build error during the task :app:mergeDexRelease, you need to enable multidex support in android/app/build.gradle as discussed in this issue

Contributing

Contributions are welcome, see Contributing.md

License

MIT

Translations

This readme is available in:

• Brazilian portuguese
• French
• Italian

react-native-webview's Issues

webview load some page is incomplete

i used webview to open a url like "https://m.pandafun.io", the page can not display complete.

Environment

OS:  macOS Sierra 10.13.6
Node:  8.9.1
Yarn:  0.24.5
npm:  5.4.0

Packages: (wanted => installed)
react-native: 0.53.0
react: 16.3.1

Steps to Reproduce

1.WebView opens https://m.pandafun.io.

Expected Behavior

the page can display complete.

Actual Behavior

the page can not display complete.

Reproducible Demo

<WebView
  onNavigationStateChange={this.onNavigationStateChange.bind(this)}
  source={{uri:"https://m.pandafun.io"}}
  domStorageEnabled={true}
  javaScriptEnabled={true}
/>

Youtube video in WebView: StatusBar is gone after fullscreen (iOS 12)

• [ x] Review the documentation: https://facebook.github.io/react-native
• [ x] Search for existing issues: https://github.com/facebook/react-native/issues
• [x ] Use the latest React Native release: https://github.com/facebook/react-native/releases

Environment

React Native Environment Info:
System:
OS: macOS High Sierra 10.13.6
CPU: x64 Intel(R) Core(TM) i5-7500 CPU @ 3.40GHz
Memory: 529.69 MB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 8.11.2 - /usr/local/bin/node
Yarn: 1.7.0 - /usr/local/bin/yarn
npm: 6.1.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.0, macOS 10.14, tvOS 12.0, watchOS 5.0
IDEs:
Android Studio: 3.1 AI-173.4907809
Xcode: 10.0/10A255 - /usr/bin/xcodebuild
npmPackages:
react: 16.5.0 => 16.5.0
react-native: 0.57.1 => 0.57.1
npmGlobalPackages:
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7

Description

I'm including a youtube video via a WebView.

Code snippet:

<WebView 
  style={styles.videoWebView}
  source={{uri: 'https://www.youtube.com/embed/tgbNymZ7vqY?playsinline=1'}}
  allowsInlineMediaPlayback={true}
/>

When the video comes back from fullscreen the StatusBar is gone.

This happens since iOS 12. On iOS 11 this problem doesn't occure (technically in iOS 11 there is also a StatusBar disappear problem, but a little bit different, and I would like to focus on iOS 12 only for now).

Reproducible Demo

A react-native project can be found here:
https://github.com/sebk/RN-WebViewTest

MIGRATED: App crashes on startup on select environments (Samsung + Android 7 + outdated system WebView) (#18322)

MIgrated from facebook/react-native#18322

@semekh says:

---

We were seeing a notable amount of crashes on Samsung devices, and after getting hold of a device that kept crashing, we realized that even a freshly react-native inited project crashes on startup.

Environment
Environment:
OS: Linux 4.15
Node: 9.8.0
Yarn: 1.5.1
npm: 5.7.1
Watchman: Not Found
Xcode: N/A
Android Studio: Not Found

Packages: (wanted => installed)
react: ^16.3.0-alpha.1 => 16.3.0-alpha.1
react-native: 0.54.1 => 0.54.1
According to our crash reporter, the crash is limited to Samsung devices running Android 7.0.0.
On these devices, "Android WebView Implementation" is installed with version 0.0.0.1 which looks suspicious.

Workaround
Updating Android WebView Implementation from Play Store fixes the issue.

Stacktrace

android.webkit.MissingWebViewPackageException: Failed to load WebView provider: No WebView installed
    at android.webkit.WebViewFactory.getWebViewContextAndSetProvider(WebViewFactory.java:270)
    at android.webkit.WebViewFactory.getProviderClass(WebViewFactory.java:330)
    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:158)
    at com.facebook.react.modules.network.ForwardingCookieHandler.get(ForwardingCookieHandler.java:56)
    at okhttp3.JavaNetCookieJar.loadForRequest(JavaNetCookieJar.java:59)
    at com.facebook.react.modules.network.ReactCookieJarContainer.loadForRequest(ReactCookieJarContainer.java:40)
    at okhttp3.internal.http.BridgeInterceptor.intercept(BridgeInterceptor.java:84)
    at okhttp3.internal.http.RealInterceptorChain.proceed(RealInterceptorChain.java:92)
    at okhttp3.internal.http.RetryAndFollowUpInterceptor.intercept(RetryAndFollowUpInterceptor.java:120)
    at okhttp3.internal.http.RealInterceptorChain.proceed(RealInterceptorChain.java:92)
    at okhttp3.internal.http.RealInterceptorChain.proceed(RealInterceptorChain.java:67)
    at okhttp3.RealCall.getResponseWithInterceptorChain(RealCall.java:179)
    at okhttp3.RealCall$AsyncCall.execute(RealCall.java:129)
    at okhttp3.internal.NamedRunnable.run(NamedRunnable.java:32)
    at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1133)
    at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:607)
    at java.lang.Thread.run(Thread.java:762)
android.util.AndroidRuntimeException: android.webkit.WebViewFactory$MissingWebViewPackageException: Failed to load WebView provider: No WebView installed
    at android.webkit.WebViewFactory.getProviderClass(WebViewFactory.java:371)
    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:158)
    at com.facebook.react.modules.network.ForwardingCookieHandler.get(ForwardingCookieHandler.java:56)
    at okhttp3.JavaNetCookieJar.loadForRequest(JavaNetCookieJar.java:59)
    at com.facebook.react.modules.network.ReactCookieJarContainer.loadForRequest(ReactCookieJarContainer.java:40)
    at okhttp3.internal.http.BridgeInterceptor.intercept(BridgeInterceptor.java:84)
    at okhttp3.internal.http.RealInterceptorChain.proceed(RealInterceptorChain.java:92)
    at okhttp3.internal.http.RetryAndFollowUpInterceptor.intercept(RetryAndFollowUpInterceptor.java:120)
    at okhttp3.internal.http.RealInterceptorChain.proceed(RealInterceptorChain.java:92)
    at okhttp3.internal.http.RealInterceptorChain.proceed(RealInterceptorChain.java:67)
    at okhttp3.RealCall.getResponseWithInterceptorChain(RealCall.java:179)
    at okhttp3.RealCall$AsyncCall.execute(RealCall.java:129)
    at okhttp3.internal.NamedRunnable.run(NamedRunnable.java:32)
    at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1133)
    at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:607)
    at java.lang.Thread.run(Thread.java:762)

---

More info on original issue thread

MIGRATED: Cookie not working with Payment Geteway. (#20470)

Migrated from facebook/react-native#20470

@abdelhakimkotti says:

---

Environment
React Native Environment Info:
System:
OS: macOS High Sierra
CPU: 2,53 GHz Intel Core i5
Memory: 8 Go 1067 MHz DDR3
IDEs:
Android Studio: Version 3.0
Xcode: Version 9.2

Description
Am implementing party payment gateway in a webview And when the user got redirected to the result page, i got a message saying that "cookies are not enabled in the browser ".
To access the payment pages you need to have enabled cookie.

Code
<WebView
source={{ uri: this.state.url }}
scalesPageToFit={true}
javaScriptEnabled={true}
thirdPartyCookiesEnabled={true}
onNavigationStateChange={this.onNavigationStateChange}
/>
Reproducible Demo
For iOS:
https://developer.apple.com/documentation/foundation/nshttpcookiestorage/1418390-cookies?language=objc

For Android:
https://developer.android.com/reference/java/net/CookieStore

---

MIGRATED: WebView stopLoading no longer working in onNavigationStateChange on Android (#15679)

Migrated from facebook/react-native#15679.

@tss101 says:

---

Environment
Environment:
OS: macOS Sierra 10.12.6
Node: 6.11.2
Yarn: 0.15.1
npm: 3.10.10
Watchman: 4.9.0
Xcode: Xcode 8.2 Build version 8C38
Android Studio: 2.2 AI-145.3537739

Packages: (wanted => installed)
react: 16.2.0 => 16.2.0
react-native: 0.53.3 => 0.53.3 (reproduced in react-native: 0.54.2, 0.55.4)

Steps to Reproduce
Create a Webview in 0.54.0, point it to a url with an embedded youtube video (iframe) or link
Call stopLoading in onNavigationStateChange
Expected Behavior
Newly clicked url stops loading

Actual Behavior
Url keeps loading

Reproducible Demo
export var TestWebContentView = createReactClass( {displayName: 'TestWebContentView',
handleNavigationChange: function(navState) {
console.log(navState)
this.webview.stopLoading();
}
},
render: function() {
return (

<WebView
ref={(ref) => { this.webview = ref; }}
scrollEnabled={false}
source={{uri: 'http://www.simplehtmlguide.com/livedemo.php?e=youtube2' }}
startInLoadingState={false}
mixedContentMode={'always'}
scalesPageToFit={false}
onNavigationStateChange={this.handleNavigationChange}
allowsInlineMediaPlayback={true}
automaticallyAdjustContentInsets={false}
/>

)
}
})
I'm quite stumped by this, since it was working a week or so ago on the same Android device, on react-native 0.44. However, I reverted the react-native version back to 0.44 and it's still not working. Might a Chrome update be responsible? iOS version appears to work.

---

More info in original thread

Duplicate symbol for WKWebView with react native 0.57

Due to the presence of WKWebView class with the same names in both repos, build fails with:

duplicate symbol _OBJC_IVAR_$_RCTWKWebView._webView in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_CLASS_$_RCTWKWebView in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_METACLASS_$_RCTWKWebView in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._onShouldStartLoadWithRequest in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._onLoadingStart in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._injectedJavaScript in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._contentInset in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._automaticallyAdjustContentInsets in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._bounces in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._onLoadingError in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._savedBackgroundColor in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._mediaPlaybackRequiresUserAction in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._allowsInlineMediaPlayback in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._onLoadingFinish in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._delegate in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._decelerationRate in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._onMessage in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._source in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._scrollEnabled in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebView._messagingEnabled in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebView.o)
    /Users/thibault/brigad/fron
t-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebView.o)
duplicate symbol _OBJC_CLASS_$_RCTWKWebViewManager in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebViewManager.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebViewManager.o)
duplicate symbol _OBJC_METACLASS_$_RCTWKWebViewManager in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebViewManager.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebViewManager.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebViewManager._shouldStartLoadLock in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebViewManager.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebViewManager.o)
duplicate symbol _OBJC_IVAR_$_RCTWKWebViewManager._shouldStartLoad in:
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/React/libReact.a(RCTWKWebViewManager.o)
    /Users/thibault/brigad/front-end/packages/service-job-board-mobile/ios/build/Build/Products/DevelopmentDebug-iphonesimulator/react-native-webview/libreact-native-webview.a(RCTWKWebViewManager.o)
ld: 24 duplicate symbols for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)


** BUILD FAILED **

MIGRATED: Pinch-to-Zoom doesn't work without setting scalesPageToFit={true} explicitly on WebView component. (#17005)

Migrated from facebook/react-native#17005.

@ewhitebloom says:

---

Environment
Steps to Reproduce
(Write your steps here:)

Make a WebView Component
Set the source attribute to have a uri value of a PDF.
You'll notice that you can't pinch-to-zoom without explicitly setting scalesPageToFit={true}. Even though the docs say that it is set to true by default, it appears it is not.
Expected Behavior
The pinch-to-zoom behavior should be there without setting scalesPageToFit equal to true, explicitly.

Actual Behavior
Pinch-to-zoom doesn't work without setting the scalesPageToFit explicitly.

---

More info in original thread

Support Android file upload

There are already a lot of forks of the official webview to support that feature, there is no reason not to add it to that repo.

Let review all of them and we can discuss about implementation here.

MIGRATED: The use of postMessage will lead to WebView onLoadStart run Twice (#16547)

Migrated from facebook/react-native#16547.

@TrustTheBoy says:

---

Environment
OS: macOS Sierra 10.12.6
Node: v7.10.0
Yarn: 0.27.5
npm: 4.2.0
Watchman: 4.7.0
Xcode: Xcode Version 9.1 beta (9B37)
Android Studio: 2.3
react-native: 0.48.4
react: 16.0.0-alpha.12
Target Platform: iOS (8-11.1) android(4.4.4-8.0)

Steps to Reproduce
messtest = e => {
const message = e.nativeEvent.data
alert(message)
}
<WebView
ref={w => this.webview = w}
source={{uri:jumpUrl}}
onMessage={this.messtest}
domStorageEnabled={true}
javaScriptEnabled={true}
startInLoadingState={true}
dataDetectorTypes="none"
onLoadEnd={()=>{
console.log('load end... onLoadEnd function');
}}
onLoadStart={()=>{
console.log('load start..');
}}
renderLoading={this._renderLoading}
//onNavigationStateChange={this.onNavigationStateChange}
/>

Expected Behavior
LoadStart should be executed before loadEnd,As you can see from the diagram, load end... re executes load start, and then does not execute load end, which causes the state to be updated. It has always been load start

---

More info in original issue thread

Can not saved images on Webview.

Can not saved images on Webview.
Long tap does not display the menu.
Please fix this.

I asked a question here.
expo/expo#2236

Get LocalStorage from WebView

Is there any way to get localStorage/sessionStorage itens from <WebView /> loaded site ?

Injected Javascript works only with the initial page of Webview

Environment

React Native Environment Info:
System:
OS: macOS 10.14
CPU: x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
Memory: 30.01 MB / 8.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 8.11.4 - /usr/local/bin/node
npm: 5.6.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.0, macOS 10.14, tvOS 12.0, watchOS 5.0
Android SDK:
Build Tools: 23.0.1, 25.0.0, 25.0.3, 26.0.2, 26.0.3, 27.0.0, 27.0.3
API Levels: 19, 22, 23, 24, 25, 26, 27
IDEs:
Android Studio: 3.1 AI-173.4720617
Xcode: 10.0/10A255 - /usr/bin/xcodebuild
npmPackages:
react: 16.5.0 => 16.5.0
react-native: 0.57.0 => 0.57.0
npmGlobalPackages:
create-react-native-app: 1.0.0
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7
react-native-rename: 2.2.2

Description

Javascript Injection works proper with source I provided like example.com . But when I go to another page like example.com/shop InjectedJavascript doesn't work in Android. I tried with different classes in html and different js codes. The result is same.

Reproducible Demo

Here is my Webview configuration, you can try

// lcb-navigation is a div class in the source I provided. It works.
const hideLcb = "var h=document.getElementsByClassName('lcb-navigation')[0];h.style.display='none';"

//card class is in the next page. Does not work.
const hideCard = "var x=document.getElementsByClassName('card')[0];x.style.display='none';"

const injectJS = hideLcb+hideCard

<WebView style={{flex:1}}
          useWebKit={true} // This is for iOS
          source={{uri: 'https://5te5.sozlerkosku.com/'}}
          javaScriptEnabled={true}
          domStorageEnabled={true}
          startInLoadingState={true}
          injectedJavaScript={injectJS}
        />
//The account for testing
//user : [email protected]
//pass:  testacc

MIGRATED: onMessage listener conflict with window.postMessage to iFrame (#19866)

Migrated from facebook/react-native#19866

@danielang says:

---

Environment
Environment:
OS: macOS Sierra 10.12.6
Node: 8.11.3
Yarn: 1.7.0
npm: 5.6.0
Watchman: 4.9.0
Xcode: Xcode 9.2 Build version 9C40b
Android Studio: 3.1 AI-173.4670197

Packages: (wanted => installed)
react: 16.3.2 => 16.3.2
react-native: 0.55.4 => 0.55.4

Description
This issue affects both iOS and Android.

The issue relates to how using onMessage on WebView appears to affect post messages from the actual web app which wants to send out messages to an iFrame.
It appears the listeners which is being picked up by react native app isn't being picked up within the web page itself - as if the onMessage is conflicting with natural behaviour within the web page.

Example wise, any simple WebView with onMessage prop and handler defined.
A web page which has its own postMessage e.g.

window.postMessage('example message', origin);
where origin is simply the origin of the url.

Is there reason for this potential conflict and why react native is not respecting the origin? Disabling onMessage on the web view works for the iFrame perfectly.

Reproducible Demo
This demo shows two WebViews (content from playbuzz.com) with the exact same configuration. But one has onMessage set.
https://snack.expo.io/HyG0CXAZm

---

Also related to facebook/react-native#18546.

MIGRATED: WebView not scrollable when under ScrollView

Migrated from facebook/react-native#20347.

@mehulmpt says:

---

Environment
React Native Environment Info:
System:
OS: macOS High Sierra 10.13.3
CPU: x64 Intel(R) Core(TM) i5-5250U CPU @ 1.60GHz
Memory: 29.76 MB / 8.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 8.1.4 - /usr/local/bin/node
npm: 4.6.1 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
IDEs:
Android Studio: 3.1 AI-173.4720617
Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
npmPackages:
react: ^16.4.1 => 16.4.1
react-native: ^0.56.0 => 0.56.0
npmGlobalPackages:
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7
react-native-rename: 2.2.2
Description
WebView component when placed under ScrollView loses its ability to scroll content. However, if scrollEnabled={false} is passed to ScrollView, WebView is scrollable again.

Reproducible Demo
This render function would suffice:

export default class App extends Component {
  render() {
    return (
      <ScrollView contentContainerStyle={{ flexGrow: 1 }}>
        <WebView source={{ uri: 'http://localhost/somepage-with-scrollable-content' }}
                 style={{ height: 300 }}/> {/* this webview is not scrollable now */}
      </ScrollView>)
  }
}

This has also been mentioned in issue #10723 but it was closed without any solution

---

MIGRATED: Some of webpages are not properly scaled when startInLoadingState is set to true (#20616)

Migrated from facebook/react-native#20616.

@kyo504 says:

---

If startInLoadingState is set to true in WebView component, layout is broken for some web pages.

---

More info in original thread

MIGRATED: Android performance issue when using large webviews (#19112)

Migrated from facebook/react-native#19112.

@Athaphian says:

---

When using a webview that has a large height, for example 5000, the performance is drastically reduced. Scrolling in the webview or a surrounding ScrollView becomes unbearably slow.

When the webview has a height of 100%, the scrolling occurs within the webview itself and everything works fine. It's just webviews that have a huge outer height make everything slow.

This example demonstrates the behaviour. It only occurs on android. On IOS, webviews like this are still blazing fast.

<View style={{height: 5000}}> <WebView source={{uri: 'https://en.wikipedia.org/wiki/Financial_crisis'}} style={{ height: 5000, width: '100%' }} />

Environment
Environment:
OS: macOS High Sierra 10.13.4
Node: 9.2.0
Yarn: 1.2.1
npm: 5.6.0
Watchman: 4.7.0
Xcode: Xcode 9.3 Build version 9E145
Android Studio: 2.3 AI-162.4069837

Packages: (wanted => installed)
react: 16.2.0 => 16.2.0
react-native: 0.53.0 => 0.53.0

Steps to Reproduce
See the code example above. Put this code in a simple component and try to scroll through the wikipedia page on an android device and ios device. On ios it will scroll fluently, while on android it will be sluggish and non responsive.

Expected Behavior
On android I expect no performance penalty when using webviews with a large height, just as it has no performance penalty on ios devices.

Actual Behavior
On android all swipe / scroll gestures become slow to a point that we cannot give this functionality to a user.

---

More info in original issue thread

MIGRATED: unable to load local assets or from CDNs along with window.postMessage not working in iOS release build (#20226)

Migrated from facebook/react-native#20226.

@sja1n says:

---

Environment
React Native Environment Info:
System:
OS: macOS High Sierra 10.13.5
CPU: x64 Intel(R) Core(TM) i5-5350U CPU @ 1.80GHz
Memory: 310.16 MB / 8.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 8.11.1 - /usr/local/bin/node
Yarn: 1.5.1 - /usr/local/bin/yarn
npm: 5.6.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
Android SDK:
Build Tools: 26.0.3, 27.0.3
API Levels: 26, 27
IDEs:
Android Studio: 3.1 AI-173.4819257
Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
npmPackages:
react: 16.4.1 => 16.4.1
react-native: ^0.56.0 => 0.56.0
npmGlobalPackages:
create-react-native-app: 1.0.0
react-native-cli: 2.0.1

Description
I am using webview to display chart for my app using chartjs and jquery library I am able to view charts fine in iOS debug mode but in release config, all I get is a white screen, I tried to check if atleast window.postMessage was working using setinterval code in my .html file, but I dont get any response from webview.

To check for window.postMessage I have also tried to possible solution from issue , still its not working

I have tried to inject the complete html code as well instead of serving the html as local asset file, still not success.

This issue is only present in iOS, works perfectly fine for android.

---

MIGRATED: Issue with window.postmessage on Android webview only when debug is not turned on. (#20714)

Migrated from facebook/react-native#20714.

@mattdwardle says:

---

Environment
React Native Environment Info:
System:
OS: macOS High Sierra 10.13.6
CPU: x64 Intel(R) Core(TM) i7-4870HQ CPU @ 2.50GHz
Memory: 944.55 MB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 10.6.0 - /usr/local/bin/node
npm: 6.3.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
Android SDK:
Build Tools: 19.1.0, 20.0.0, 21.1.2, 22.0.1, 23.0.1, 23.0.2, 23.0.3, 24.0.0, 24.0.1, 25.0.0, 25.0.1, 25.0.2, 26.0.0, 26.0.1, 26.0.2, 26.0.3
API Levels: 23, 24, 25, 26, 27
IDEs:
Android Studio: 3.1 AI-173.4819257
Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
npmPackages:
react: 16.4.1 => 16.4.1
react-native: 0.56.0 => 0.56.0
npmGlobalPackages:
create-react-native-app: 1.0.0
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7
react-native-rename: 2.2.2
react-native-video: 1.2.0

Description
So I am looking to send the scroll location from a webview to the native code. I am able to get it working on iOS however and on Android but only while debug is turned on. I created a raw boilerplate version of my app and I still experience the same issue. I have also tried just appending javascript to the HTML string and I have also tried injectedjavascript with no luck. See the code example below.

Reproducible Demo

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

export default class Web extends Component {

constructor(props) {
    super(props);
    this.webview;
    this.onWebViewMessage = this.onWebViewMessage.bind(this);
    this.state = {
        scrollLocation: null,
    };
}

componentWillMount() {
    this.checkForBookmark();
}

getLocal = async (key) => {
    return AsyncStorage.getItem(key).then((res) => {
        var localData = JSON.parse(res);
        return localData;
    });
}

setLocal = async (key, data) => {
    data = JSON.stringify(data);
    AsyncStorage.setItem(key, data);
    return data;
}


removeLocal = async (key) => {
    AsyncStorage.removeItem(key);
    return key;
}

getLocalBookmark = async () => {
    var postId = 2;
    var localpost = await this.getLocal(`@article${postId}Data:key`);
    return localpost;
}

setLocalBookmark = async (scrollLocation) => {
    var postId = 2;
    var localpost = await this.removeLocal(`@article${postId}Data:key`);
    var localpost = await this.setLocal(`@article${postId}Data:key`, scrollLocation);
}

async checkForBookmark() {
    var content = this.props.navigation.state.params;
    var currentBookMark = await this.getLocalBookmark();
    if (currentBookMark) {
        this.setState({
            scrollLocation: currentBookMark
        });
    }
}

async onWebViewMessage(event) {
    let msg;
    msg = JSON.parse(event.nativeEvent.data);
    console.log(msg);
    this.setLocalBookmark(msg);
}

render() {
    var htmlcontent = this.props.navigation.state.params;

    var fullhtml;
    var webviewScript;
    if (!!this.state.scrollLocation) {
        var scrollPosi = this.state.scrollLocation;
        webviewScript = `
        function Scrolldown() {
            window.scrollBy(0, 765);
       }
       window.onscroll = function() {
            var scrollPos = window.scrollY || window.scrollTop || document.getElementsByTagName("html")[0].scrollTop;
            try {
                window.postMessage(scrollPos, '*');
            } catch (error) {
                alert(error)
            }
        };
       window.onload = Scrolldown;
        `
        fullhtml = htmlcontent;
    }
    else {
        webviewScript = `
        function Scrolldown() {
              window.onscroll = function() {
                var scrollPos = window.scrollY || window.scrollTop || document.getElementsByTagName("html")[0].scrollTop;
                try {
                    window.postMessage(scrollPos, '*');
                } catch (error) {
                    alert(error)
                }
            };
       }
       window.onload = Scrolldown;
       `
        fullhtml = htmlcontent;
    }
    return (
        <View style={{ flex: 10 }}>
            <WebView
                originWhitelist={['*']}
                source={{
                    html: fullhtml,
                    baseUrl: ''
                }}
                javaScriptEnabled={true}
                injectedJavaScript={webviewScript}
                onMessage={this.onWebViewMessage}
            />
        </View>
    );

}
}

---

Drop support for UIWebView

@Titozzz asked me if we could drop support for UIWebView in this package, and I had already mentioned this in the RFC. When testing this package, there are several issues with UIWebView, so it makes sense to drop support for it.

My proposal is to leave UIWebView in (for now) but not put engineering time into it, and in a few versions drop support for UIWebView entirely.

MIGRATED: Input type="file" doesn't work in WebView Android (#16869)

Migrated from facebook/react-native#16869.

@FelipeBohnertPaetzold says:

---

Environment
Steps to Reproduce
Add a component with WebView pointing to a page that contains a file type input.

Access the component of an Android device.

Expected Behavior
The photo gallery of Android is expected to open to select the desired file.

Actual Behavior
Nothing happens, as if it had clicked out of the input.

Reproducible Demo
https://snack.expo.io/@felipepaetzold/webview-input-file-error-on-android

---

More info in the original issue thread

Manual Installation

react-native link doesn't always work on MainActivity.java after installing react-native-navigation.

Can you provide documentation for manual installation? I want to make sure there's nothing missing after running react-native link react-native-webview.

By the way, I can confirm that this issue is resolved with this repository on IOS.

MIGRATED: App is reloaded when include Webview (#19799)

MIgrated from facebook/react-native#19799.

@hadassaChemouni says:

---

Environment
Environment:
OS: macOS High Sierra 10.13.5
Node: 8.11.3
Yarn: 1.7.0
npm: 5.6.0
Watchman: 4.7.0
Xcode: Xcode 9.2 Build version 9C40b
Android Studio: 3.0 AI-171.4443003

Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: 0.55.4 => 0.55.4

Description
I create app that is Webview.
App.js

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

import { WebView } from 'react-native';

const deviceHeight = Dimensions.get('window').height;
const deviceWidth = Dimensions.get('window').width;

const styles = StyleSheet.create({
webView: {
flex: 1,
backgroundColor: 'yellow',
width: deviceWidth,
height: deviceHeight
},
});
export default class App extends React.Component {
render() {
return (
<WebView
ref={frame => this.frame = frame}
source={{uri: 'https://www.slack.com'}}
style={styles.webView}
userAgent="android_webView"
/>
);
}
}
Expected Behavior
The Webview appear correctly.

Actual Behavior
The app restart every time.

Its a log from Android studio

06/19 11:09:47: Launching app
No apk changes detected since last installation, skipping installation of /Users/hadassachemouni/Desktop/AwesomeProject/android/app/build/outputs/apk/debug/app-debug.apk
$ adb shell am force-stop com.awesomeproject
$ adb shell am start -n "com.awesomeproject/com.awesomeproject.MainActivity" -a android.intent.action.MAIN -c android.intent.category.LAUNCHER
Client not ready yet..Connected to process 7643 on device xiaomi-redmi_5a-bdffd2ca7cf5
Capturing and displaying logcat messages from application. This behavior can be disabled in the "Logcat output" section of the "Debugger" settings page.
V/fb-UnpackingSoSource: locked dso store /data/user/0/com.awesomeproject/lib-main
I/fb-UnpackingSoSource: dso store is up-to-date: /data/user/0/com.awesomeproject/lib-main
V/fb-UnpackingSoSource: releasing dso store lock for /data/user/0/com.awesomeproject/lib-main
D/AccessibilityManager: current package=com.awesomeproject, accessibility manager mIsFinalEnabled=false, mOptimizeEnabled=true, mIsUiAutomationEnabled=false, mIsInterestedPackage=false
D/ReactNative: ReactInstanceManager.ctor()
D/NetworkSecurityConfig: No Network Security Config specified, using platform default
D/ReactNative: ReactInstanceManager.createReactContextInBackground()
D/ReactNative: ReactInstanceManager.recreateReactContextInBackgroundInner()
W/unknown:InspectorPackagerConnection: Couldn't connect to packager, will silently retry
D/ReactNative: ReactInstanceManager.onReloadWithJSDebugger()
D/ReactNative: ReactInstanceManager.recreateReactContextInBackground()
D/ReactNative: ReactInstanceManager.runCreateReactContextOnNewThread()
W/unknown:ReactNative: Packager connection already open, nooping.
I/Adreno-EGL: <qeglDrvAPI_eglInitialize:379>: EGL 1.4 QUALCOMM build: Nondeterministic_AU_msm8937_64_LA.UM.5.5.R1__release_AU (I83a540a04a)
OpenGL ES Shader Compiler Version: XE031.09.00.04
Build Date: 09/18/17 Mon
Local Branch:
Remote Branch: quic/gfx-adreno.lnx.1.0.r5-rel
Local Patches: NONE
Reconstruct Branch: NOTHING
I/OpenGLRenderer: Initialized EGL, version 1.4
D/OpenGLRenderer: Swap behavior 1
W/Adreno-ES20: <get_gpu_clk:229>: open failed: errno 13
I/art: Thread[23,tid=7693,Native,Thread*=0xe3e7d100,peer=0x12f8f550,"Thread-3"] recursive attempt to load library "/data/app/com.awesomeproject-1/lib/arm/libfb.so"
D/ReactNative: ReactInstanceManager.createReactContext()
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTGroupViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTGroupShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTShapeViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTShapeShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTTextViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTTextShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.checkbox.ReactCheckBoxManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.uimanager.LayoutShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.picker.ReactDialogPickerManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.drawer.ReactDrawerLayoutManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.picker.ReactDropdownPickerManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.scroll.ReactHorizontalScrollViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.scroll.ReactHorizontalScrollContainerViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.progressbar.ReactProgressBarViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.progressbar.ProgressBarShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.scroll.ReactScrollViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.slider.ReactSliderManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.slider.ReactSliderManager$ReactSliderShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.switchview.ReactSwitchManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.switchview.ReactSwitchManager$ReactSwitchShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.toolbar.ReactToolbarManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.webview.ReactWebViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.swiperefresh.SwipeRefreshLayoutManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTSurfaceViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTSurfaceViewShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.frescosupport.FrescoBasedReactTextInlineImageViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.frescosupport.FrescoBasedReactTextInlineImageShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.image.ReactImageManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.modal.ReactModalHostManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.modal.ModalHostShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.ReactRawTextManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.ReactRawTextShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.textinput.ReactTextInputManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.textinput.ReactTextInputShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.ReactTextViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.ReactTextShadowNode
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.view.ReactViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.viewpager.ReactViewPagerManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.ReactVirtualTextViewManager
W/unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.ReactVirtualTextShadowNode
D/ReactNative: Initializing React Xplat Bridge.
D/ReactNative: Initializing React Xplat Bridge before initializeBridge
D/ReactNative: Initializing React Xplat Bridge after initializeBridge
D/ReactNative: CatalystInstanceImpl.runJSBundle()
D/ReactNative: ReactInstanceManager.setupReactContext()
D/ReactNative: CatalystInstanceImpl.initialize()
W/unknown:ReactNative: Packager connection already open, nooping.
D/ReactNative: ReactInstanceManager.attachRootViewToInstance()
D/ApplicationLoaders: ignored Vulkan layer search path /data/app/com.android.chrome-2/lib/arm:/data/app/com.android.chrome-2/base.apk!/lib/armeabi-v7a for namespace 0xf412f0d0
I/WebViewFactory: Loading com.android.chrome version 67.0.3396.87 (code 339608752)
I/cr_LibraryLoader: Time to load native libraries: 5 ms (timestamps 4429-4434)
I/chromium: [INFO:library_loader_hooks.cc(36)] Chromium logging enabled: level = 0, default verbosity = 0
I/cr_LibraryLoader: Expected native library version number "67.0.3396.87", actual native library version number "67.0.3396.87"
W/cr_ChildProcLH: Create a new ChildConnectionAllocator with package name = com.android.chrome, sandboxed = true
I/cr_BrowserStartup: Initializing chromium process, singleProcess=false
I/cr_base: Android Locale: fr_FR requires .pak files: [fr.pak]
W/ResourceType: Failure getting entry for 0x7f120479 (t=17 e=1145) (error -2147483647)
I/art: Rejecting re-init on previously-failed class java.lang.Class: java.lang.NoClassDefFoundError: Failed resolution of: Landroid/webkit/SafeBrowsingResponse;
I/art: at void com.android.webview.chromium.WebViewChromium.init(java.util.Map, boolean) (PG:53)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int, int, java.util.Map, boolean) (WebView.java:636)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int, int) (WebView.java:572)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int) (WebView.java:555)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet) (WebView.java:542)
I/art: at void android.webkit.WebView.(android.content.Context) (WebView.java:532)
I/art: at void com.facebook.react.views.webview.ReactWebViewManager$ReactWebView.(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:246)
I/art: at com.facebook.react.views.webview.ReactWebViewManager$ReactWebView com.facebook.react.views.webview.ReactWebViewManager.createReactWebViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:355)
I/art: at android.webkit.WebView com.facebook.react.views.webview.ReactWebViewManager.createViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:360)
I/art: at android.view.View com.facebook.react.views.webview.ReactWebViewManager.createViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:84)
I/art: at android.view.View com.facebook.react.uimanager.ViewManager.createView(com.facebook.react.uimanager.ThemedReactContext, com.facebook.react.touch.JSResponderHandler) (ViewManager.java:42)
I/art: at void com.facebook.react.uimanager.NativeViewHierarchyManager.createView(com.facebook.react.uimanager.ThemedReactContext, int, java.lang.String, com.facebook.react.uimanager.ReactStylesDiffMap) (NativeViewHierarchyManager.java:223)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$CreateViewOperation.execute() (UIViewOperationQueue.java:152)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$1.run() (UIViewOperationQueue.java:815)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches() (UIViewOperationQueue.java:928)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue.access$2100(com.facebook.react.uimanager.UIViewOperationQueue) (UIViewOperationQueue.java:46)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(long) (UIViewOperationQueue.java:988)
I/art: at void com.facebook.react.uimanager.GuardedFrameCallback.doFrame(long) (GuardedFrameCallback.java:29)
I/art: at void com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(long) (ReactChoreographer.java:134)
I/art: at void com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(long) (ChoreographerCompat.java:105)
I/art: at void android.view.Choreographer$CallbackRecord.run(long) (Choreographer.java:874)
I/art: at void android.view.Choreographer.doCallbacks(int, long) (Choreographer.java:688)
I/art: at void android.view.Choreographer.doFrame(long, int) (Choreographer.java:620)
I/art: at void android.view.Choreographer$FrameDisplayEventReceiver.run() (Choreographer.java:862)
I/art: at void android.os.Handler.handleCallback(android.os.Message) (Handler.java:754)
I/art: at void android.os.Handler.dispatchMessage(android.os.Message) (Handler.java:95)
I/art: at void android.os.Looper.loop() (Looper.java:163)
I/art: at void android.app.ActivityThread.main(java.lang.String[]) (ActivityThread.java:6221)
I/art: at java.lang.Object java.lang.reflect.Method.invoke!(java.lang.Object, java.lang.Object[]) (Method.java:-2)
I/art: at void com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run() (ZygoteInit.java:904)
I/art: at void com.android.internal.os.ZygoteInit.main(java.lang.String[]) (ZygoteInit.java:794)
I/art: Caused by: java.lang.ClassNotFoundException: Didn't find class "android.webkit.SafeBrowsingResponse" on path: DexPathList[[zip file "/data/app/com.android.chrome-2/base.apk"],nativeLibraryDirectories=[/data/app/com.android.chrome-2/lib/arm, /data/app/com.android.chrome-2/base.apk!/lib/armeabi-v7a, /system/lib, /vendor/lib]]
I/art: at java.lang.Class dalvik.system.BaseDexClassLoader.findClass(java.lang.String) (BaseDexClassLoader.java:56)
I/art: at java.lang.Class java.lang.ClassLoader.loadClass(java.lang.String, boolean) (ClassLoader.java:380)
I/art: at java.lang.Class java.lang.ClassLoader.loadClass(java.lang.String) (ClassLoader.java:312)
I/art: at void com.android.webview.chromium.WebViewChromium.init(java.util.Map, boolean) (PG:53)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int, int, java.util.Map, boolean) (WebView.java:636)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int, int) (WebView.java:572)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int) (WebView.java:555)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet) (WebView.java:542)
I/art: at void android.webkit.WebView.(android.content.Context) (WebView.java:532)
I/art: at void com.facebook.react.views.webview.ReactWebViewManager$ReactWebView.(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:246)
I/art: at com.facebook.react.views.webview.ReactWebViewManager$ReactWebView com.facebook.react.views.webview.ReactWebViewManager.createReactWebViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:355)
I/art: at android.webkit.WebView com.facebook.react.views.webview.ReactWebViewManager.createViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:360)
I/art: at android.view.View com.facebook.react.views.webview.ReactWebViewManager.createViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:84)
I/art: at android.view.View com.facebook.react.uimanager.ViewManager.createView(com.facebook.react.uimanager.ThemedReactContext, com.facebook.react.touch.JSResponderHandler) (ViewManager.java:42)
I/art: at void com.facebook.react.uimanager.NativeViewHierarchyManager.createView(com.facebook.react.uimanager.ThemedReactContext, int, java.lang.String, com.facebook.react.uimanager.ReactStylesDiffMap) (NativeViewHierarchyManager.java:223)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$CreateViewOperation.execute() (UIViewOperationQueue.java:152)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$1.run() (UIViewOperationQueue.java:815)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches() (UIViewOperationQueue.java:928)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue.access$2100(com.facebook.react.uimanager.UIViewOperationQueue) (UIViewOperationQueue.java:46)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(long) (UIViewOperationQueue.java:988)
I/art: at void com.facebook.react.uimanager.GuardedFrameCallback.doFrame(long) (GuardedFrameCallback.java:29)
I/art: at void com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(long) (ReactChoreographer.java:134)
I/art: at void com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(long) (ChoreographerCompat.java:105)
I/art: at void android.view.Choreographer$CallbackRecord.run(long) (Choreographer.java:874)
I/art: at void android.view.Choreographer.doCallbacks(int, long) (Choreographer.java:688)
I/art: at void android.view.Choreographer.doFrame(long, int) (Choreographer.java:620)
I/art: at void android.view.Choreographer$FrameDisplayEventReceiver.run() (Choreographer.java:862)
I/art: at void android.os.Handler.handleCallback(android.os.Message) (Handler.java:754)
I/art: at void android.os.Handler.dispatchMessage(android.os.Message) (Handler.java:95)
I/art: at void android.os.Looper.loop() (Looper.java:163)
I/art: at void android.app.ActivityThread.main(java.lang.String[]) (ActivityThread.java:6221)
I/art: at java.lang.Object java.lang.reflect.Method.invoke!(java.lang.Object, java.lang.Object[]) (Method.java:-2)
I/art: at void com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run() (ZygoteInit.java:904)
I/art: at void com.android.internal.os.ZygoteInit.main(java.lang.String[]) (ZygoteInit.java:794)
I/art: Rejecting re-init on previously-failed class java.lang.Class: java.lang.NoClassDefFoundError: Failed resolution of: Landroid/webkit/RenderProcessGoneDetail;
I/art: at void com.android.webview.chromium.WebViewChromium.init(java.util.Map, boolean) (PG:53)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int, int, java.util.Map, boolean) (WebView.java:636)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int, int) (WebView.java:572)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int) (WebView.java:555)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet) (WebView.java:542)
I/art: at void android.webkit.WebView.(android.content.Context) (WebView.java:532)
I/art: at void com.facebook.react.views.webview.ReactWebViewManager$ReactWebView.(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:246)
I/art: at com.facebook.react.views.webview.ReactWebViewManager$ReactWebView com.facebook.react.views.webview.ReactWebViewManager.createReactWebViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:355)
I/art: at android.webkit.WebView com.facebook.react.views.webview.ReactWebViewManager.createViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:360)
I/art: at android.view.View com.facebook.react.views.webview.ReactWebViewManager.createViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:84)
I/art: at android.view.View com.facebook.react.uimanager.ViewManager.createView(com.facebook.react.uimanager.ThemedReactContext, com.facebook.react.touch.JSResponderHandler) (ViewManager.java:42)
I/art: at void com.facebook.react.uimanager.NativeViewHierarchyManager.createView(com.facebook.react.uimanager.ThemedReactContext, int, java.lang.String, com.facebook.react.uimanager.ReactStylesDiffMap) (NativeViewHierarchyManager.java:223)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$CreateViewOperation.execute() (UIViewOperationQueue.java:152)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$1.run() (UIViewOperationQueue.java:815)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches() (UIViewOperationQueue.java:928)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue.access$2100(com.facebook.react.uimanager.UIViewOperationQueue) (UIViewOperationQueue.java:46)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(long) (UIViewOperationQueue.java:988)
I/art: at void com.facebook.react.uimanager.GuardedFrameCallback.doFrame(long) (GuardedFrameCallback.java:29)
I/art: at void com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(long) (ReactChoreographer.java:134)
I/art: at void com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(long) (ChoreographerCompat.java:105)
I/art: at void android.view.Choreographer$CallbackRecord.run(long) (Choreographer.java:874)
I/art: at void android.view.Choreographer.doCallbacks(int, long) (Choreographer.java:688)
I/art: at void android.view.Choreographer.doFrame(long, int) (Choreographer.java:620)
I/art: at void android.view.Choreographer$FrameDisplayEventReceiver.run() (Choreographer.java:862)
I/art: at void android.os.Handler.handleCallback(android.os.Message) (Handler.java:754)
I/art: at void android.os.Handler.dispatchMessage(android.os.Message) (Handler.java:95)
I/art: at void android.os.Looper.loop() (Looper.java:163)
I/art: at void android.app.ActivityThread.main(java.lang.String[]) (ActivityThread.java:6221)
I/art: at java.lang.Object java.lang.reflect.Method.invoke!(java.lang.Object, java.lang.Object[]) (Method.java:-2)
I/art: at void com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run() (ZygoteInit.java:904)
I/art: at void com.android.internal.os.ZygoteInit.main(java.lang.String[]) (ZygoteInit.java:794)
I/art: Caused by: java.lang.ClassNotFoundException: Didn't find class "android.webkit.RenderProcessGoneDetail" on path: DexPathList[[zip file "/data/app/com.android.chrome-2/base.apk"],nativeLibraryDirectories=[/data/app/com.android.chrome-2/lib/arm, /data/app/com.android.chrome-2/base.apk!/lib/armeabi-v7a, /system/lib, /vendor/lib]]
I/art: at java.lang.Class dalvik.system.BaseDexClassLoader.findClass(java.lang.String) (BaseDexClassLoader.java:56)
I/art: at java.lang.Class java.lang.ClassLoader.loadClass(java.lang.String, boolean) (ClassLoader.java:380)
I/art: at java.lang.Class java.lang.ClassLoader.loadClass(java.lang.String) (ClassLoader.java:312)
I/art: at void com.android.webview.chromium.WebViewChromium.init(java.util.Map, boolean) (PG:53)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int, int, java.util.Map, boolean) (WebView.java:636)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int, int) (WebView.java:572)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet, int) (WebView.java:555)
I/art: at void android.webkit.WebView.(android.content.Context, android.util.AttributeSet) (WebView.java:542)
I/art: at void android.webkit.WebView.(android.content.Context) (WebView.java:532)
I/art: at void com.facebook.react.views.webview.ReactWebViewManager$ReactWebView.(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:246)
I/art: at com.facebook.react.views.webview.ReactWebViewManager$ReactWebView com.facebook.react.views.webview.ReactWebViewManager.createReactWebViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:355)
I/art: at android.webkit.WebView com.facebook.react.views.webview.ReactWebViewManager.createViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:360)
I/art: at android.view.View com.facebook.react.views.webview.ReactWebViewManager.createViewInstance(com.facebook.react.uimanager.ThemedReactContext) (ReactWebViewManager.java:84)
I/art: at android.view.View com.facebook.react.uimanager.ViewManager.createView(com.facebook.react.uimanager.ThemedReactContext, com.facebook.react.touch.JSResponderHandler) (ViewManager.java:42)
I/art: at void com.facebook.react.uimanager.NativeViewHierarchyManager.createView(com.facebook.react.uimanager.ThemedReactContext, int, java.lang.String, com.facebook.react.uimanager.ReactStylesDiffMap) (NativeViewHierarchyManager.java:223)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$CreateViewOperation.execute() (UIViewOperationQueue.java:152)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$1.run() (UIViewOperationQueue.java:815)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches() (UIViewOperationQueue.java:928)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue.access$2100(com.facebook.react.uimanager.UIViewOperationQueue) (UIViewOperationQueue.java:46)
I/art: at void com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(long) (UIViewOperationQueue.java:988)
I/art: at void com.facebook.react.uimanager.GuardedFrameCallback.doFrame(long) (GuardedFrameCallback.java:29)
I/art: at void com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(long) (ReactChoreographer.java:134)
I/art: at void com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(long) (ChoreographerCompat.java:105)
I/art: at void android.view.Choreographer$CallbackRecord.run(long) (Choreographer.java:874)
I/art: at void android.view.Choreographer.doCallbacks(int, long) (Choreographer.java:688)
I/art: at void android.view.Choreographer.doFrame(long, int) (Choreographer.java:620)
I/art: at void android.view.Choreographer$FrameDisplayEventReceiver.run() (Choreographer.java:862)
I/art: at void android.os.Handler.handleCallback(android.os.Message) (Handler.java:754)
I/art: at void android.os.Handler.dispatchMessage(android.os.Message) (Handler.java:95)
I/art: at void android.os.Looper.loop() (Looper.java:163)
I/art: at void android.app.ActivityThread.main(java.lang.String[]) (ActivityThread.java:6221)
I/art: at java.lang.Object java.lang.reflect.Method.invoke!(java.lang.Object, java.lang.Object[]) (Method.java:-2)
I/art: at void com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run() (ZygoteInit.java:904)
I/art: at void com.android.internal.os.ZygoteInit.main(java.lang.String[]) (ZygoteInit.java:794)
D/EgretLoader: EgretLoader(Context context)
D/EgretLoader: The context is not activity
W/cr_media: Requires BLUETOOTH permission
W/Adreno-ES20: <get_gpu_clk:229>: open failed: errno 13
W/ContentCatcher: Failed to notify a WebView
V/BoostFramework: BoostFramework() : mPerf = com.qualcomm.qti.Performance@7531a59
V/BoostFramework: BoostFramework() : mPerf = com.qualcomm.qti.Performance@a3f861e
W/VideoCapabilities: Unrecognized profile 2130706433 for video/avc
W/VideoCapabilities: Unrecognized profile 2130706434 for video/avc
W/VideoCapabilities: Unrecognized profile 2130706433 for video/avc
W/VideoCapabilities: Unrecognized profile 2130706434 for video/avc
W/VideoCapabilities: Unrecognized profile 2130706433 for video/avc
W/VideoCapabilities: Unrecognized profile 2130706434 for video/avc
W/VideoCapabilities: Unsupported mime video/divx
W/VideoCapabilities: Unsupported mime video/divx4
W/VideoCapabilities: Unsupported mime video/mp4v-esdp
W/VideoCapabilities: Unsupported mime video/mp4v-esdp
W/cr_CrashFileManager: /data/user/0/com.awesomeproject/cache/WebView/Crash Reports does not exist or is not a directory
W/Utils: could not parse long range '35-34'
I/VideoCapabilities: Unsupported profile 4 for video/mp4v-es
W/Adreno-ES20: <get_gpu_clk:229>: open failed: errno 13
I/X509Util: Failed to validate the certificate chain, error: java.security.cert.CertPathValidatorException: Trust anchor for certification path not found.
I/art: Do partial code cache collection, code=26KB, data=30KB
I/art: After code cache collection, code=25KB, data=29KB
I/art: Increasing code cache capacity to 128KB
V/BoostFramework: BoostFramework() : mPerf = com.qualcomm.qti.Performance@575aa15
V/BoostFramework: BoostFramework() : mPerf = com.qualcomm.qti.Performance@e2a012a
V/BoostFramework: BoostFramework() : mPerf = com.qualcomm.qti.Performance@4b97b1b
I/art: Do partial code cache collection, code=57KB, data=62KB
I/art: After code cache collection, code=57KB, data=62KB
I/art: Increasing code cache capacity to 256KB
I/Timeline: Timeline: Activity_launch_request time:20615688 intent:Intent { act=android.intent.action.VIEW dat=market://details?id=com.Slack&referrer=af_tranid=eBA_mW30HJ-tVqFDlQ4NIA&af_slk_web_endpoint=/intl/fr&af_slk_web_visitor_uid=qtcdufncje8oco4ogcsgks4o&pid=slack_web flg=0x10000000 }
D/ReactNative: ReactInstanceManager.detachViewFromInstance()
W/cr_AwContents: WebView.destroy() called while WebView is still attached to window.
E/chromium: [ERROR:gl_context_virtual.cc(39)] Trying to make virtual context current without decoder.
W/ContentCatcher: Failed to notify a WebView
D/ReactNative: ReactInstanceManager.attachRootViewToInstance()
W/PhoneWindow: Previously focused view reported id 2 during save, but can't be found during restore.
D/EgretLoader: EgretLoader(Context context)
D/EgretLoader: The context is not activity
W/ContentCatcher: Failed to notify a WebView
W/Adreno-ES20: <get_gpu_clk:229>: open failed: errno 13
D/ReactNative: ReactInstanceManager.detachViewFromInstance()
W/cr_AwContents: WebView.destroy() called while WebView is still attached to window.
W/ContentCatcher: Failed to notify a WebView
D/ReactNative: ReactInstanceManager.attachRootViewToInstance()
W/PhoneWindow: Previously focused view reported id 39 during save, but can't be found during restore.
E/chromium: [ERROR:gl_context_virtual.cc(39)] Trying to make virtual context current without decoder.
D/EgretLoader: EgretLoader(Context context)
D/EgretLoader: The context is not activity
W/ContentCatcher: Failed to notify a WebView
Reproducible Demo
https://snack.expo.io/@hadassa/my-app

---

WKWebView has no hideKeyboardAccessoryView prop

react-native-wkwebview-reborn has the hideKeyboardAccessoryView prop, so that i can hide it, it's so useful.

MIGRATED: postMessage doesn't follow the spec (#20400)

Migrated from facebook/react-native#20400.

@brunobar79 says:

---

Environment
Run react-native info in your terminal and paste its contents here.
React Native Environment Info:
System:
OS: macOS High Sierra 10.13.6
CPU: x64 Intel(R) Core(TM) i7-7567U CPU @ 3.50GHz
Memory: 29.69 MB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 9.9.0 - ~/.nvm/versions/node/v9.9.0/bin/node
Yarn: 1.7.0 - /usr/local/bin/yarn
npm: 6.1.0 - ~/.nvm/versions/node/v9.9.0/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
Android SDK:
Build Tools: 23.0.1, 23.0.3, 25.0.0, 25.0.1, 26.0.1, 26.0.2, 26.0.3, 27.0.3
API Levels: 23, 25, 26, 27
IDEs:
Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
npmPackages:
react: 16.4.1 => 16.4.1
react-native: 0.56.0 => 0.56.0
npmGlobalPackages:
create-react-native-app: 1.0.0
react-native-cli: 2.0.1

Description
The original spect of postMessage allows different types of data (aside of string) and as you can see here, this feature it's supported by all the major browsers.

However, the WebView component in React Native only accepts a string, and if you pass an object you get "[object Object]" in the React Native JS side.

Reproducible Demo
Create a new project, add a webview with the following prop and test on Android & iOS

<WebView
injectedJavaScript={"setTimeout( _=> {window.postMessage({'a':34}, '*');}, 1000) "}
onMessage={ e=> { console.log(e.nativeEvent.data) } }
source={{ uri: 'https://google.com'}}
/>
Expected output: {a:34}
Current output: [object Object]

BTW, this issue has been solved correctly in this library: https://github.com/CRAlpha/react-native-wkwebview#advanced-communication-between-react-native-and-wkwebview which uses WKscriptMessage and the body property accepts the correct type.

---

MIGRATED: Android WebView don't apply CSS filter properly. (#20979)

Migrated from facebook/react-native#20979.

@kevinNejad says:

---

Review the documentation: facebook.github.io/react-native
Search for existing issues: facebook/react-native/issues
React Native Environment Info:
System:
OS: Linux 4.15 Ubuntu 18.04.1 LTS (Bionic Beaver)
CPU: x64 Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz
Memory: 322.83 MB / 15.39 GB
Shell: 4.4.19 - /bin/bash
Binaries:
Node: 8.11.4 - /usr/bin/node
Yarn: 1.9.4 - /usr/bin/yarn
npm: 5.6.0 - /usr/bin/npm
Watchman: 4.7.0 - /usr/local/bin/watchman
npmPackages:
react: 16.4.1 => 16.4.1
react-native: 0.56.0 => 0.56.0
npmGlobalPackages:
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7

setFilter: function (cb, filter) {
      let filterValue = 'invert(0%)';
      if (filter === 'foo') {
        filterValue = 'brightness(0.8) sepia(0.9)';
      } else if (filter === 'bar') {
        filterValue = 'invert(80%)';
      } 

Filters applies to iOS perfectly but on android only applies to images and the rest of the page gets blurry.

---

More info in original thread

MIGRATED: iOS WebView doesn't support hash url change. The onNavigationStateChange listener will not be called when url hash changes. (#20447)

Migrated from facebook/react-native#20447.

@ll929 says:

---

Environment
React Native Environment Info:
System:
OS: macOS High Sierra 10.13.3
CPU: x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
Memory: 109.62 MB / 8.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 9.11.1 - ~/.nvm/versions/node/v9.11.1/bin/node
Yarn: 1.7.0 - /usr/local/bin/yarn
npm: 5.6.0 - ~/.nvm/versions/node/v9.11.1/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.2, macOS 10.13, tvOS 11.2, watchOS 4.2
Android SDK:
Build Tools: 23.0.1, 23.0.2, 23.0.3, 24.0.1, 25.0.1, 25.0.2, 25.0.3, 26.0.1, 26.0.2, 26.0.3, 27.0.0, 27.0.3
API Levels: 23, 24, 25, 26, 27
IDEs:
Android Studio: 3.1 AI-173.4819257
Xcode: 9.2/9C40b - /usr/bin/xcodebuild
npmPackages:
react: 16.4.1 => 16.4.1
react-native: 0.56.0 => 0.56.0

Description
Describe your issue in detail. Include screenshots if needed. If this is a regression, let us know.

Reproducible Demo
Let us know how to reproduce the issue. Include a code sample, share a project, or share an app that reproduces the issue using https://snack.expo.io/. Please follow the guidelines for providing a MCVE: https://stackoverflow.com/help/mcve

Expected Behavior
When url hash change, the webivew onNavigationStateChange listener will be invoked, and the canGoBack properties is true

Actual Behavior
When url hash changes, the webivew onNavigationStateChange hasn't been invoked

MIGRATED: WebView's source prop should not require whitelist for static HTML. (#20527)

Migrated from facebook/react-native#20527.

@squirly

Can you add the ability to get web page loading progress?

Can you add the ability to get web page loading progress?

MIGRATED: html select element not working in WebView on android tablets (#12070)

Migrated from: facebook/react-native#12070

@miestr says:

---

Description
The select element with regular ng-options is not working correctly on Android tablets: the options are not displayed on click/touch.
My react-native app contains a simple WebView which loads a simple url, for example http://www.w3schools.com/bootstrap/bootstrap_forms_inputs.asp
The webpage contains a select element at the bottom, but when I click on it, no options are displayed. At the same time, the multiple select DOES work. The issue found only on Android tablets. On android phones it works.

Reproduction
Create a simple react-native app with simple WebView in it, src prop set to http://www.w3schools.com/bootstrap/bootstrap_forms_inputs.asp. Scroll down to selects with dropdown options and click on simple select. Btw, the select DOES work when another input text is in focus (keyboard up).
This is a sample app , but the bug is not reproducable on rnplay because there is no Android tablet.

Additional Information
React Native version: 0.40.0, react-native-cli version 2.0.1
Platform: bug found on real tablets with Android 5.0.1. Android 5.1.1, tablet emulator with Android 6.0
Operating System: Windows

More details on the original thread

MIGRATED: WebView in RN 0.56 does not allow geolocation requests on Android with proper app permissions & geolocationEnabled={true} prop (#20570)

Migrated from facebook/react-native#20570.

@levi-beers says:

---

Environment
React Native Environment Info:
System:
OS: macOS High Sierra 10.13.5
CPU: x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
Memory: 676.74 MB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 10.8.0 - ~/.nvm/versions/node/v10.8.0/bin/node
Yarn: 1.9.4 - ~/.yarn/bin/yarn
npm: 6.2.0 - ~/.nvm/versions/node/v10.8.0/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
Android SDK:
Build Tools: 23.0.1, 23.0.2, 25.0.0, 25.0.2, 25.0.3, 26.0.1, 26.0.2, 26.0.3, 27.0.2, 27.0.3
API Levels: 23, 25, 26, 27
IDEs:
Android Studio: 3.1 AI-173.4819257
Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
npmPackages:
react: 16.4.1 => 16.4.1
react-native: 0.56.0 => 0.56.0
npmGlobalPackages:
create-react-native-app: 1.0.0

Description
In RN 0.56 WebView fails to pass geolocation results to an https URL that requests it even if you include "geolocationEnabled={true}" prop, you have user approval from PermissionAndroid & you've explicitly set "ACCESS_FINE_LOCATION" permissions in AndroidManifest.xml

Reproducible Demo
https://github.com/levi-beers/geowebview

note: for simplicity in viewing, I did not code the example with Redux so that WebView "waits" until permissions are given. If you launch the app, it asks for location permissions and loads an HTML5 geolocation test that fails. If you "Approve" location permissions, then restart the app you'll be alerted you have location permission but WebView still fails. It seems with or without explicit permissions, geolocation still fails on webview. Or possibly I'm just doing this entirely wrong.

---

Calling Node.js from React Native WebView

I was wondering whether it would be possible to communicate with Node directly from a WebView in React Native.

This should be possible if the WebView has some way of sending messages to another process (not necessarily being the React Native process).

I understand WebView => React Native => Node.js is already possible, but would love to see WebView => Node.js at some point.

I realize this won't be like importing Node.js modules in the WebView, but it's just a minor step away like this!

Any insights would be greatly appreciated.

Node.js support obviously requires: JaneaSystems/nodejs-mobile#124

[Android][WebView] injectedJavaScript don't work

When I debug WebView
I understand that after serialize (on andoid) from the script, delete all the line breaks, because of what you have to be very careful.

Example:

// it's work fine
const validScript = `(function(){
alert(123);
})()`;
<WebView injectedJavaScript={validScript} />

// It's not work on Android
const invalidScript = `
(function(){
        alert(123); // some comment
})();`;
<WebView injectedJavaScript={invalidScript} />

As a result, the webview will get this code: (SyntaxError: Unexpected end of input)

(function(){        alert(123); // some comment})();

And another problem may arise because of a forgotten semicolon:

(function(){
alert(1)
window.postMessage('123')
})();

SyntaxError: Unexpected identifier

(function(){alert(1)window.postMessage('123')})();

Question: How will the iOS WebView differ from react-native-wkwebview

In my understanding, this repository has been created to extract the WebView related source code from the main react-native repo in an effort to make it (react-native repo) leaner. Also, the UIWebView based implementation seems to have been deprecated in favour of WKWebView for iOS specifically. AFAIK, the android implementation has not been altered.

If indeed my understanding is correct, did the maintainers consider https://github.com/CRAlpha/react-native-wkwebview as a viable candidate for the iOS implementation instead of building another one? If they did consider it and decided against it, how will this WKWebView based implementation differ from the one in react-native-wkwebview?

MIGRATED: WebView doesn't support `width: 100%` and `alignSelf: stretch` (#20551)

Migrated from facebook/react-native#20551

@sesm says:

---

Environment
Environment:
OS: macOS High Sierra 10.13.4
Node: 8.11.3
Yarn: 1.7.0
npm: 5.6.0
Watchman: 4.9.0
Xcode: Xcode 9.2 Build version 9C40b
Android Studio: 3.0 AI-171.4443003

Packages: (wanted => installed)
react: 16.3.2 => 16.3.2
react-native: 0.55.4 => 0.55.4

Also reproducible on latest version of react-native on Expo.

Description
WebView doesn't support width: 100% and alignSelf: stretch. The only way to horizontally stretch a WebView is to set explicit width.

Reproducible Demo
https://snack.expo.io/rk8HNfLSQ
In this example width: 100% and alignSelf: stretch work perfectly well on View but don't work on WebView.

---

More details on original issue thread.

Add web support

Include a *.web.js export to provide an implementation for React Native for Web. There's an existing community attempt here https://github.com/react-native-web-community/react-native-web-webview

MIGRATED: WebView ScrollEnabled={false} Bug w/ Keyboard iOS Only (#20793)

Migrated from facebook/react-native#20793.

@PvanHengel says:

---

When using a WebView with the scrollEnabled prop set to false, the scrolling is disabled as expected, however, if the user focus a text area within the webview, and the keyboard displays, the scroll view automatically scrolls up to offset for the keyboard, there is no way for the user to scroll back down to see the content at the top of the page because scrolling is disabled. When scrollEnabled is set to true, and the keyboard is shown, the page should not scroll up to avoid they keyboard (or at least there should be a prop to adjust this). Note that if you use window.scrollTo(0,0) on a timer, it will scroll up, but then scroll back into view.

---

More infos in the original thread

MIGRATED: react native html postMessage can not reach to WebView (#11594)

Migrated from React Native core: facebook/react-native#11594

@raiderrobert says:

---

I use React Native webview to show index.html, and HTML will post messge to the app. The app will then receive the message and write it to console. The problem is the app cannot receive messages, when postMessage is immediately run on head. I think it maybe related to HTML not finished loading. I then used a delay with setTimeout, and it worked.

Now I want to know:

Is there better way to solve this problem?
Why the delay 100 milliscond did not work, but delay 200 milliscond did?
I am using React Native version 0.39.0, and Node version 7.2.0.

Here is the code I have so far:

index.html

<title>Index</title> <script type="text/javascript" src="index.js"></script> <script type="text/javascript"> // can not be received postMessage('send to react native from index inline, no delay', '*');

// can not be received
setTimeout(function(){
    postMessage('send to react native from index inline, delay 0 milliscond', '*')
}, 0);

// can received
setTimeout(function(){
    postMessage('send to react native from index inline, delay 100 milliscond', '*')
}, 100);

onload = function() {
    // can not be received
    postMessage('send to react native from index inline after onload, no delay', '*')

    // can received
    setTimeout(function () {
        postMessage('send to react native from index inline after onload, delay 0 milliscond', '*')
    }, 0);
};

</script> index.js

// can not be received
postMessage('send to react native from index.js, no delay', '*');

// can not be received
setTimeout(function() {
postMessage('send to react native from index.js, delay 100 milliscond', '*')
}, 100);

// can received
setTimeout(function() {
postMessage('send to react native from index.js, delay 200 milliscond', '*')
}, 200);
React Native web_view_page.js

return (
<WebView
source={{uri: 'http://127.0.0.1:8000/index.html'}}
onMessage={(event) => console.log('onMessage:', event.nativeEvent.data)}/>
);
Chrome console log

2016-12-21 11:45:02.367 web_view.js:147 onMessage: send to react native from index inline after onload, delay 0 milliscond
2016-12-21 11:45:02.491 web_view.js:147 onMessage: send to react native from index inline, delay 100 milliscond
2016-12-21 11:45:02.628 web_view.js:147 onMessage: send to react native from index.js, delay 200 milliscond

---

More info in original issue thread

MIGRATED: WebView does not send custom request header after the first initial page load (#8693)

Migrated from React Native core: facebook/react-native#8693

@chiraggshah says:

---

The source prop for WebView allows for passing request headers. When the webview renders for the first time, the request headers are sent.

But when the links within that page are clicked, the headers are not sent to the server in the request header.
Similarly, when the goBack() method is called on the WebView, the request headers are not being sent.

---

More context available in the original issue.

React native iOS webview app reload on photo upload through camera or gallery useWebKit={true}

Environment
React Native Environment Info:
System:
OS: macOS High Sierra 10.13.6
CPU: x64 Intel(R) Core(TM) i5-6500 CPU @ 3.20GHz
Memory: 1.61 GB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 10.6.0 - /usr/local/bin/node
npm: 6.4.1 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
IDEs:
Android Studio: 2.3 AI-162.4069837
Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
npmPackages:
react: 16.5.0 => 16.5.0
react-native: 0.57.2 => 0.57.2
npmGlobalPackages:
create-react-native-app: 1.0.0
react-native-cli: 2.0.1

Iphone 6 physical device and simulators
RN: 0.57.2

Description
React native iOS webview app reload on photo upload through camera or gallery.

When trying to upload photo the webview screen reload to the base url. The same is is working for RN 0.56.

I am using webview with useWebKit={true}

<WebView
                  useWebKit={true}
                  ref={r => this.webview = r}
                  javaScriptEnabled={true}
                  source={{uri:uri_source}}
                  onMessage={this.msgHandler.bind(this)}
                  onNavigationStateChange={this.onNavigationStateChange.bind(this)}
                  onLoadEnd={this.onLoadEnd.bind(this)}
                  onLoadStart={this.onLoadStart.bind(this)}
                  onError={this.onErrorLoad_Webview.bind(this)}
                  domStorageEnabled={true}
                  startInLoadingState={true}
                  mixedContentMode={'compatibility'}
                  mediaPlaybackRequiresUserAction={true}
                  allowUniversalAccessFromFileURLs={true}
                  //renderLoading={this.renderLoading.bind(this)}
                  //scalesPageToFit={true}
              />

Migrate Documentation

Documentation is currently contained here:

https://facebook.github.io/react-native/docs/webview

We should migrate all existing WebView documentation to this repository soon.

My personal preference is that we create a folder (./docs) of markdown documents so that pull requests can contain documentation updates as well. I'm happy to discuss other alternatives, though. This is an example of another project I created where we did that: https://github.com/infinitered/ProMotion/tree/master/docs/Reference

Cookies/localStorage is not shared across WKWebView:s

I opened an issue here:
facebook/react-native#21450

Is this something that needs to be addressed here as well?

MIGRATED: allowFontScaling is not working in webview for Android. (#20960)

Migrated from facebook/react-native#20960.

@manoj2166 says:

---

Environment
Environment:
OS: macOS High Sierra 10.13.5
Node: 6.9.4
Yarn: Not Found
npm: 3.10.10
Watchman: 4.9.0
Xcode: Xcode 9.4 Build version 9F1027a
Android Studio: 2.2 AI-145.3537739

Packages: (wanted => installed)
react: ^16.3.1 => 16.4.1
react-native: ^0.55.0 => 0.55.4

Description
allowFontScaling is not working in webview for Android.

Reproducible Demo
Increase your Android device font size to the maximum and open url in webview you observe that font size of text in webview for Android is increases and when you put allowFontScaling value false then no effect for android in webview rather than ios is working fine.

---

Build fails for iOS on RN 0.57.0

What does not work correctly?

The build fails for me with this error:

/RCTUIWebViewManager.m -o /Users/integreat/integreat-react-native-app/ios/build/Build/Intermediates.noindex/RCTWebView.build/Debug-iphonesimulator/RCTWebView.build/Objects-normal/x86_64/RCTUIWebViewManager.o

/Users/integreat/integreat-react-native-app/node_modules/react-native-webview/ios/RCTUIWebViewManager.m:64:7: error: multiple methods named 'goForward' found with mismatched result, parameter type or attributes
      [view goForward];
      ^~~~~~~~~~~~~~~~
In module 'UIKit' imported from /Users/integreat/integreat-react-native-app/ios/build/Build/Products/Debug-iphonesimulator/include/React/RCTViewManager.h:8:
/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator11.4.sdk/System/Library/Frameworks/UIKit.framework/Headers/UIWebView.h:56:1: note: one possibility
- (void)goForward;
^~~~~~~~~~~~~~~~~~
In module 'WebKit' imported from /Users/integreat/integreat-react-native-app/ios/build/Build/Products/Debug-iphonesimulator/include/React/RCTConvert.h:18:
/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator11.4.sdk/System/Library/Frameworks/WebKit.framework/Headers/WKWebView.h:200:1: note: also found
- (nullable WKNavigation *)goForward;
^~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
In file included from /Users/integreat/integreat-react-native-app/node_modules/react-native-webview/ios/RCTUIWebViewManager.m:6:
/Users/integreat/integreat-react-native-app/node_modules/react-native-webview/ios/RCTUIWebView.h:32:1: note: also found
- (void)goForward;
^~~~~~~~~~~~~~~~~~
1 error generated.



** BUILD FAILED **

package.json

https://github.com/Integreat/integreat-react-native-app/blob/develop/package.json

react-native info

  React Native Environment Info:
    System:
      OS: macOS High Sierra 10.13.6
      CPU: x64 Intel(R) Core(TM) i5-2400S CPU @ 2.50GHz
      Memory: 31.02 MB / 4.00 GB
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 8.11.4 - /usr/local/bin/node
      Yarn: 1.9.4 - /usr/local/bin/yarn
      npm: 5.6.0 - /usr/local/bin/npm
    SDKs:
      iOS SDK:
        Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
      Android SDK:
        Build Tools: 26.0.1, 26.0.3, 28.0.2
        API Levels: 26, 28
    IDEs:
      Android Studio: 3.1 AI-173.4907809
      Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
    npmPackages:
      react: ^16.5.1 => 16.5.1 
      react-native: 0.57.0 => 0.57.0 

?  Done in 29.77s.

Document how to debug webview JavaScript in iOS using Safari Developer Menu

We should document how to use Safari to debug the webview's JavaScript as described here:

https://stackoverflow.com/a/20233054

After consulting with an esteemed colleague today he alerted me to the Safari Developer Toolkit, and how this can be connected to UIWebViews in the iOS Simulator for console output (and debugging!).

Steps:

Open Safari Preferences -> "Advanced" tab -> enable checkbox "Show Develop menu in menu bar"
Start app with UIWebView in iOS Simulator
Safari -> Develop -> i(Pad/Pod) Simulator -> [the name of your UIWebView file]
You can now drop complex (in my case, flot) Javascript and other stuff into UIWebViews and debug at will.

EDIT: As pointed out by @Joshua J McKinnon this strategy also works when debugging UIWebViews on a device. Simply enable Web Inspector on your device settings: Settings->Safari->Advanced->Web Inspector (cheers @Jeremy Wiebe)

UPDATE: WKWebView is supported too

Release package to npm

This ticket will allow lurkers (like myself) to be notified when the module is released and we can pull it down from npm.

It is recommended not to use React. createRef (), as the React version of many projects is still below 16.3.0

It is recommended not to use React. createRef (), as the React version of many projects is still below 16.3.0

MIGRATED: It is no longer possible (0.49-0.54) to retrieve Google AMP urls (#18442)

Migrated from facebook/react-native#18442.

@ksegla says:

---

I have reviewed the documentation
I have searched existing issues
I am using the latest React Native version
Google AMP is now how most news articles are loaded when someone makes a query on Google. Up to 0.48.4, it was possible to detect and manage (bookmark, etc.) page changes in that setting. I was on 0.48.4 and recently made the jump to 0.54. And my app can no longer detect those urls. I believe it is because of the commit ffbd3db which went into effect starting from 0.49.

Environment
Environment:
OS: Windows 10
Node: 6.11.4
Yarn: Not Found
npm: 5.7.1
Watchman: Not Found
Xcode: N/A
Android Studio: Not Found

Packages: (wanted => installed)
react: 16.3.0-alpha.1 => 16.3.0-alpha.1
react-native: 0.54.0 => 0.54.0

Steps to Reproduce

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

class MyWeb extends Component {

onNavigationStateChange(navState) {
alert(JSON.stringify(navState);
}
render() {
return (
<WebView
source={{uri: 'https://www.google.ca/search?q=canada'}}
onNavigationStateChange={ this.onNavigationStateChange.bind(this) }
style={{marginTop: 20}}
/>
);
}
}

Use the component as a WebView and click on any news in the search results. It will likely be an AMP page. The first will fire the alert but with an outdated url. The subsequent pages won't do anything.

Expected Behavior
Google AMP pages url are detected. An alert is generated for every AMP page and with the right url (i.e., contains an "/amp/")

Actual Behavior
onNavigationStateChange() no longer detects change of url for pages like those from Google AMP. It used to, up to 0.48.4. This means those pages can no longer be directly bookmarked or simply managed.
This commit ffbd3db is likely the cause of this regression.

---

More info on original thread

[DISCUSS] Cross platform API for RN<>WebView 2-way RPC/message passing

Referencing (my) prior discussions regarding this, for context and so we don't repeat here. In reverse chronological order:

• alinz/react-native-webview-bridge#109 (comment)
• react-native-community/discussions-and-proposals#3 (comment)
• facebook/react-native#9762 (comment)

This consistent, robust, cross platform API is important for any app that blends native and webviews. I list mine as one. A requirement of this API is that an injected postMessage for purpose of RN message passing, not be overridden by a website's JS in the WebView. Which is currently the case with RN core's WebView, and presumably this forked react-native-webview. It could be achieved (and have been attempted in prior discussions and in RN core's WebView) by loading RN's injected postMessage last, but that's unreliable should the website create after onLoad a function of the same name, alongside iframe issues. This is not hypothetical as it does get overridden for a fact, when loading google.com in WebView for example.

A simple function rename that doesn't use the web standard of postMessage would sidestep what is effectively a name collision issue. Call it rnPostMessage or anything else. Open to suggestions on a better alternative to renaming that actually has a guarantee for not being overridden by non-locally loaded JS within WebView.

This new API should consider/port code (if tested as reliable) from react-native-wkwebview, which is iOS only. And implement the same API for other platforms. There is also working RN<>WebView bridge API at react-native-webview-bridge that's well established (old but fully functional, with google.com loaded in webview, and for Android and iOS), but that's based on UIWebView and not WKWebView on the iOS side.

MIGRATED: The WebView has no support for Basic Authentication (or custom headers). (#19200)

Migrated from facebook/react-native#19200.

@mausworks says:

---

I have reviewed the documentation
I have searched existing issues
I am using the latest React Native version
This is kind of a duplicate of issue #8693, an almost two year issue outlining the same problem. I have left a comment there regarding this. But just to make it clear:

Given how common hybrid apps are, and how common Basic Authentication is, I honestly think this deserves more attention.

That issue also does not conform to your template (likely because of its age), and it has no steps outlined for reproduction, so I figured I'd open a new issue for this; concerning Basic Authentication only.

There is currently no way to use Basic Authentication in the WebView!

It is possible to pass custom headers in the first request via source.headers; but this only applies to the very first request. Meaning: external resources, such as script files, style-sheets, images, videos, etc.— will not be loaded; because they fail authorization. This renders source.headers useless in many cases.

Personally, though; think this is "as expected". The property is named "source" after all. Instead, I think it should be possible to provide the WebView with "default headers": Headers that will be included with every request. Or via an onRequest-callback, which would be a more "catch-all"-solution.

Environment
OS: Windows 10
Node: 8.9.4
Yarn: Not Found
npm: 6.0.0
Watchman: Not Found
Xcode: N/A
Android Studio: Version 3.1.0.0 AI-173.4697961

Steps to Reproduce
An important feature is missing! However, one could argue that the source property of the WebView should forward headers with each consecutive request: Because it is currently the only mechanism which allows for this. Just to make it super clear: I don't think this should be the case, but in order to better explain the issue, I will outline it as if it should be.

I have created a proof-of-concept repository, which can be used to reproduce the bug.

First: Create a server which requires Basic Authentication for all resources. Then have it serve HTML with scripts and/or styles referenced via or <script src="..."> tags.

Then: Create an application with a WebView in React Native, have it request the web server with Basic Authentication, like so:

const source = {
uri: "http:///index.html",
headers: {
Authorization: "Basic Zm9vOmJhcg==" // base64 of 'foo:bar'
}
};

export default class App extends React.Component {
render() {
return <WebView source={source} style={{ flex: 1 }} />;
}
}
Expected Behavior
I expect the CSS and JS files to be loaded, i.e. for the headers provided in source to be included with subsequent requests to these resources.

If my example were to be used, then this is what i expect in my web view:

Actual Behavior
No CSS or JS is loaded, i.e. the headers are not included in the subsequent requests.

This is the actual output:

---

MIGRATED: Webview is not executing my JavaScript from the web page on Android? (#14754)

MIgrated from facebook/react-native#14754

@andrisole92 says:

---

Description
When I open WebView on Android emulator or real device it does not execute JavaScript. I have run simple Android App in Android Studio and it worked there.

Reproduction Steps
Just create a new app and add this WebView to it

Sample Code

<WebView
  style={[styles.flex]} //styles
  javaScriptEnabled={true} //enabling JavaScript
  source={{uri: 'http://partners.zeew.eu/'}} //Url
/>

Solution
Can you please check it and say what is wrong?

Additional Information
React Native version: 0.45.1
Platform: Android ( not sure about iOS )
Development Operating System: Windows
Build tools: Android Studio: Nexus 5x edited_api_25 Android 6.0 Google APIs, Nexus 5 API level 26, Android 8.0.0

---

More info on the original issue thread