From 087f5e9489004e3d018c2938dc4ad1ed376534e9 Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Thu, 6 Apr 2023 21:18:47 -0400
Subject: [PATCH 01/14] Rename controlled component methods

These used to be wrapper components which is where the name came from
but that's not relevant anymore.
---
 .../src/client/ReactDOMComponent.js           | 73 +++++++++----------
 .../src/client/ReactDOMInput.js               | 16 ++--
 .../src/client/ReactDOMOption.js              |  4 +-
 .../src/client/ReactDOMSelect.js              |  8 +-
 .../src/client/ReactDOMTextarea.js            | 13 ++--
 5 files changed, 57 insertions(+), 57 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMComponent.js b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
index 4deb8943a196..a3a8d6a33819 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMComponent.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
@@ -27,27 +27,24 @@ import {
   setValueForNamespacedAttribute,
 } from './DOMPropertyOperations';
 import {
-  initWrapperState as ReactDOMInputInitWrapperState,
-  postMountWrapper as ReactDOMInputPostMountWrapper,
-  updateChecked as ReactDOMInputUpdateChecked,
-  updateWrapper as ReactDOMInputUpdateWrapper,
-  restoreControlledState as ReactDOMInputRestoreControlledState,
+  initInput,
+  postInitInput,
+  updateInputChecked,
+  updateInput,
+  restoreControlledInputState,
 } from './ReactDOMInput';
+import {postInitOption, validateOptionProps} from './ReactDOMOption';
 import {
-  postMountWrapper as ReactDOMOptionPostMountWrapper,
-  validateProps as ReactDOMOptionValidateProps,
-} from './ReactDOMOption';
-import {
-  initWrapperState as ReactDOMSelectInitWrapperState,
-  postMountWrapper as ReactDOMSelectPostMountWrapper,
-  restoreControlledState as ReactDOMSelectRestoreControlledState,
-  postUpdateWrapper as ReactDOMSelectPostUpdateWrapper,
+  initSelect,
+  postInitSelect,
+  restoreControlledSelectState,
+  postUpdateSelect,
 } from './ReactDOMSelect';
 import {
-  initWrapperState as ReactDOMTextareaInitWrapperState,
-  postMountWrapper as ReactDOMTextareaPostMountWrapper,
-  updateWrapper as ReactDOMTextareaUpdateWrapper,
-  restoreControlledState as ReactDOMTextareaRestoreControlledState,
+  initTextarea,
+  postInitTextarea,
+  updateTextarea,
+  restoreControlledTextareaState,
 } from './ReactDOMTextarea';
 import {track} from './inputValueTracking';
 import setInnerHTML from './setInnerHTML';
