RN: Simplify verifyPropTypes

Reviewed By: sahrens Differential Revision: D7893675 fbshipit-source-id: 74d1eff57201a2af4a12c39c4335e28ff9f14090
facebook · May 7, 2018 · 820673e · 820673e
1 parent b549e36
commit 820673e
Show file tree

Hide file tree

Showing 3 changed files with 52 additions and 63 deletions.
diff --git a/Libraries/Components/View/ViewPropTypes.js b/Libraries/Components/View/ViewPropTypes.js
@@ -425,7 +425,7 @@ module.exports = {
    * See http://facebook.github.io/react-native/docs/view.html#needsoffscreenalphacompositing
    */
   needsOffscreenAlphaCompositing: PropTypes.bool,
-  
+
   /**
    * Any additional platform-specific view prop types, or prop type overrides.
    */

diff --git a/Libraries/ReactNative/requireNativeComponent.js b/Libraries/ReactNative/requireNativeComponent.js
@@ -25,7 +25,13 @@ const verifyPropTypes = require('verifyPropTypes');
 const invariant = require('fbjs/lib/invariant');
 const warning = require('fbjs/lib/warning');
 
-import type {ComponentInterface} from 'verifyPropTypes';
+type ComponentInterface =
+  | React$ComponentType<any>
+  | $ReadOnly<{
+      propTypes?: $ReadOnly<{
+        [propName: string]: mixed,
+      }>,
+    }>;
 
 type ExtraOptions = $ReadOnly<{|
   nativeOnly?: $ReadOnly<{
@@ -115,13 +121,10 @@ const requireNativeComponent = (
     });
 
     if (__DEV__) {
-      if (componentInterface != null) {
-        verifyPropTypes(
-          componentInterface,
-          viewConfig,
-          extraConfig == null ? null : extraConfig.nativeOnly,
-        );
-      }
+      verifyPropTypes(
+        viewConfig,
+        extraConfig == null ? null : extraConfig.nativeOnly,
+      );
     }
 
     if (!hasAttachedDefaultEventTypes) {

diff --git a/Libraries/ReactNative/verifyPropTypes.js b/Libraries/ReactNative/verifyPropTypes.js
@@ -4,73 +4,59 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @flow
  * @format
+ * @flow
  */
-'use strict';
 
-var ReactNativeStyleAttributes = require('ReactNativeStyleAttributes');
+'use strict';
 
-export type ComponentInterface =
-  | React$ComponentType<any>
-  | {
-      name?: string,
-      displayName?: string,
-      propTypes?: Object,
-    };
+const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes');
 
 function verifyPropTypes(
-  componentInterface: ComponentInterface,
-  viewConfig: Object,
-  nativePropsToIgnore?: ?Object,
+  viewConfig: $ReadOnly<{
+    NativeProps: $ReadOnly<{
+      [propName: string]: mixed,
+    }>,
+    propTypes: ?$ReadOnly<{
+      [propName: string]: mixed,
+    }>,
+    uiViewClassName: string,
+  }>,
+  nativePropsToIgnore: ?$ReadOnly<{
+    [propName: string]: boolean,
+  }>,
 ) {
-  if (!viewConfig) {
-    return; // This happens for UnimplementedView.
-  }
-  var componentName =
-    componentInterface.displayName || componentInterface.name || 'unknown';
-
-  var propTypes = componentInterface.propTypes;
+  const {NativeProps, propTypes, uiViewClassName} = viewConfig;
 
-  if (!propTypes) {
+  if (propTypes == null) {
     return;
   }
 
-  var nativeProps = viewConfig.NativeProps;
-  for (var prop in nativeProps) {
+  for (const propName in NativeProps) {
     if (
-      !propTypes[prop] &&
-      !ReactNativeStyleAttributes[prop] &&
-      (!nativePropsToIgnore || !nativePropsToIgnore[prop])
+      propTypes[propName] ||
+      ReactNativeStyleAttributes[propName] ||
+      (nativePropsToIgnore && nativePropsToIgnore[propName])
     ) {
-      var message;
-      if (propTypes.hasOwnProperty(prop)) {
-        message =
-          '`' +
-          componentName +
-          '` has incorrectly defined propType for native prop `' +
-          viewConfig.uiViewClassName +
-          '.' +
-          prop +
-          '` of native type `' +
-          nativeProps[prop];
-      } else {
-        message =
-          '`' +
-          componentName +
-          '` has no propType for native prop `' +
-          viewConfig.uiViewClassName +
-          '.' +
-          prop +
-          '` of native type `' +
-          nativeProps[prop] +
-          '`';
-      }
-      message +=
-        "\nIf you haven't changed this prop yourself, this usually means that " +
-        'your versions of the native code and JavaScript code are out of sync. Updating both ' +
-        'should make this error go away.';
-      throw new Error(message);
+      continue;
+    }
+    const prettyName = `${uiViewClassName}.${propName}`;
+    const nativeType = String(NativeProps[propName]);
+    const suggestion =
+      '\n\nIf you have not changed this prop yourself, this usually means ' +
+      'that the versions of your native and JavaScript code are out of sync. ' +
+      'Updating both should make this error go away.';
+
+    if (propTypes.hasOwnProperty(propName)) {
+      console.error(
+        `Invalid propType to configure \`${prettyName}\` (${nativeType}).` +
+          suggestion,
+      );
+    } else {
+      console.error(
+        `Missing a propType to configure \`${prettyName}\` (${nativeType}).` +
+          suggestion,
+      );
     }
   }
 }