Change WebView to be required from 'WebView' module directly

Summary: This is the first diff part of moving WebView internally to Facebook. It will be available under the same name `WebView` but won't be required from `react-native` any longer.

Reviewed By: TheSavior

Differential Revision: D14598043

fbshipit-source-id: f870d3f58e1d304071405344de09598dd22cdcc2

Libraries/Components/WebView/WebView.android.js

@@ -4,6 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow
  * @format
  */
 
@@ -39,10 +40,13 @@ const defaultRenderLoading = () => (
   </View>
 );
 
+type Props = any;
+type State = any;
+
 /**
  * Renders a native WebView.
  */
-class WebView extends React.Component {
+class WebView extends React.Component<Props, State> {
   static propTypes = {
     ...DeprecatedViewPropTypes,
     renderError: PropTypes.func,
@@ -412,7 +416,7 @@ class WebView extends React.Component {
     );
   };
 
-  postMessage = data => {
+  postMessage = (data: string) => {
     UIManager.dispatchViewManagerCommand(
       this.getWebViewHandle(),
       UIManager.getViewManagerConfig('RCTWebView').Commands.postMessage,
@@ -426,7 +430,7 @@ class WebView extends React.Component {
    * on pages with a Content Security Policy that disallows eval(). If you need that
    * functionality, look into postMessage/onMessage.
    */
-  injectJavaScript = data => {
+  injectJavaScript = (data: string) => {
     UIManager.dispatchViewManagerCommand(
       this.getWebViewHandle(),
       UIManager.getViewManagerConfig('RCTWebView').Commands.injectJavaScript,
@@ -438,7 +442,7 @@ class WebView extends React.Component {
    * We return an event with a bunch of fields including:
    *  url, title, loading, canGoBack, canGoForward
    */
-  updateNavigationState = event => {
+  updateNavigationState = (event: any) => {
     if (this.props.onNavigationStateChange) {
       this.props.onNavigationStateChange(event.nativeEvent);
     }
@@ -448,13 +452,13 @@ class WebView extends React.Component {
     return ReactNative.findNodeHandle(this.refs[RCT_WEBVIEW_REF]);
   };
 
-  onLoadingStart = event => {
+  onLoadingStart = (event: any) => {
     const onLoadStart = this.props.onLoadStart;
     onLoadStart && onLoadStart(event);
     this.updateNavigationState(event);
   };
 
-  onLoadingError = event => {
+  onLoadingError = (event: any) => {
     event.persist(); // persist this event because we need to store it
     const {onError, onLoadEnd} = this.props;
     onError && onError(event);
@@ -467,7 +471,7 @@ class WebView extends React.Component {
     });
   };
 
-  onLoadingFinish = event => {
+  onLoadingFinish = (event: any) => {
     const {onLoad, onLoadEnd} = this.props;
     onLoad && onLoad(event);
     onLoadEnd && onLoadEnd(event);
@@ -477,7 +481,7 @@ class WebView extends React.Component {
     this.updateNavigationState(event);
   };
 
-  onMessage = (event: Event) => {
+  onMessage = (event: any) => {
     const {onMessage} = this.props;
     onMessage && onMessage(event);
   };

Libraries/Components/WebView/WebView.ios.js

@@ -4,8 +4,8 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow
  * @format
- * @noflow
  */
 
 'use strict';
@@ -87,6 +87,9 @@ const defaultRenderError = (errorDomain, errorCode, errorDesc) => (
   </View>
 );
 
+type Props = any;
+type State = any;
+
 /**
  * `WebView` renders web content in a native view.
  *
@@ -109,7 +112,7 @@ const defaultRenderError = (errorDomain, errorCode, errorDesc) => (
  * You can use this component to navigate back and forth in the web view's
  * history and configure various properties for the web content.
  */
-class WebView extends React.Component {
+class WebView extends React.Component<Props, State> {
   static JSNavigationScheme = JSNavigationScheme;
   static NavigationType = NavigationType;
   static propTypes = {
@@ -491,8 +494,8 @@ class WebView extends React.Component {
       let shouldStart = true;
       const {url} = event.nativeEvent;
       const origin = WebViewShared.extractOrigin(url);
-      const passesWhitelist = compiledWhitelist.some(x =>
-        new RegExp(x).test(origin),
+      const passesWhitelist = compiledWhitelist.some(
+        x => origin && new RegExp(x).test(origin),
       );
       shouldStart = shouldStart && passesWhitelist;
       if (!passesWhitelist) {
@@ -631,7 +634,7 @@ class WebView extends React.Component {
    * document.addEventListener('message', e => { document.title = e.data; });
    * ```
    */
-  postMessage = data => {
+  postMessage = (data: string) => {
     UIManager.dispatchViewManagerCommand(
       this.getWebViewHandle(),
       this._getCommands().postMessage,
@@ -645,7 +648,7 @@ class WebView extends React.Component {
    * on pages with a Content Security Policy that disallows eval(). If you need that
    * functionality, look into postMessage/onMessage.
    */
-  injectJavaScript = data => {
+  injectJavaScript = (data: string) => {
     UIManager.dispatchViewManagerCommand(
       this.getWebViewHandle(),
       this._getCommands().injectJavaScript,
@@ -704,7 +707,7 @@ class WebView extends React.Component {
     onMessage && onMessage(event);
   };
 
-  componentDidUpdate(prevProps) {
+  componentDidUpdate(prevProps: Props) {
     if (!(prevProps.useWebKit && this.props.useWebKit)) {
       return;
     }
@@ -729,16 +732,8 @@ class WebView extends React.Component {
   }
 }
 
-const RCTWebView = requireNativeComponent(
-  'RCTWebView',
-  WebView,
-  WebView.extraNativeComponentConfig,
-);
-const RCTWKWebView = requireNativeComponent(
-  'RCTWKWebView',
-  WebView,
-  WebView.extraNativeComponentConfig,
-);
+const RCTWebView = requireNativeComponent('RCTWebView');
+const RCTWKWebView = requireNativeComponent('RCTWKWebView');
 
 const styles = StyleSheet.create({
   container: {