@@ -805,7 +802,7 @@ export function setInitialProperties(
       break;
     }
     case 'input': {
-      ReactDOMInputInitWrapperState(domElement, props);
+      initInput(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
@@ -866,11 +863,11 @@ export function setInitialProperties(
       // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
       track((domElement: any));
-      ReactDOMInputPostMountWrapper(domElement, props, false);
+      postInitInput(domElement, props, false);
       return;
     }
     case 'select': {
-      ReactDOMSelectInitWrapperState(domElement, props);
+      initSelect(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
@@ -893,11 +890,11 @@ export function setInitialProperties(
           }
         }
       }
-      ReactDOMSelectPostMountWrapper(domElement, props);
+      postInitSelect(domElement, props);
       return;
     }
     case 'textarea': {
-      ReactDOMTextareaInitWrapperState(domElement, props);
+      initTextarea(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
@@ -936,11 +933,11 @@ export function setInitialProperties(
       // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
       track((domElement: any));
-      ReactDOMTextareaPostMountWrapper(domElement, props);
+      postInitTextarea(domElement, props);
       return;
     }
     case 'option': {
-      ReactDOMOptionValidateProps(domElement, props);
+      validateOptionProps(domElement, props);
       for (const propKey in props) {
         if (!props.hasOwnProperty(propKey)) {
           continue;
@@ -963,7 +960,7 @@ export function setInitialProperties(
           }
         }
       }
-      ReactDOMOptionPostMountWrapper(domElement, props);
+      postInitOption(domElement, props);
       return;
     }
     case 'dialog': {
@@ -1213,7 +1210,7 @@ export function updateProperties(
       // In the middle of an update, it is possible to have multiple checked.
       // When a checked radio tries to change name, browser makes another radio's checked false.
       if (nextProps.type === 'radio' && nextProps.name != null) {
-        ReactDOMInputUpdateChecked(domElement, nextProps);
+        updateInputChecked(domElement, nextProps);
       }
       for (let i = 0; i < updatePayload.length; i += 2) {
         const propKey = updatePayload[i];
@@ -1252,7 +1249,7 @@ export function updateProperties(
       // Update the wrapper around inputs *after* updating props. This has to
       // happen after updating the rest of props. Otherwise HTML5 input validations
       // raise warnings and prevent the new value from being assigned.
-      ReactDOMInputUpdateWrapper(domElement, nextProps);
+      updateInput(domElement, nextProps);
       return;
     }
     case 'select': {
@@ -1272,7 +1269,7 @@ export function updateProperties(
       }
       // <select> value update needs to occur after <option> children
       // reconciliation
-      ReactDOMSelectPostUpdateWrapper(domElement, nextProps);
+      postUpdateSelect(domElement, nextProps);
       return;
     }
     case 'textarea': {
@@ -1303,7 +1300,7 @@ export function updateProperties(
           }
         }
       }
-      ReactDOMTextareaUpdateWrapper(domElement, nextProps);
+      updateTextarea(domElement, nextProps);
       return;
     }
     case 'option': {
@@ -2263,7 +2260,7 @@ export function diffHydratedProperties(
       listenToNonDelegatedEvent('toggle', domElement);
       break;
     case 'input':
-      ReactDOMInputInitWrapperState(domElement, props);
+      initInput(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
@@ -2275,26 +2272,26 @@ export function diffHydratedProperties(
       // option and select we don't quite do the same thing and select
       // is not resilient to the DOM state changing so we don't do that here.
       // TODO: Consider not doing this for input and textarea.
-      ReactDOMInputPostMountWrapper(domElement, props, true);
+      postInitInput(domElement, props, true);
       break;
     case 'option':
-      ReactDOMOptionValidateProps(domElement, props);
+      validateOptionProps(domElement, props);
       break;
     case 'select':
-      ReactDOMSelectInitWrapperState(domElement, props);
+      initSelect(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
       break;
     case 'textarea':
-      ReactDOMTextareaInitWrapperState(domElement, props);
+      initTextarea(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
       // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
       track((domElement: any));
-      ReactDOMTextareaPostMountWrapper(domElement, props);
+      postInitTextarea(domElement, props);
       break;
   }
 
@@ -2472,13 +2469,13 @@ export function restoreControlledState(
 ): void {
   switch (tag) {
     case 'input':
-      ReactDOMInputRestoreControlledState(domElement, props);
+      restoreControlledInputState(domElement, props);
       return;
     case 'textarea':
-      ReactDOMTextareaRestoreControlledState(domElement, props);
+      restoreControlledTextareaState(domElement, props);
       return;
     case 'select':
-      ReactDOMSelectRestoreControlledState(domElement, props);
+      restoreControlledSelectState(domElement, props);
       return;
   }
 }
diff --git a/packages/react-dom-bindings/src/client/ReactDOMInput.js b/packages/react-dom-bindings/src/client/ReactDOMInput.js
index aed75c646fa1..2367367b7523 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMInput.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMInput.js
@@ -61,7 +61,7 @@ function isControlled(props: any) {
  * See http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html
  */
 
-export function initWrapperState(element: Element, props: Object) {
+export function initInput(element: Element, props: Object) {
   if (__DEV__) {
     checkControlledValueProps('input', props);
 
@@ -117,7 +117,7 @@ export function initWrapperState(element: Element, props: Object) {
   };
 }
 
-export function updateChecked(element: Element, props: Object) {
+export function updateInputChecked(element: Element, props: Object) {
   const node = ((element: any): InputWithWrapperState);
   const checked = props.checked;
   if (checked != null) {
@@ -125,7 +125,7 @@ export function updateChecked(element: Element, props: Object) {
   }
 }
 
-export function updateWrapper(element: Element, props: Object) {
+export function updateInput(element: Element, props: Object) {
   const node = ((element: any): InputWithWrapperState);
   if (__DEV__) {
     const controlled = isControlled(props);
@@ -160,7 +160,7 @@ export function updateWrapper(element: Element, props: Object) {
     }
   }
 
-  updateChecked(element, props);
+  updateInputChecked(element, props);
 
   const value = getToStringValue(props.value);
   const type = props.type;
@@ -224,7 +224,7 @@ export function updateWrapper(element: Element, props: Object) {
   }
 }
 
-export function postMountWrapper(
+export function postInitInput(
   element: Element,
   props: Object,
   isHydrating: boolean,
@@ -337,9 +337,9 @@ export function postMountWrapper(
   }
 }
 
-export function restoreControlledState(element: Element, props: Object) {
+export function restoreControlledInputState(element: Element, props: Object) {
   const node = ((element: any): InputWithWrapperState);
-  updateWrapper(node, props);
+  updateInput(node, props);
   updateNamedCousins(node, props);
 }
 
@@ -391,7 +391,7 @@ function updateNamedCousins(rootNode: InputWithWrapperState, props: any) {
       // If this is a controlled radio button group, forcing the input that
       // was previously checked to update will cause it to be come re-checked
       // as appropriate.
-      updateWrapper(otherNode, otherProps);
+      updateInput(otherNode, otherProps);
     }
   }
 }
diff --git a/packages/react-dom-bindings/src/client/ReactDOMOption.js b/packages/react-dom-bindings/src/client/ReactDOMOption.js
index f3b8f12a7f16..8ab7b6289aec 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMOption.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMOption.js
@@ -18,7 +18,7 @@ let didWarnInvalidInnerHTML = false;
  * Implements an <option> host component that warns when `selected` is set.
  */
 
-export function validateProps(element: Element, props: Object) {
+export function validateOptionProps(element: Element, props: Object) {
   if (__DEV__) {
     // If a value is not provided, then the children must be simple.
     if (props.value == null) {
@@ -60,7 +60,7 @@ export function validateProps(element: Element, props: Object) {
   }
 }
 
-export function postMountWrapper(element: Element, props: Object) {
+export function postInitOption(element: Element, props: Object) {
   // value="" should make a value attribute (#6219)
   if (props.value != null) {
     element.setAttribute('value', toString(getToStringValue(props.value)));
diff --git a/packages/react-dom-bindings/src/client/ReactDOMSelect.js b/packages/react-dom-bindings/src/client/ReactDOMSelect.js
index a0a5a16c058e..b5e2e8ab8298 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMSelect.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMSelect.js
@@ -129,7 +129,7 @@ function updateOptions(
  * selected.
  */
 
-export function initWrapperState(element: Element, props: Object) {
+export function initSelect(element: Element, props: Object) {
   const node = ((element: any): SelectWithWrapperState);
   if (__DEV__) {
     checkSelectPropTypes(props);
@@ -157,7 +157,7 @@ export function initWrapperState(element: Element, props: Object) {
   }
 }
 
-export function postMountWrapper(element: Element, props: Object) {
+export function postInitSelect(element: Element, props: Object) {
   const node = ((element: any): SelectWithWrapperState);
   node.multiple = !!props.multiple;
   const value = props.value;
@@ -168,7 +168,7 @@ export function postMountWrapper(element: Element, props: Object) {
   }
 }
 
-export function postUpdateWrapper(element: Element, props: Object) {
+export function postUpdateSelect(element: Element, props: Object) {
   const node = ((element: any): SelectWithWrapperState);
   const wasMultiple = node._wrapperState.wasMultiple;
   node._wrapperState.wasMultiple = !!props.multiple;
@@ -187,7 +187,7 @@ export function postUpdateWrapper(element: Element, props: Object) {
   }
 }
 
-export function restoreControlledState(element: Element, props: Object) {
+export function restoreControlledSelectState(element: Element, props: Object) {
   const node = ((element: any): SelectWithWrapperState);
   const value = props.value;
 
diff --git a/packages/react-dom-bindings/src/client/ReactDOMTextarea.js b/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
index 2a76fc7fe057..f1202c3deee8 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
@@ -37,7 +37,7 @@ export type TextAreaWithWrapperState = HTMLTextAreaElement & {
  * `defaultValue` if specified, or the children content (deprecated).
  */
 
-export function initWrapperState(element: Element, props: Object) {
+export function initTextarea(element: Element, props: Object) {
   const node = ((element: any): TextAreaWithWrapperState);
   if (__DEV__) {
     checkControlledValueProps('textarea', props);
@@ -102,7 +102,7 @@ export function initWrapperState(element: Element, props: Object) {
   };
 }
 
-export function updateWrapper(element: Element, props: Object) {
+export function updateTextarea(element: Element, props: Object) {
   const node = ((element: any): TextAreaWithWrapperState);
   const value = getToStringValue(props.value);
   const defaultValue = getToStringValue(props.defaultValue);
@@ -123,7 +123,7 @@ export function updateWrapper(element: Element, props: Object) {
   }
 }
 
-export function postMountWrapper(element: Element, props: Object) {
+export function postInitTextarea(element: Element, props: Object) {
   const node = ((element: any): TextAreaWithWrapperState);
   // This is in postMount because we need access to the DOM node, which is not
   // available until after the component has mounted.
@@ -140,7 +140,10 @@ export function postMountWrapper(element: Element, props: Object) {
   }
 }
 
-export function restoreControlledState(element: Element, props: Object) {
+export function restoreControlledTextareaState(
+  element: Element,
+  props: Object,
+) {
   // DOM component is still mounted; update
-  updateWrapper(element, props);
+  updateTextarea(element, props);
 }

From f57beb1d419c721c94242ce35578a9285ddebd04 Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Thu, 6 Apr 2023 21:33:23 -0400
Subject: [PATCH 02/14] Use nullish checks instead of hasOwnProperty which is
 generally our semantics

---
 .../react-dom-bindings/src/client/ReactDOMInput.js     | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMInput.js b/packages/react-dom-bindings/src/client/ReactDOMInput.js
index 2367367b7523..f98bf67da888 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMInput.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMInput.js
@@ -190,7 +190,7 @@ export function updateInput(element: Element, props: Object) {
     // When not syncing the value attribute, React only assigns a new value
     // whenever the defaultValue React prop has changed. When not present,
     // React does nothing
-    if (props.hasOwnProperty('defaultValue')) {
+    if (props.defaultValue != null) {
       setDefaultValue(node, props.type, getToStringValue(props.defaultValue));
     }
   } else {
@@ -199,9 +199,9 @@ export function updateInput(element: Element, props: Object) {
     //  1. The value React property
     //  2. The defaultValue React property
     //  3. Otherwise there should be no change
-    if (props.hasOwnProperty('value')) {
+    if (props.value != null) {
       setDefaultValue(node, props.type, value);
-    } else if (props.hasOwnProperty('defaultValue')) {
+    } else if (props.defaultValue != null) {
       setDefaultValue(node, props.type, getToStringValue(props.defaultValue));
     }
   }
@@ -233,7 +233,7 @@ export function postInitInput(
 
   // Do not assign value if it is already set. This prevents user text input
   // from being lost during SSR hydration.
-  if (props.hasOwnProperty('value') || props.hasOwnProperty('defaultValue')) {
+  if (props.value != null || props.defaultValue != null) {
     const type = props.type;
     const isButton = type === 'submit' || type === 'reset';
 
@@ -317,7 +317,7 @@ export function postInitInput(
     // Only assign the checked attribute if it is defined. This saves
     // a DOM write when controlling the checked attribute isn't needed
     // (text inputs, submit/reset)
-    if (props.hasOwnProperty('defaultChecked')) {
+    if (props.defaultChecked != null) {
       node.defaultChecked = !node.defaultChecked;
       node.defaultChecked = !!props.defaultChecked;
     }

From 0e0af20fb883e09cce410183e688871e34f0249d Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Thu, 6 Apr 2023 21:47:04 -0400
Subject: [PATCH 03/14] Move init and postInit together to show that this
 doesn't matter

There's a subtle difference when checked turns to null we now use the
defaultChecked prop instead of initialChecked.
---
 .../src/client/ReactDOMComponent.js           | 26 +++++++++----------
 1 file changed, 12 insertions(+), 14 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMComponent.js b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
index a3a8d6a33819..235d44909055 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMComponent.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
@@ -7,8 +7,6 @@
  * @flow
  */
 
-import type {InputWithWrapperState} from './ReactDOMInput';
-
 import {
   registrationNameDependencies,
   possibleRegistrationNames,
@@ -802,7 +800,6 @@ export function setInitialProperties(
       break;
     }
     case 'input': {
-      initInput(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
@@ -831,10 +828,10 @@ export function setInitialProperties(
             break;
           }
           case 'checked': {
-            const node = ((domElement: any): InputWithWrapperState);
             const checked =
-              propValue != null ? propValue : node._wrapperState.initialChecked;
-            node.checked =
+              propValue != null ? propValue : props.defaultChecked;
+            const inputElement: HTMLInputElement = (domElement: any);
+            inputElement.checked =
               !!checked &&
               typeof checked !== 'function' &&
               checked !== 'symbol';
@@ -863,11 +860,11 @@ export function setInitialProperties(
       // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
       track((domElement: any));
+      initInput(domElement, props);
       postInitInput(domElement, props, false);
       return;
     }
     case 'select': {
-      initSelect(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
@@ -890,11 +887,11 @@ export function setInitialProperties(
           }
         }
       }
+      initSelect(domElement, props);
       postInitSelect(domElement, props);
       return;
     }
     case 'textarea': {
-      initTextarea(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
@@ -933,6 +930,7 @@ export function setInitialProperties(
       // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
       track((domElement: any));
+      initTextarea(domElement, props);
       postInitTextarea(domElement, props);
       return;
     }
@@ -1217,10 +1215,10 @@ export function updateProperties(
         const propValue = updatePayload[i + 1];
         switch (propKey) {
           case 'checked': {
-            const node = ((domElement: any): InputWithWrapperState);
             const checked =
-              propValue != null ? propValue : node._wrapperState.initialChecked;
-            node.checked =
+              propValue != null ? propValue : nextProps.defaultChecked;
+            const inputElement: HTMLInputElement = (domElement: any);
+            inputElement.checked =
               !!checked &&
               typeof checked !== 'function' &&
               checked !== 'symbol';
@@ -2260,13 +2258,13 @@ export function diffHydratedProperties(
       listenToNonDelegatedEvent('toggle', domElement);
       break;
     case 'input':
-      initInput(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
       // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
       track((domElement: any));
+      initInput(domElement, props);
       // For input and textarea we current always set the value property at
       // post mount to force it to diverge from attributes. However, for
       // option and select we don't quite do the same thing and select
@@ -2278,19 +2276,19 @@ export function diffHydratedProperties(
       validateOptionProps(domElement, props);
       break;
     case 'select':
-      initSelect(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
+      initSelect(domElement, props);
       break;
     case 'textarea':
-      initTextarea(domElement, props);
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
       // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
       track((domElement: any));
+      initTextarea(domElement, props);
       postInitTextarea(domElement, props);
       break;
   }

From 0c9c688a11ecf2576e406050f5ce0415c854c0e8 Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Thu, 6 Apr 2023 22:02:46 -0400
Subject: [PATCH 04/14] Move checkControlledValueProps to ReactDOMComponent

This lines up better with how this is done on the server already.
---
 .../src/client/ReactDOMComponent.js           | 19 +++++++++++++++++++
 .../src/client/ReactDOMInput.js               |  3 ---
 .../src/client/ReactDOMSelect.js              |  3 ---
 .../src/client/ReactDOMTextarea.js            |  2 --
 4 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMComponent.js b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
index 235d44909055..4ca3175a9a72 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMComponent.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
@@ -15,6 +15,7 @@ import {
 import {canUseDOM} from 'shared/ExecutionEnvironment';
 import {checkHtmlStringCoercion} from 'shared/CheckStringCoercion';
 import {checkAttributeStringCoercion} from 'shared/CheckStringCoercion';
+import {checkControlledValueProps} from '../shared/ReactControlledValuePropTypes';
 
 import {
   getValueForAttribute,
@@ -800,6 +801,9 @@ export function setInitialProperties(
       break;
     }
     case 'input': {
+      if (__DEV__) {
+        checkControlledValueProps('input', props);
+      }
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
@@ -865,6 +869,9 @@ export function setInitialProperties(
       return;
     }
     case 'select': {
+      if (__DEV__) {
+        checkControlledValueProps('select', props);
+      }
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
@@ -892,6 +899,9 @@ export function setInitialProperties(
       return;
     }
     case 'textarea': {
+      if (__DEV__) {
+        checkControlledValueProps('textarea', props);
+      }
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
@@ -2258,6 +2268,9 @@ export function diffHydratedProperties(
       listenToNonDelegatedEvent('toggle', domElement);
       break;
     case 'input':
+      if (__DEV__) {
+        checkControlledValueProps('input', props);
+      }
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
@@ -2276,12 +2289,18 @@ export function diffHydratedProperties(
       validateOptionProps(domElement, props);
       break;
     case 'select':
+      if (__DEV__) {
+        checkControlledValueProps('select', props);
+      }
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
       initSelect(domElement, props);
       break;
     case 'textarea':
+      if (__DEV__) {
+        checkControlledValueProps('textarea', props);
+      }
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
diff --git a/packages/react-dom-bindings/src/client/ReactDOMInput.js b/packages/react-dom-bindings/src/client/ReactDOMInput.js
index f98bf67da888..3a09e9f8d641 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMInput.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMInput.js
@@ -12,7 +12,6 @@ import {getCurrentFiberOwnerNameInDevOrNull} from 'react-reconciler/src/ReactCur
 
 import {getFiberCurrentPropsFromNode} from './ReactDOMComponentTree';
 import {getToStringValue, toString} from './ToStringValue';
-import {checkControlledValueProps} from '../shared/ReactControlledValuePropTypes';
 import {updateValueIfChanged} from './inputValueTracking';
 import getActiveElement from './getActiveElement';
 import {disableInputAttributeSyncing} from 'shared/ReactFeatureFlags';
@@ -63,8 +62,6 @@ function isControlled(props: any) {
 
 export function initInput(element: Element, props: Object) {
   if (__DEV__) {
-    checkControlledValueProps('input', props);
-
     if (
       props.checked !== undefined &&
       props.defaultChecked !== undefined &&
diff --git a/packages/react-dom-bindings/src/client/ReactDOMSelect.js b/packages/react-dom-bindings/src/client/ReactDOMSelect.js
index b5e2e8ab8298..61a53cf1514a 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMSelect.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMSelect.js
@@ -10,7 +10,6 @@
 // TODO: direct imports like some-package/src/* are bad. Fix me.
 import {getCurrentFiberOwnerNameInDevOrNull} from 'react-reconciler/src/ReactCurrentFiber';
 
-import {checkControlledValueProps} from '../shared/ReactControlledValuePropTypes';
 import {getToStringValue, toString} from './ToStringValue';
 import isArray from 'shared/isArray';
 
@@ -39,8 +38,6 @@ const valuePropNames = ['value', 'defaultValue'];
  */
 function checkSelectPropTypes(props: any) {
   if (__DEV__) {
-    checkControlledValueProps('select', props);
-
     for (let i = 0; i < valuePropNames.length; i++) {
       const propName = valuePropNames[i];
       if (props[propName] == null) {
diff --git a/packages/react-dom-bindings/src/client/ReactDOMTextarea.js b/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
index f1202c3deee8..c30bd2d6a851 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
@@ -9,7 +9,6 @@
 
 import isArray from 'shared/isArray';
 
-import {checkControlledValueProps} from '../shared/ReactControlledValuePropTypes';
 import {getCurrentFiberOwnerNameInDevOrNull} from 'react-reconciler/src/ReactCurrentFiber';
 import {getToStringValue, toString} from './ToStringValue';
 import type {ToStringValue} from './ToStringValue';
@@ -40,7 +39,6 @@ export type TextAreaWithWrapperState = HTMLTextAreaElement & {
 export function initTextarea(element: Element, props: Object) {
   const node = ((element: any): TextAreaWithWrapperState);
   if (__DEV__) {
-    checkControlledValueProps('textarea', props);
     if (
       props.value !== undefined &&
       props.defaultValue !== undefined &&

From e6f26c3c09e4b721bdf4b6aebd6edd7fb39dcca8 Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Sat, 8 Apr 2023 15:04:57 -0400
Subject: [PATCH 05/14] Fix tests

---
 packages/react-dom-bindings/src/client/ReactDOMInput.js | 5 +++--
 packages/react-dom/src/__tests__/ReactDOMInput-test.js  | 4 ++--
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMInput.js b/packages/react-dom-bindings/src/client/ReactDOMInput.js
index 3a09e9f8d641..f7a5d7888990 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMInput.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMInput.js
@@ -62,6 +62,9 @@ function isControlled(props: any) {
 
 export function initInput(element: Element, props: Object) {
   if (__DEV__) {
+    // Normally we check for undefined and null the same, but explicitly specifying both
+    // properties, at all is probably worth warning for. We could move this either direction
+    // and just make it ok to pass null or just check hasOwnProperty.
     if (
       props.checked !== undefined &&
       props.defaultChecked !== undefined &&
@@ -228,8 +231,6 @@ export function postInitInput(
 ) {
   const node = ((element: any): InputWithWrapperState);
 
-  // Do not assign value if it is already set. This prevents user text input
-  // from being lost during SSR hydration.
   if (props.value != null || props.defaultValue != null) {
     const type = props.type;
     const isButton = type === 'submit' || type === 'reset';
diff --git a/packages/react-dom/src/__tests__/ReactDOMInput-test.js b/packages/react-dom/src/__tests__/ReactDOMInput-test.js
index 64ee09f09abe..f829865efa5b 100644
--- a/packages/react-dom/src/__tests__/ReactDOMInput-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMInput-test.js
@@ -1955,7 +1955,7 @@ describe('ReactDOMInput', () => {
       if (disableInputAttributeSyncing) {
         expect(input.getAttribute('value')).toBe(null);
       } else {
-        expect(input.getAttribute('value')).toBe('first');
+        expect(input.getAttribute('value')).toBe('latest');
       }
     });
 
@@ -2005,7 +2005,7 @@ describe('ReactDOMInput', () => {
       if (disableInputAttributeSyncing) {
         expect(input.hasAttribute('value')).toBe(false);
       } else {
-        expect(input.getAttribute('value')).toBe('first');
+        expect(input.getAttribute('value')).toBe('latest');
       }
     });
 

From a0a47e580031b1e17046dc81385b3fb66b147ee9 Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Sun, 9 Apr 2023 15:00:45 -0400
Subject: [PATCH 06/14] setDefaultValue is always guarded by a null check

---
 packages/react-dom-bindings/src/client/ReactDOMInput.js | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMInput.js b/packages/react-dom-bindings/src/client/ReactDOMInput.js
index f7a5d7888990..a179d8e0855c 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMInput.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMInput.js
@@ -412,9 +412,7 @@ export function setDefaultValue(
     type !== 'number' ||
     getActiveElement(node.ownerDocument) !== node
   ) {
-    if (value == null) {
-      node.defaultValue = toString(node._wrapperState.initialValue);
-    } else if (node.defaultValue !== toString(value)) {
+    if (node.defaultValue !== toString(value)) {
       node.defaultValue = toString(value);
     }
   }

From 1ad8392ef46b115349a8433799614ee9e0aee3ef Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Sun, 9 Apr 2023 15:08:53 -0400
Subject: [PATCH 07/14] Since we just initialized the initial state, we can
 infer it from the same props

---
 .../src/client/ReactDOMInput.js               | 25 ++++++++++++++-----
 1 file changed, 19 insertions(+), 6 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMInput.js b/packages/react-dom-bindings/src/client/ReactDOMInput.js
index a179d8e0855c..fd1a29724a12 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMInput.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMInput.js
@@ -241,7 +241,14 @@ export function postInitInput(
       return;
     }
 
-    const initialValue = toString(node._wrapperState.initialValue);
+    const defaultValue =
+      props.defaultValue != null
+        ? toString(getToStringValue(props.defaultValue))
+        : '';
+    const initialValue =
+      props.value != null
+        ? toString(getToStringValue(props.value))
+        : defaultValue;
 
     // Do not assign value if it is already set. This prevents user text input
     // from being lost during SSR hydration.
@@ -280,9 +287,8 @@ export function postInitInput(
     if (disableInputAttributeSyncing) {
       // When not syncing the value attribute, assign the value attribute
       // directly from the defaultValue React property (when present)
-      const defaultValue = getToStringValue(props.defaultValue);
-      if (defaultValue != null) {
-        node.defaultValue = toString(defaultValue);
+      if (props.defaultValue != null) {
+        node.defaultValue = defaultValue;
       }
     } else {
       // Otherwise, the value attribute is synchronized to the property,
@@ -302,13 +308,20 @@ export function postInitInput(
     node.name = '';
   }
 
+  const defaultChecked =
+    props.checked != null ? props.checked : props.defaultChecked;
+  const initialChecked =
+    typeof defaultChecked !== 'function' &&
+    typeof defaultChecked !== 'symbol' &&
+    !!defaultChecked;
+
   // The checked property never gets assigned. It must be manually set.
   // We don't want to do this when hydrating so that existing user input isn't
   // modified
   // TODO: I'm pretty sure this is a bug because initialValueTracking won't be
   // correct for the hydration case then.
   if (!isHydrating) {
-    node.checked = !!node._wrapperState.initialChecked;
+    node.checked = !!initialChecked;
   }
 
   if (disableInputAttributeSyncing) {
@@ -327,7 +340,7 @@ export function postInitInput(
     //   2. The defaultChecked React property when present
     //   3. Otherwise, false
     node.defaultChecked = !node.defaultChecked;
-    node.defaultChecked = !!node._wrapperState.initialChecked;
+    node.defaultChecked = !!initialChecked;
   }
 
   if (name !== '') {

From 17abdbe69bbb7d9c7252f347d9bf4aff5ab27599 Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Sun, 9 Apr 2023 15:15:21 -0400
Subject: [PATCH 08/14] Move controlled warning to be done by last/next props

Check whether something is controlled from props in the event system.
---
 .../src/client/ReactDOMComponent.js           | 42 +++++++++++++++++++
 .../src/client/ReactDOMInput.js               | 40 ------------------
 .../src/client/inputValueTracking.js          |  1 -
 .../src/events/plugins/ChangeEventPlugin.js   | 21 ++++++----
 .../src/__tests__/ReactDOMComponent-test.js   | 13 ++++--
 5 files changed, 65 insertions(+), 52 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMComponent.js b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
index 4ca3175a9a72..4880c7735b47 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMComponent.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
@@ -75,6 +75,8 @@ import {
   listenToNonDelegatedEvent,
 } from '../events/DOMPluginEventSystem';
 
+let didWarnControlledToUncontrolled = false;
+let didWarnUncontrolledToControlled = false;
 let didWarnInvalidHydration = false;
 let canDiffStyleForHydrationWarning;
 if (__DEV__) {
@@ -1254,6 +1256,46 @@ export function updateProperties(
           }
         }
       }
+
+      if (__DEV__) {
+        const wasControlled =
+          lastProps.type === 'checkbox' || lastProps.type === 'radio'
+            ? lastProps.checked != null
+            : lastProps.value != null;
+        const isControlled =
+          nextProps.type === 'checkbox' || nextProps.type === 'radio'
+            ? nextProps.checked != null
+            : nextProps.value != null;
+
+        if (
+          !wasControlled &&
+          isControlled &&
+          !didWarnUncontrolledToControlled
+        ) {
+          console.error(
+            'A component is changing an uncontrolled input to be controlled. ' +
+              'This is likely caused by the value changing from undefined to ' +
+              'a defined value, which should not happen. ' +
+              'Decide between using a controlled or uncontrolled input ' +
+              'element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components',
+          );
+          didWarnUncontrolledToControlled = true;
+        }
+        if (
+          wasControlled &&
+          !isControlled &&
+          !didWarnControlledToUncontrolled
+        ) {
+          console.error(
+            'A component is changing a controlled input to be uncontrolled. ' +
+              'This is likely caused by the value changing from a defined to ' +
+              'undefined, which should not happen. ' +
+              'Decide between using a controlled or uncontrolled input ' +
+              'element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components',
+          );
+          didWarnControlledToUncontrolled = true;
+        }
+      }
       // Update the wrapper around inputs *after* updating props. This has to
       // happen after updating the rest of props. Otherwise HTML5 input validations
       // raise warnings and prevent the new value from being assigned.
diff --git a/packages/react-dom-bindings/src/client/ReactDOMInput.js b/packages/react-dom-bindings/src/client/ReactDOMInput.js
index fd1a29724a12..fa32139f7c6c 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMInput.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMInput.js
@@ -35,13 +35,6 @@ export type InputWithWrapperState = HTMLInputElement & {
 
 let didWarnValueDefaultValue = false;
 let didWarnCheckedDefaultChecked = false;
-let didWarnControlledToUncontrolled = false;
-let didWarnUncontrolledToControlled = false;
-
-function isControlled(props: any) {
-  const usesChecked = props.type === 'checkbox' || props.type === 'radio';
-  return usesChecked ? props.checked != null : props.value != null;
-}
 
 /**
  * Implements an <input> host component that allows setting these optional
@@ -113,7 +106,6 @@ export function initInput(element: Element, props: Object) {
     initialValue: getToStringValue(
       props.value != null ? props.value : defaultValue,
     ),
-    controlled: isControlled(props),
   };
 }
 
@@ -127,38 +119,6 @@ export function updateInputChecked(element: Element, props: Object) {
 
 export function updateInput(element: Element, props: Object) {
   const node = ((element: any): InputWithWrapperState);
-  if (__DEV__) {
-    const controlled = isControlled(props);
-
-    if (
-      !node._wrapperState.controlled &&
-      controlled &&
-      !didWarnUncontrolledToControlled
-    ) {
-      console.error(
-        'A component is changing an uncontrolled input to be controlled. ' +
-          'This is likely caused by the value changing from undefined to ' +
-          'a defined value, which should not happen. ' +
-          'Decide between using a controlled or uncontrolled input ' +
-          'element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components',
-      );
-      didWarnUncontrolledToControlled = true;
-    }
-    if (
-      node._wrapperState.controlled &&
-      !controlled &&
-      !didWarnControlledToUncontrolled
-    ) {
-      console.error(
-        'A component is changing a controlled input to be uncontrolled. ' +
-          'This is likely caused by the value changing from a defined to ' +
-          'undefined, which should not happen. ' +
-          'Decide between using a controlled or uncontrolled input ' +
-          'element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components',
-      );
-      didWarnControlledToUncontrolled = true;
-    }
-  }
 
   updateInputChecked(element, props);
 
diff --git a/packages/react-dom-bindings/src/client/inputValueTracking.js b/packages/react-dom-bindings/src/client/inputValueTracking.js
index a2ad273a67d1..5e1ca5868781 100644
--- a/packages/react-dom-bindings/src/client/inputValueTracking.js
+++ b/packages/react-dom-bindings/src/client/inputValueTracking.js
@@ -123,7 +123,6 @@ export function track(node: ElementWithValueTracker) {
     return;
   }
 
-  // TODO: Once it's just Fiber we can move this to node._wrapperState
   node._valueTracker = trackValueOnNode(node);
 }
 
diff --git a/packages/react-dom-bindings/src/events/plugins/ChangeEventPlugin.js b/packages/react-dom-bindings/src/events/plugins/ChangeEventPlugin.js
index baa33f1a7c5c..fddc50101351 100644
--- a/packages/react-dom-bindings/src/events/plugins/ChangeEventPlugin.js
+++ b/packages/react-dom-bindings/src/events/plugins/ChangeEventPlugin.js
@@ -263,16 +263,17 @@ function getTargetInstForInputOrChangeEvent(
   }
 }
 
-function handleControlledInputBlur(node: HTMLInputElement) {
-  const state = (node: any)._wrapperState;
-
-  if (!state || !state.controlled || node.type !== 'number') {
+function handleControlledInputBlur(node: HTMLInputElement, props: any) {
+  if (node.type !== 'number') {
     return;
   }
 
   if (!disableInputAttributeSyncing) {
-    // If controlled, assign the value attribute to the current value on blur
-    setDefaultValue((node: any), 'number', (node: any).value);
+    const isControlled = props.value != null;
+    if (isControlled) {
+      // If controlled, assign the value attribute to the current value on blur
+      setDefaultValue((node: any), 'number', (node: any).value);
+    }
   }
 }
 
@@ -335,8 +336,12 @@ function extractEvents(
   }
 
   // When blurring, set the value attribute for number inputs
-  if (domEventName === 'focusout') {
-    handleControlledInputBlur(((targetNode: any): HTMLInputElement));
+  if (domEventName === 'focusout' && targetInst) {
+    // These props aren't necessarily the most current but we warn for changing
+    // between controlled and uncontrolled, so it doesn't matter and the previous
+    // code was also broken for changes.
+    const props = targetInst.memoizedProps;
+    handleControlledInputBlur(((targetNode: any): HTMLInputElement), props);
   }
 }
 
diff --git a/packages/react-dom/src/__tests__/ReactDOMComponent-test.js b/packages/react-dom/src/__tests__/ReactDOMComponent-test.js
index f373af9335ea..b8c91fb86e18 100644
--- a/packages/react-dom/src/__tests__/ReactDOMComponent-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMComponent-test.js
@@ -1083,10 +1083,17 @@ describe('ReactDOMComponent', () => {
       );
       expect(nodeValueSetter).toHaveBeenCalledTimes(1);
 
-      ReactDOM.render(
-        <input type="checkbox" onChange={onChange} checked={false} />,
-        container,
+      expect(() => {
+        ReactDOM.render(
+          <input type="checkbox" onChange={onChange} checked={false} />,
+          container,
+        );
+      }).toErrorDev(
+        ' A component is changing an uncontrolled input to be controlled. This is likely caused by ' +
+          'the value changing from undefined to a defined value, which should not happen. Decide between ' +
+          'using a controlled or uncontrolled input element for the lifetime of the component.',
       );
+
       // TODO: Non-null values are updated twice on inputs. This is should ideally be fixed.
       expect(nodeValueSetter).toHaveBeenCalledTimes(3);
 

From b3e97c59bd092a40560ffa9792a68f12ee7ee97b Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Sun, 9 Apr 2023 15:41:46 -0400
Subject: [PATCH 09/14] Delete wrapperState

We don't use it anymore.
---
 .../src/client/ReactDOMInput.js               | 40 +++----------------
 1 file changed, 6 insertions(+), 34 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMInput.js b/packages/react-dom-bindings/src/client/ReactDOMInput.js
index fa32139f7c6c..1416df94ebdc 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMInput.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMInput.js
@@ -19,20 +19,6 @@ import {checkAttributeStringCoercion} from 'shared/CheckStringCoercion';
 
 import type {ToStringValue} from './ToStringValue';
 
-export type InputWithWrapperState = HTMLInputElement & {
-  _wrapperState: {
-    initialValue: ToStringValue,
-    initialChecked: ?boolean,
-    controlled?: boolean,
-    ...
-  },
-  checked: boolean,
-  value: string,
-  defaultChecked: boolean,
-  defaultValue: string,
-  ...
-};
-
 let didWarnValueDefaultValue = false;
 let didWarnCheckedDefaultChecked = false;
 
@@ -93,24 +79,10 @@ export function initInput(element: Element, props: Object) {
       didWarnValueDefaultValue = true;
     }
   }
-
-  const node = ((element: any): InputWithWrapperState);
-  const defaultValue = props.defaultValue == null ? '' : props.defaultValue;
-  const initialChecked =
-    props.checked != null ? props.checked : props.defaultChecked;
-  node._wrapperState = {
-    initialChecked:
-      typeof initialChecked !== 'function' &&
-      typeof initialChecked !== 'symbol' &&
-      !!initialChecked,
-    initialValue: getToStringValue(
-      props.value != null ? props.value : defaultValue,
-    ),
-  };
 }
 
 export function updateInputChecked(element: Element, props: Object) {
-  const node = ((element: any): InputWithWrapperState);
+  const node: HTMLInputElement = (element: any);
   const checked = props.checked;
   if (checked != null) {
     node.checked = checked;
@@ -118,7 +90,7 @@ export function updateInputChecked(element: Element, props: Object) {
 }
 
 export function updateInput(element: Element, props: Object) {
-  const node = ((element: any): InputWithWrapperState);
+  const node: HTMLInputElement = (element: any);
 
   updateInputChecked(element, props);
 
@@ -189,7 +161,7 @@ export function postInitInput(
   props: Object,
   isHydrating: boolean,
 ) {
-  const node = ((element: any): InputWithWrapperState);
+  const node: HTMLInputElement = (element: any);
 
   if (props.value != null || props.defaultValue != null) {
     const type = props.type;
@@ -309,12 +281,12 @@ export function postInitInput(
 }
 
 export function restoreControlledInputState(element: Element, props: Object) {
-  const node = ((element: any): InputWithWrapperState);
+  const node: HTMLInputElement = (element: any);
   updateInput(node, props);
   updateNamedCousins(node, props);
 }
 
-function updateNamedCousins(rootNode: InputWithWrapperState, props: any) {
+function updateNamedCousins(rootNode: HTMLInputElement, props: any) {
   const name = props.name;
   if (props.type === 'radio' && name != null) {
     let queryRoot: Element = rootNode;
@@ -376,7 +348,7 @@ function updateNamedCousins(rootNode: InputWithWrapperState, props: any) {
 //
 // https://github.com/facebook/react/issues/7253
 export function setDefaultValue(
-  node: InputWithWrapperState,
+  node: HTMLInputElement,
   type: ?string,
   value: ToStringValue,
 ) {

From 63b40e53b120c78087dd216a440bae3a1919ee3c Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Sun, 9 Apr 2023 16:29:56 -0400
Subject: [PATCH 10/14] Textarea only initializes the wrapper state to read it
 at the same time

It can be derived from props.
---
 .../src/client/ReactDOMTextarea.js            | 72 +++++++++----------
 1 file changed, 32 insertions(+), 40 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMTextarea.js b/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
index c30bd2d6a851..c76fada72359 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
@@ -11,15 +11,10 @@ import isArray from 'shared/isArray';
 
 import {getCurrentFiberOwnerNameInDevOrNull} from 'react-reconciler/src/ReactCurrentFiber';
 import {getToStringValue, toString} from './ToStringValue';
-import type {ToStringValue} from './ToStringValue';
 import {disableTextareaChildren} from 'shared/ReactFeatureFlags';
 
 let didWarnValDefaultVal = false;
 
-export type TextAreaWithWrapperState = HTMLTextAreaElement & {
-  _wrapperState: {initialValue: ToStringValue},
-};
-
 /**
  * Implements a <textarea> host component that allows setting `value`, and
  * `defaultValue`. This differs from the traditional DOM API because value is
@@ -37,7 +32,6 @@ export type TextAreaWithWrapperState = HTMLTextAreaElement & {
  */
 
 export function initTextarea(element: Element, props: Object) {
-  const node = ((element: any): TextAreaWithWrapperState);
   if (__DEV__) {
     if (
       props.value !== undefined &&
@@ -55,7 +49,38 @@ export function initTextarea(element: Element, props: Object) {
       );
       didWarnValDefaultVal = true;
     }
+    if (props.children != null && props.value == null) {
+      console.error(
+        'Use the `defaultValue` or `value` props instead of setting ' +
+          'children on <textarea>.',
+      );
+    }
   }
+}
+
+export function updateTextarea(element: Element, props: Object) {
+  const node: HTMLTextAreaElement = (element: any);
+  const value = getToStringValue(props.value);
+  const defaultValue = getToStringValue(props.defaultValue);
+  if (value != null) {
+    // Cast `value` to a string to ensure the value is set correctly. While
+    // browsers typically do this as necessary, jsdom doesn't.
+    const newValue = toString(value);
+    // To avoid side effects (such as losing text selection), only set value if changed
+    if (newValue !== node.value) {
+      node.value = newValue;
+    }
+    if (props.defaultValue == null && node.defaultValue !== newValue) {
+      node.defaultValue = newValue;
+    }
+  }
+  if (defaultValue != null) {
+    node.defaultValue = toString(defaultValue);
+  }
+}
+
+export function postInitTextarea(element: Element, props: Object) {
+  const node: HTMLTextAreaElement = (element: any);
 
   let initialValue = props.value;
 
@@ -63,12 +88,6 @@ export function initTextarea(element: Element, props: Object) {
   if (initialValue == null) {
     let {children, defaultValue} = props;
     if (children != null) {
-      if (__DEV__) {
-        console.error(
-          'Use the `defaultValue` or `value` props instead of setting ' +
-            'children on <textarea>.',
-        );
-      }
       if (!disableTextareaChildren) {
         if (defaultValue != null) {
           throw new Error(
@@ -95,34 +114,7 @@ export function initTextarea(element: Element, props: Object) {
 
   const stringValue = getToStringValue(initialValue);
   node.defaultValue = (stringValue: any); // This will be toString:ed.
-  node._wrapperState = {
-    initialValue: stringValue,
-  };
-}
 
-export function updateTextarea(element: Element, props: Object) {
-  const node = ((element: any): TextAreaWithWrapperState);
-  const value = getToStringValue(props.value);
-  const defaultValue = getToStringValue(props.defaultValue);
-  if (value != null) {
-    // Cast `value` to a string to ensure the value is set correctly. While
-    // browsers typically do this as necessary, jsdom doesn't.
-    const newValue = toString(value);
-    // To avoid side effects (such as losing text selection), only set value if changed
-    if (newValue !== node.value) {
-      node.value = newValue;
-    }
-    if (props.defaultValue == null && node.defaultValue !== newValue) {
-      node.defaultValue = newValue;
-    }
-  }
-  if (defaultValue != null) {
-    node.defaultValue = toString(defaultValue);
-  }
-}
-
-export function postInitTextarea(element: Element, props: Object) {
-  const node = ((element: any): TextAreaWithWrapperState);
   // This is in postMount because we need access to the DOM node, which is not
   // available until after the component has mounted.
   const textContent = node.textContent;
@@ -131,7 +123,7 @@ export function postInitTextarea(element: Element, props: Object) {
   // initial value. In IE10/IE11 there is a bug where the placeholder attribute
   // will populate textContent as well.
   // https://developer.microsoft.com/microsoft-edge/platform/issues/101525/
-  if (textContent === node._wrapperState.initialValue) {
+  if (textContent === stringValue) {
     if (textContent !== '' && textContent !== null) {
       node.value = textContent;
     }

From 18a5a9faf2253f614fc8ee9c3a8f9113894588df Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Sun, 9 Apr 2023 16:36:12 -0400
Subject: [PATCH 11/14] Remove wrapperState from select

wasMultiple can be derived from props instead
---
 .../src/client/ReactDOMComponent.js           |  4 +--
 .../src/client/ReactDOMSelect.js              | 27 +++++++------------
 2 files changed, 11 insertions(+), 20 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMComponent.js b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
index 4880c7735b47..39867a227f68 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMComponent.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
@@ -37,7 +37,7 @@ import {
   initSelect,
   postInitSelect,
   restoreControlledSelectState,
-  postUpdateSelect,
+  updateSelect,
 } from './ReactDOMSelect';
 import {
   initTextarea,
@@ -1319,7 +1319,7 @@ export function updateProperties(
       }
       // <select> value update needs to occur after <option> children
       // reconciliation
-      postUpdateSelect(domElement, nextProps);
+      updateSelect(domElement, lastProps, nextProps);
       return;
     }
     case 'textarea': {
diff --git a/packages/react-dom-bindings/src/client/ReactDOMSelect.js b/packages/react-dom-bindings/src/client/ReactDOMSelect.js
index 61a53cf1514a..3286e5e51172 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMSelect.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMSelect.js
@@ -19,10 +19,6 @@ if (__DEV__) {
   didWarnValueDefaultValue = false;
 }
 
-type SelectWithWrapperState = HTMLSelectElement & {
-  _wrapperState: {wasMultiple: boolean},
-};
-
 function getDeclarationErrorAddendum() {
   const ownerName = getCurrentFiberOwnerNameInDevOrNull();
   if (ownerName) {
@@ -127,16 +123,8 @@ function updateOptions(
  */
 
 export function initSelect(element: Element, props: Object) {
-  const node = ((element: any): SelectWithWrapperState);
   if (__DEV__) {
     checkSelectPropTypes(props);
-  }
-
-  node._wrapperState = {
-    wasMultiple: !!props.multiple,
-  };
-
-  if (__DEV__) {
     if (
       props.value !== undefined &&
       props.defaultValue !== undefined &&
@@ -155,7 +143,7 @@ export function initSelect(element: Element, props: Object) {
 }
 
 export function postInitSelect(element: Element, props: Object) {
-  const node = ((element: any): SelectWithWrapperState);
+  const node: HTMLSelectElement = (element: any);
   node.multiple = !!props.multiple;
   const value = props.value;
   if (value != null) {
@@ -165,10 +153,13 @@ export function postInitSelect(element: Element, props: Object) {
   }
 }
 
-export function postUpdateSelect(element: Element, props: Object) {
-  const node = ((element: any): SelectWithWrapperState);
-  const wasMultiple = node._wrapperState.wasMultiple;
-  node._wrapperState.wasMultiple = !!props.multiple;
+export function updateSelect(
+  element: Element,
+  prevProps: Object,
+  props: Object,
+) {
+  const node: HTMLSelectElement = (element: any);
+  const wasMultiple = !!prevProps.multiple;
 
   const value = props.value;
   if (value != null) {
@@ -185,7 +176,7 @@ export function postUpdateSelect(element: Element, props: Object) {
 }
 
 export function restoreControlledSelectState(element: Element, props: Object) {
-  const node = ((element: any): SelectWithWrapperState);
+  const node: HTMLSelectElement = (element: any);
   const value = props.value;
 
   if (value != null) {

From 2019ddc75f448292ffa6429d7625514af192631b Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Sun, 9 Apr 2023 16:19:31 -0400
Subject: [PATCH 12/14] Delete value attribute when defaultValue sets back to
 null/missing

For some types, this already resets the value, so if we also have a value
we want to set that after. So this moves to updating defaultValue before
value.
---
 .../src/client/ReactDOMInput.js               | 50 ++++++++++---------
 .../__tests__/DOMPropertyOperations-test.js   |  6 +--
 .../src/__tests__/ReactDOMInput-test.js       | 38 ++++++++++----
 3 files changed, 56 insertions(+), 38 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMInput.js b/packages/react-dom-bindings/src/client/ReactDOMInput.js
index 1416df94ebdc..a1805c9e65a6 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMInput.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMInput.js
@@ -92,38 +92,17 @@ export function updateInputChecked(element: Element, props: Object) {
 export function updateInput(element: Element, props: Object) {
   const node: HTMLInputElement = (element: any);
 
-  updateInputChecked(element, props);
-
   const value = getToStringValue(props.value);
   const type = props.type;
 
-  if (value != null) {
-    if (type === 'number') {
-      if (
-        // $FlowFixMe[incompatible-type]
-        (value === 0 && node.value === '') ||
-        // We explicitly want to coerce to number here if possible.
-        // eslint-disable-next-line
-        node.value != (value: any)
-      ) {
-        node.value = toString((value: any));
-      }
-    } else if (node.value !== toString((value: any))) {
-      node.value = toString((value: any));
-    }
-  } else if (type === 'submit' || type === 'reset') {
-    // Submit/reset inputs need the attribute removed completely to avoid
-    // blank-text buttons.
-    node.removeAttribute('value');
-    return;
-  }
-
   if (disableInputAttributeSyncing) {
     // When not syncing the value attribute, React only assigns a new value
     // whenever the defaultValue React prop has changed. When not present,
     // React does nothing
     if (props.defaultValue != null) {
       setDefaultValue(node, props.type, getToStringValue(props.defaultValue));
+    } else {
+      node.removeAttribute('value');
     }
   } else {
     // When syncing the value attribute, the value comes from a cascade of
@@ -135,6 +114,8 @@ export function updateInput(element: Element, props: Object) {
       setDefaultValue(node, props.type, value);
     } else if (props.defaultValue != null) {
       setDefaultValue(node, props.type, getToStringValue(props.defaultValue));
+    } else {
+      node.removeAttribute('value');
     }
   }
 
@@ -154,6 +135,29 @@ export function updateInput(element: Element, props: Object) {
       node.defaultChecked = !!props.defaultChecked;
     }
   }
+
+  updateInputChecked(element, props);
+
+  if (value != null) {
+    if (type === 'number') {
+      if (
+        // $FlowFixMe[incompatible-type]
+        (value === 0 && node.value === '') ||
+        // We explicitly want to coerce to number here if possible.
+        // eslint-disable-next-line
+        node.value != (value: any)
+      ) {
+        node.value = toString((value: any));
+      }
+    } else if (node.value !== toString((value: any))) {
+      node.value = toString((value: any));
+    }
+  } else if (type === 'submit' || type === 'reset') {
+    // Submit/reset inputs need the attribute removed completely to avoid
+    // blank-text buttons.
+    node.removeAttribute('value');
+    return;
+  }
 }
 
 export function postInitInput(
diff --git a/packages/react-dom/src/__tests__/DOMPropertyOperations-test.js b/packages/react-dom/src/__tests__/DOMPropertyOperations-test.js
index bf523c4494e8..67d6f7bd465a 100644
--- a/packages/react-dom/src/__tests__/DOMPropertyOperations-test.js
+++ b/packages/react-dom/src/__tests__/DOMPropertyOperations-test.js
@@ -1166,11 +1166,7 @@ describe('DOMPropertyOperations', () => {
       ).toErrorDev(
         'A component is changing a controlled input to be uncontrolled',
       );
-      if (disableInputAttributeSyncing) {
-        expect(container.firstChild.hasAttribute('value')).toBe(false);
-      } else {
-        expect(container.firstChild.getAttribute('value')).toBe('foo');
-      }
+      expect(container.firstChild.hasAttribute('value')).toBe(false);
       expect(container.firstChild.value).toBe('foo');
     });
 
diff --git a/packages/react-dom/src/__tests__/ReactDOMInput-test.js b/packages/react-dom/src/__tests__/ReactDOMInput-test.js
index f829865efa5b..47fca9522fac 100644
--- a/packages/react-dom/src/__tests__/ReactDOMInput-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMInput-test.js
@@ -1952,11 +1952,7 @@ describe('ReactDOMInput', () => {
       expect(renderInputWithStringThenWithUndefined).toErrorDev(
         'A component is changing a controlled input to be uncontrolled.',
       );
-      if (disableInputAttributeSyncing) {
-        expect(input.getAttribute('value')).toBe(null);
-      } else {
-        expect(input.getAttribute('value')).toBe('latest');
-      }
+      expect(input.getAttribute('value')).toBe(null);
     });
 
     it('preserves the value property', () => {
@@ -2002,11 +1998,7 @@ describe('ReactDOMInput', () => {
           'or `undefined` for uncontrolled components.',
         'A component is changing a controlled input to be uncontrolled.',
       ]);
-      if (disableInputAttributeSyncing) {
-        expect(input.hasAttribute('value')).toBe(false);
-      } else {
-        expect(input.getAttribute('value')).toBe('latest');
-      }
+      expect(input.hasAttribute('value')).toBe(false);
     });
 
     it('preserves the value property', () => {
@@ -2165,4 +2157,30 @@ describe('ReactDOMInput', () => {
       expect(node.hasAttribute('value')).toBe(false);
     });
   });
+
+  it('should remove previous `defaultValue`', () => {
+    const node = ReactDOM.render(
+      <input type="text" defaultValue="0" />,
+      container,
+    );
+
+    expect(node.value).toBe('0');
+    expect(node.defaultValue).toBe('0');
+
+    ReactDOM.render(<input type="text" />, container);
+    expect(node.defaultValue).toBe('');
+  });
+
+  it('should treat `defaultValue={null}` as missing', () => {
+    const node = ReactDOM.render(
+      <input type="text" defaultValue="0" />,
+      container,
+    );
+
+    expect(node.value).toBe('0');
+    expect(node.defaultValue).toBe('0');
+
+    ReactDOM.render(<input type="text" defaultValue={null} />, container);
+    expect(node.defaultValue).toBe('');
+  });
 });

From b263fa3475b5ee52d71004abc9bc91cd5e82f8da Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Sun, 9 Apr 2023 16:39:56 -0400
Subject: [PATCH 13/14] Reset textarea to empty after defaultValue is removed
 or null

This doesn't have an attribute to be removed so we just reset it to empty string.
---
 .../src/client/ReactDOMTextarea.js            |  9 +++++---
 .../src/__tests__/ReactDOMTextarea-test.js    | 22 +++++++++++++++++++
 2 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMTextarea.js b/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
index c76fada72359..4b3a47ed8392 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
@@ -62,6 +62,11 @@ export function updateTextarea(element: Element, props: Object) {
   const node: HTMLTextAreaElement = (element: any);
   const value = getToStringValue(props.value);
   const defaultValue = getToStringValue(props.defaultValue);
+  if (defaultValue != null) {
+    node.defaultValue = toString(defaultValue);
+  } else {
+    node.defaultValue = '';
+  }
   if (value != null) {
     // Cast `value` to a string to ensure the value is set correctly. While
     // browsers typically do this as necessary, jsdom doesn't.
@@ -70,13 +75,11 @@ export function updateTextarea(element: Element, props: Object) {
     if (newValue !== node.value) {
       node.value = newValue;
     }
+    // TOOO: This should respect disableInputAttributeSyncing flag.
     if (props.defaultValue == null && node.defaultValue !== newValue) {
       node.defaultValue = newValue;
     }
   }
-  if (defaultValue != null) {
-    node.defaultValue = toString(defaultValue);
-  }
 }
 
 export function postInitTextarea(element: Element, props: Object) {
diff --git a/packages/react-dom/src/__tests__/ReactDOMTextarea-test.js b/packages/react-dom/src/__tests__/ReactDOMTextarea-test.js
index c926224afbc0..396eef8d6d34 100644
--- a/packages/react-dom/src/__tests__/ReactDOMTextarea-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMTextarea-test.js
@@ -736,4 +736,26 @@ describe('ReactDOMTextarea', () => {
       expect(node.value).toBe('foo');
     });
   });
+
+  it('should remove previous `defaultValue`', () => {
+    const container = document.createElement('div');
+    const node = ReactDOM.render(<textarea defaultValue="0" />, container);
+
+    expect(node.value).toBe('0');
+    expect(node.defaultValue).toBe('0');
+
+    ReactDOM.render(<textarea />, container);
+    expect(node.defaultValue).toBe('');
+  });
+
+  it('should treat `defaultValue={null}` as missing', () => {
+    const container = document.createElement('div');
+    const node = ReactDOM.render(<textarea defaultValue="0" />, container);
+
+    expect(node.value).toBe('0');
+    expect(node.defaultValue).toBe('0');
+
+    ReactDOM.render(<textarea defaultValue={null} />, container);
+    expect(node.defaultValue).toBe('');
+  });
 });

From 91f701482508321164eb35d59331e4d9bf99c409 Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Sun, 9 Apr 2023 16:45:38 -0400
Subject: [PATCH 14/14] Rename initX to validateXProps and postInitX to initX

Since the init is now just validation I rename those methods appropriately.

Since postInit is now just where initialization happens, that's just init.
---
 .../src/client/ReactDOMComponent.js           | 26 +++++++++----------
 .../src/client/ReactDOMInput.js               |  4 +--
 .../src/client/ReactDOMOption.js              |  2 +-
 .../src/client/ReactDOMSelect.js              |  4 +--
 .../src/client/ReactDOMTextarea.js            |  4 +--
 5 files changed, 20 insertions(+), 20 deletions(-)

diff --git a/packages/react-dom-bindings/src/client/ReactDOMComponent.js b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
index 39867a227f68..4e1ecda7857f 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMComponent.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
@@ -26,22 +26,22 @@ import {
   setValueForNamespacedAttribute,
 } from './DOMPropertyOperations';
 import {
+  validateInputProps,
   initInput,
-  postInitInput,
   updateInputChecked,
   updateInput,
   restoreControlledInputState,
 } from './ReactDOMInput';
-import {postInitOption, validateOptionProps} from './ReactDOMOption';
+import {initOption, validateOptionProps} from './ReactDOMOption';
 import {
+  validateSelectProps,
   initSelect,
-  postInitSelect,
   restoreControlledSelectState,
   updateSelect,
 } from './ReactDOMSelect';
 import {
+  validateTextareaProps,
   initTextarea,
-  postInitTextarea,
   updateTextarea,
   restoreControlledTextareaState,
 } from './ReactDOMTextarea';
@@ -866,8 +866,8 @@ export function setInitialProperties(
       // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
       track((domElement: any));
-      initInput(domElement, props);
-      postInitInput(domElement, props, false);
+      validateInputProps(domElement, props);
+      initInput(domElement, props, false);
       return;
     }
     case 'select': {
@@ -896,8 +896,8 @@ export function setInitialProperties(
           }
         }
       }
+      validateSelectProps(domElement, props);
       initSelect(domElement, props);
-      postInitSelect(domElement, props);
       return;
     }
     case 'textarea': {
@@ -942,8 +942,8 @@ export function setInitialProperties(
       // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
       track((domElement: any));
+      validateTextareaProps(domElement, props);
       initTextarea(domElement, props);
-      postInitTextarea(domElement, props);
       return;
     }
     case 'option': {
@@ -970,7 +970,7 @@ export function setInitialProperties(
           }
         }
       }
-      postInitOption(domElement, props);
+      initOption(domElement, props);
       return;
     }
     case 'dialog': {
@@ -2319,13 +2319,13 @@ export function diffHydratedProperties(
       // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
       track((domElement: any));
-      initInput(domElement, props);
+      validateInputProps(domElement, props);
       // For input and textarea we current always set the value property at
       // post mount to force it to diverge from attributes. However, for
       // option and select we don't quite do the same thing and select
       // is not resilient to the DOM state changing so we don't do that here.
       // TODO: Consider not doing this for input and textarea.
-      postInitInput(domElement, props, true);
+      initInput(domElement, props, true);
       break;
     case 'option':
       validateOptionProps(domElement, props);
@@ -2337,7 +2337,7 @@ export function diffHydratedProperties(
       // We listen to this event in case to ensure emulated bubble
       // listeners still fire for the invalid event.
       listenToNonDelegatedEvent('invalid', domElement);
-      initSelect(domElement, props);
+      validateSelectProps(domElement, props);
       break;
     case 'textarea':
       if (__DEV__) {
@@ -2349,8 +2349,8 @@ export function diffHydratedProperties(
       // TODO: Make sure we check if this is still unmounted or do any clean
       // up necessary since we never stop tracking anymore.
       track((domElement: any));
+      validateTextareaProps(domElement, props);
       initTextarea(domElement, props);
-      postInitTextarea(domElement, props);
       break;
   }
 
diff --git a/packages/react-dom-bindings/src/client/ReactDOMInput.js b/packages/react-dom-bindings/src/client/ReactDOMInput.js
index a1805c9e65a6..fcede9788572 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMInput.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMInput.js
@@ -39,7 +39,7 @@ let didWarnCheckedDefaultChecked = false;
  * See http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html
  */
 
-export function initInput(element: Element, props: Object) {
+export function validateInputProps(element: Element, props: Object) {
   if (__DEV__) {
     // Normally we check for undefined and null the same, but explicitly specifying both
     // properties, at all is probably worth warning for. We could move this either direction
@@ -160,7 +160,7 @@ export function updateInput(element: Element, props: Object) {
   }
 }
 
-export function postInitInput(
+export function initInput(
   element: Element,
   props: Object,
   isHydrating: boolean,
diff --git a/packages/react-dom-bindings/src/client/ReactDOMOption.js b/packages/react-dom-bindings/src/client/ReactDOMOption.js
index 8ab7b6289aec..7907609ad88f 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMOption.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMOption.js
@@ -60,7 +60,7 @@ export function validateOptionProps(element: Element, props: Object) {
   }
 }
 
-export function postInitOption(element: Element, props: Object) {
+export function initOption(element: Element, props: Object) {
   // value="" should make a value attribute (#6219)
   if (props.value != null) {
     element.setAttribute('value', toString(getToStringValue(props.value)));
diff --git a/packages/react-dom-bindings/src/client/ReactDOMSelect.js b/packages/react-dom-bindings/src/client/ReactDOMSelect.js
index 3286e5e51172..13f7a8e6ad11 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMSelect.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMSelect.js
@@ -122,7 +122,7 @@ function updateOptions(
  * selected.
  */
 
-export function initSelect(element: Element, props: Object) {
+export function validateSelectProps(element: Element, props: Object) {
   if (__DEV__) {
     checkSelectPropTypes(props);
     if (
@@ -142,7 +142,7 @@ export function initSelect(element: Element, props: Object) {
   }
 }
 
-export function postInitSelect(element: Element, props: Object) {
+export function initSelect(element: Element, props: Object) {
   const node: HTMLSelectElement = (element: any);
   node.multiple = !!props.multiple;
   const value = props.value;
diff --git a/packages/react-dom-bindings/src/client/ReactDOMTextarea.js b/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
index 4b3a47ed8392..544cee9952be 100644
--- a/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
+++ b/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
@@ -31,7 +31,7 @@ let didWarnValDefaultVal = false;
  * `defaultValue` if specified, or the children content (deprecated).
  */
 
-export function initTextarea(element: Element, props: Object) {
+export function validateTextareaProps(element: Element, props: Object) {
   if (__DEV__) {
     if (
       props.value !== undefined &&
@@ -82,7 +82,7 @@ export function updateTextarea(element: Element, props: Object) {
   }
 }
 
-export function postInitTextarea(element: Element, props: Object) {
+export function initTextarea(element: Element, props: Object) {
   const node: HTMLTextAreaElement = (element: any);
 
   let initialValue = props.value;