[React Native] Fix for view config registrations (#16821)

Author: rickhanlonii

packages/react-native-renderer/src/__mocks__/react-native/Libraries/ReactPrivate/ReactNativeViewConfigRegistry.js

@@ -101,10 +101,13 @@ exports.get = function(name: string): ReactNativeBaseComponentViewConfig<> {
           : '',
       );
     }
-    viewConfigCallbacks.set(name, null);
     viewConfig = callback();
     processEventTypes(viewConfig);
     viewConfigs.set(name, viewConfig);
+
+    // Clear the callback after the config is set so that
+    // we don't mask any errors during registration.
+    viewConfigCallbacks.set(name, null);
   } else {
     viewConfig = viewConfigs.get(name);
   }

packages/react-native-renderer/src/__tests__/ReactNativeEvents-test.internal.js

@@ -75,6 +75,49 @@ beforeEach(() => {
     .ReactNativeViewConfigRegistry.register;
 });
 
+it('fails to register the same event name with different types', () => {
+  const InvalidEvents = createReactNativeComponentClass('InvalidEvents', () => {
+    if (!__DEV__) {
+      // Simulate a registration error in prod.
+      throw new Error('Event cannot be both direct and bubbling: topChange');
+    }
+
+    // This view config has the same bubbling and direct event name
+    // which will fail to register in developement.
+    return {
+      uiViewClassName: 'InvalidEvents',
+      validAttributes: {
+        onChange: true,
+      },
+      bubblingEventTypes: {
+        topChange: {
+          phasedRegistrationNames: {
+            bubbled: 'onChange',
+            captured: 'onChangeCapture',
+          },
+        },
+      },
+      directEventTypes: {
+        topChange: {
+          registrationName: 'onChange',
+        },
+      },
+    };
+  });
+
+  // The first time this renders,
+  // we attempt to register the view config and fail.
+  expect(() => ReactNative.render(<InvalidEvents />, 1)).toThrow(
+    'Event cannot be both direct and bubbling: topChange',
+  );
+
+  // Continue to re-register the config and
+  // fail so that we don't mask the above failure.
+  expect(() => ReactNative.render(<InvalidEvents />, 1)).toThrow(
+    'Event cannot be both direct and bubbling: topChange',
+  );
+});
+
 it('fails if unknown/unsupported event types are dispatched', () => {
   expect(RCTEventEmitter.register).toHaveBeenCalledTimes(1);
   const EventEmitter = RCTEventEmitter.register.mock.calls[0][0];

scripts/rollup/shims/react-native/ReactNativeViewConfigRegistry.js

@@ -98,10 +98,13 @@ exports.get = function(name: string): ReactNativeBaseComponentViewConfig<> {
           : '',
       );
     }
-    viewConfigCallbacks.set(name, null);
     viewConfig = callback();
     processEventTypes(viewConfig);
     viewConfigs.set(name, viewConfig);
+
+    // Clear the callback after the config is set so that
+    // we don't mask any errors during registration.
+    viewConfigCallbacks.set(name, null);
   } else {
     viewConfig = viewConfigs.get(name);
   }