Add support for "invalid" event within Form elements

Fixes facebook#5152
tomduncalf · Oct 15, 2015 · 2c498f1 · 2c498f1
1 parent da11356
commit 2c498f1
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 0 deletions.
diff --git a/src/renderers/dom/client/eventPlugins/SimpleEventPlugin.js b/src/renderers/dom/client/eventPlugins/SimpleEventPlugin.js
@@ -177,6 +177,12 @@ var eventTypes = {
       captured: keyOf({onInputCapture: true}),
     },
   },
+  invalid: {
+    phasedRegistrationNames: {
+      bubbled: keyOf({onInvalid: true}),
+      captured: keyOf({onInvalidCapture: true}),
+    },
+  },
   keyDown: {
     phasedRegistrationNames: {
       bubbled: keyOf({onKeyDown: true}),
@@ -404,6 +410,7 @@ var topLevelEventsToDispatchConfig = {
   topError:           eventTypes.error,
   topFocus:           eventTypes.focus,
   topInput:           eventTypes.input,
+  topInvalid:         eventTypes.invalid,
   topKeyDown:         eventTypes.keyDown,
   topKeyPress:        eventTypes.keyPress,
   topKeyUp:           eventTypes.keyUp,
@@ -480,6 +487,7 @@ var SimpleEventPlugin = {
       case topLevelTypes.topEnded:
       case topLevelTypes.topError:
       case topLevelTypes.topInput:
+      case topLevelTypes.topInvalid:
       case topLevelTypes.topLoad:
       case topLevelTypes.topLoadedData:
       case topLevelTypes.topLoadedMetadata:

diff --git a/src/renderers/dom/shared/ReactDOMComponent.js b/src/renderers/dom/shared/ReactDOMComponent.js
@@ -414,6 +414,17 @@ function trapBubbledEventsLocal() {
         ),
       ];
       break;
+    case 'input':
+    case 'select':
+    case 'textarea':
+      inst._wrapperState.listeners = [
+        ReactBrowserEventEmitter.trapBubbledEvent(
+          EventConstants.topLevelTypes.topInvalid,
+          'invalid',
+          node
+        ),
+      ];
+      break;
   }
 }
 
@@ -557,6 +568,9 @@ ReactDOMComponent.Mixin = {
       case 'form':
       case 'video':
       case 'audio':
+      case 'input':
+      case 'select':
+      case 'textarea':
         this._wrapperState = {
           listeners: null,
         };

diff --git a/src/renderers/shared/event/EventConstants.js b/src/renderers/shared/event/EventConstants.js
@@ -47,6 +47,7 @@ var topLevelTypes = keyMirror({
   topError: null,
   topFocus: null,
   topInput: null,
+  topInvalid: null,
   topKeyDown: null,
   topKeyPress: null,
   topKeyUp: null,