Clean up flow types

js/WKWebView.ios.js

@@ -13,13 +13,17 @@ import React from 'react';
 
 import { requireNativeComponent } from 'react-native';
 
+import type {DataDetectorTypes} from './WebViewTypes';
+
 const RCTWKWebView = requireNativeComponent('RCTWKWebView');
 
-type RCTWKWebViewProps = {
-  allowsInlineMediaPlayback?: boolean,
-  mediaPlaybackRequiresUserAction?: boolean,
-  dataDetectorTypes?: boolean,
-};
+type RCTWKWebViewProps = $ReadOnly<{|
+  allowsInlineMediaPlayback?: ?boolean,
+  mediaPlaybackRequiresUserAction?: ?boolean,
+  dataDetectorTypes?:
+    | ?DataDetectorTypes
+    | $ReadOnlyArray<DataDetectorTypes>,
+|}>;
 
 class WKWebView extends React.Component<RCTWKWebViewProps> {
   componentWillReceiveProps(nextProps: RCTWKWebViewProps) {

js/WebView.android.js

@@ -27,8 +27,12 @@ import keyMirror from 'fbjs/lib/keyMirror';
 
 import WebViewShared from './WebViewShared';
 import type {
-  WebViewErrorEvent,
   WebViewEvent,
+  WebViewError,
+  WebViewErrorEvent,
+  WebViewMessageEvent,
+  WebViewNavigation,
+  WebViewNavigationEvent,
   WebViewSharedProps,
   WebViewSource,
 } from './WebViewTypes';
@@ -51,14 +55,14 @@ const defaultRenderLoading = () => (
 
 type State = {|
   viewState: WebViewState,
-  lastErrorEvent: ?WebViewErrorEvent,
+  lastErrorEvent: ?WebViewError,
   startInLoadingState: boolean,
 |};
 
 type WebViewPropsAndroid = $ReadOnly<{|
   ...WebViewSharedProps,
-  onNavigationStateChange?: (event: WebViewEvent) => any,
-  onContentSizeChange?: (event: WebViewEvent) => any,
+  onNavigationStateChange?: (event: WebViewNavigation) => mixed,
+  onContentSizeChange?: (event: WebViewEvent) => mixed,
 
   /**
    * Sets whether Geolocation is enabled. The default is false.
@@ -105,7 +109,7 @@ class WebView extends React.Component<WebViewPropsAndroid, State> {
 
   state = {
     viewState: WebViewState.IDLE,
-    lastErrorEvent: (null: ?WebViewErrorEvent),
+    lastErrorEvent: null,
     startInLoadingState: true,
   };
 
@@ -145,7 +149,7 @@ class WebView extends React.Component<WebViewPropsAndroid, State> {
       webViewStyles.push(styles.hidden);
     }
 
-    let source = this.props.source || ({}: WebViewSource);
+    let source: WebViewSource = this.props.source || {};
     if (!this.props.source && this.props.html) {
       source = { html: this.props.html };
     } else if (!this.props.source && this.props.url) {
@@ -275,7 +279,7 @@ class WebView extends React.Component<WebViewPropsAndroid, State> {
    * We return an event with a bunch of fields including:
    *  url, title, loading, canGoBack, canGoForward
    */
-  updateNavigationState = (event: WebViewEvent) => {
+  updateNavigationState = (event: WebViewNavigationEvent) => {
     if (this.props.onNavigationStateChange) {
       this.props.onNavigationStateChange(event.nativeEvent);
     }
@@ -285,13 +289,13 @@ class WebView extends React.Component<WebViewPropsAndroid, State> {
     return ReactNative.findNodeHandle(this.refs[RCT_WEBVIEW_REF]);
   };
 
-  onLoadingStart = (event: WebViewEvent) => {
+  onLoadingStart = (event: WebViewNavigationEvent) => {
     const onLoadStart = this.props.onLoadStart;
     onLoadStart && onLoadStart(event);
     this.updateNavigationState(event);
   };
 
-  onLoadingError = (event: WebViewEvent) => {
+  onLoadingError = (event: WebViewErrorEvent) => {
     event.persist(); // persist this event because we need to store it
     const { onError, onLoadEnd } = this.props;
     onError && onError(event);
@@ -304,7 +308,7 @@ class WebView extends React.Component<WebViewPropsAndroid, State> {
     });
   };
 
-  onLoadingFinish = (event: WebViewEvent) => {
+  onLoadingFinish = (event: WebViewNavigationEvent) => {
     const { onLoad, onLoadEnd } = this.props;
     onLoad && onLoad(event);
     onLoadEnd && onLoadEnd(event);
@@ -314,7 +318,7 @@ class WebView extends React.Component<WebViewPropsAndroid, State> {
     this.updateNavigationState(event);
   };
 
-  onMessage = (event: WebViewEvent) => {
+  onMessage = (event: WebViewMessageEvent) => {
     const { onMessage } = this.props;
     onMessage && onMessage(event);
   };

js/WebView.ios.js

@@ -30,8 +30,11 @@ import keyMirror from 'fbjs/lib/keyMirror';
 
 import WebViewShared from './WebViewShared';
 import type {
-  WebViewErrorEvent,
   WebViewEvent,
+  WebViewError,
+  WebViewErrorEvent,
+  WebViewMessageEvent,
+  WebViewNavigationEvent,
   WebViewSharedProps,
   WebViewSource,
 } from './WebViewTypes';
@@ -73,7 +76,7 @@ const JSNavigationScheme = 'react-js-navigation';
 
 type State = {|
   viewState: WebViewState,
-  lastErrorEvent: ?WebViewErrorEvent,
+  lastErrorEvent: ?WebViewError,
   startInLoadingState: boolean,
 |};
 
@@ -136,7 +139,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
 
   state = {
     viewState: WebViewState.IDLE,
-    lastErrorEvent: (null: ?WebViewErrorEvent),
+    lastErrorEvent: null,
     startInLoadingState: true,
   };
 
@@ -232,7 +235,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
       this.props.decelerationRate,
     );
 
-    let source = this.props.source || ({}: WebViewSource);
+    let source: WebViewSource = this.props.source || {};
     if (!this.props.source && this.props.html) {
       source = { html: this.props.html };
     } else if (!this.props.source && this.props.url) {
@@ -376,7 +379,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
    * We return an event with a bunch of fields including:
    *  url, title, loading, canGoBack, canGoForward
    */
-  _updateNavigationState = (event: WebViewEvent) => {
+  _updateNavigationState = (event: WebViewNavigationEvent) => {
     if (this.props.onNavigationStateChange) {
       this.props.onNavigationStateChange(event.nativeEvent);
     }
@@ -389,13 +392,13 @@ class WebView extends React.Component<WebViewSharedProps, State> {
     return ReactNative.findNodeHandle(this.refs[RCT_WEBVIEW_REF]);
   };
 
-  _onLoadingStart = (event: WebViewEvent) => {
+  _onLoadingStart = (event: WebViewNavigationEvent) => {
     const onLoadStart = this.props.onLoadStart;
     onLoadStart && onLoadStart(event);
     this._updateNavigationState(event);
   };
 
-  _onLoadingError = (event: WebViewEvent) => {
+  _onLoadingError = (event: WebViewErrorEvent) => {
     event.persist(); // persist this event because we need to store it
     const { onError, onLoadEnd } = this.props;
     onError && onError(event);
@@ -408,7 +411,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
     });
   };
 
-  _onLoadingFinish = (event: WebViewEvent) => {
+  _onLoadingFinish = (event: WebViewNavigationEvent) => {
     const { onLoad, onLoadEnd } = this.props;
     onLoad && onLoad(event);
     onLoadEnd && onLoadEnd(event);
@@ -418,7 +421,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
     this._updateNavigationState(event);
   };
 
-  _onMessage = (event: WebViewEvent) => {
+  _onMessage = (event: WebViewMessageEvent) => {
     const { onMessage } = this.props;
     onMessage && onMessage(event);
   };

js/WebViewTypes.js

@@ -10,18 +10,53 @@
 
 'use strict';
 
-import type {Node, Element} from 'react';
+import type {Node, Element, ComponentType} from 'react';
+import type {SyntheticEvent} from 'CoreEventTypes';
 import type {EdgeInsetsProp} from 'EdgeInsetsPropType';
 import type {ViewStyleProp} from 'StyleSheet';
 import type {ViewProps} from 'ViewPropTypes';
 
-export type WebViewErrorEvent = {
-  domain: any,
-  code: any,
-  description: any,
-};
+export type WebViewNativeEvent = $ReadOnly<{|
+  url: string,
+  loading: boolean,
+  title: string,
+  canGoBack: boolean,
+  canGoForward: boolean,
+|}>;
+
+export type WebViewNavigation = $ReadOnly<{|
+  ...WebViewNativeEvent,
+  navigationType:
+    | 'click'
+    | 'formsubmit'
+    | 'backforward'
+    | 'reload'
+    | 'formresubmit'
+    | 'other',
+|}>;
+
+export type WebViewMessage = $ReadOnly<{|
+  ...WebViewNativeEvent,
+  data: string,
+|}>;
+
+export type WebViewError = $ReadOnly<{|
+  ...WebViewNativeEvent,
+  /**
+   * `domain` is only used on iOS
+   */
+  domain: ?string,
+  code: number,
+  description: string,
+|}>;
+
+export type WebViewEvent = SyntheticEvent<WebViewNativeEvent>;
+
+export type WebViewNavigationEvent = SyntheticEvent<WebViewNavigation>;
 
-export type WebViewEvent = Object;
+export type WebViewMessageEvent = SyntheticEvent<WebViewMessage>;
+
+export type WebViewErrorEvent = SyntheticEvent<WebViewError>;
 
 export type DataDetectorTypes =
   | 'phoneNumber'
@@ -34,7 +69,7 @@ export type DataDetectorTypes =
   | 'none'
   | 'all';
 
-export type WebViewSourceUri = {|
+export type WebViewSourceUri = $ReadOnly<{|
   /**
    * The URI to load in the `WebView`. Can be a local or remote file.
    */
@@ -59,9 +94,9 @@ export type WebViewSourceUri = {|
    * NOTE: On Android, this can only be used with POST requests.
    */
   body?: string,
-|};
+|}>;
 
-export type WebViewSourceHtml = {|
+export type WebViewSourceHtml = $ReadOnly<{|
   /**
    * A static HTML page to display in the WebView.
    */
@@ -70,7 +105,7 @@ export type WebViewSourceHtml = {|
    * The base URL to be used for any relative links in the HTML.
    */
   baseUrl?: ?string,
-|};
+|}>;
 
 export type WebViewSource = WebViewSourceUri | WebViewSourceHtml;
 
@@ -78,7 +113,7 @@ export type WebViewNativeConfig = $ReadOnly<{|
   /*
    * The native component used to render the WebView.
    */
-  component?: ?any,
+  component?: ComponentType<WebViewSharedProps>,
   /*
    * Set props directly on the native component WebView. Enables custom props which the
    * original WebView doesn't pass through.
@@ -116,7 +151,7 @@ export type WebViewSharedProps =  $ReadOnly<{|
   /**
    * Function that returns a view to show if there's an error.
    */
-  renderError: (errorDomain: any, errorCode: any, errorDesc: any) => Element<any>, // view to show if there's an error
+  renderError: (errorDomain: ?string, errorCode: number, errorDesc: string) => Element<any>, // view to show if there's an error
 
   /**
    * Function that returns a loading indicator.
@@ -126,22 +161,22 @@ export type WebViewSharedProps =  $ReadOnly<{|
   /**
    * Function that is invoked when the `WebView` has finished loading.
    */
-  onLoad: (event: WebViewEvent) => any,
+  onLoad: (event: WebViewNavigationEvent) => mixed,
 
   /**
    * Function that is invoked when the `WebView` load succeeds or fails.
    */
-  onLoadEnd: (event: WebViewEvent) => any,
+  onLoadEnd: (event: WebViewNavigationEvent | WebViewErrorEvent) => mixed,
 
   /**
    * Function that is invoked when the `WebView` starts loading.
    */
-  onLoadStart: (event: WebViewEvent) => any,
+  onLoadStart: (event: WebViewNavigationEvent) => mixed,
 
   /**
    * Function that is invoked when the `WebView` load fails.
    */
-  onError: (event: WebViewEvent) => any,
+  onError: (event: WebViewErrorEvent) => mixed,
 
   /**
    * Boolean value that determines whether the web view bounces
@@ -187,7 +222,7 @@ export type WebViewSharedProps =  $ReadOnly<{|
   /**
    * Function that is invoked when the `WebView` loading starts or ends.
    */
-  onNavigationStateChange?: (event: WebViewEvent) => any,
+  onNavigationStateChange?: (event: WebViewNavigation) => mixed,
 
   /**
    * A function that is invoked when the webview calls `window.postMessage`.
@@ -198,7 +233,7 @@ export type WebViewSharedProps =  $ReadOnly<{|
    * available on the event object, `event.nativeEvent.data`. `data`
    * must be a string.
    */
-  onMessage?: (event: WebViewEvent) => any,
+  onMessage?: (event: WebViewMessageEvent) => mixed,
 
   /**
    * Boolean value that forces the `WebView` to show the loading view
@@ -281,7 +316,7 @@ export type WebViewSharedProps =  $ReadOnly<{|
    * to stop loading.
    * @platform ios
    */
-  onShouldStartLoadWithRequest?: (event: WebViewEvent) => any,
+  onShouldStartLoadWithRequest?: (event: WebViewEvent) => mixed,
 
   /**
    * Boolean that determines whether HTML5 videos play inline or use the