Fix controlled radios, maybe for real this time (#27443)

Fixes #26876 for real? In 18.2.0 (last stable), we set .checked unconditionally: https://github.com/facebook/react/blob/v18.2.0/packages/react-dom/src/client/ReactDOMInput.js#L129-L135 This is important because if we are updating two radios' checkedness from (false, true) to (true, false), we need to make sure that input2.checked is explicitly set to false, even though setting `input1.checked = true` already unchecks input2. I think this fix is not complete because there is no guarantee that all the inputs rerender at the same time? Hence the TODO. But in practice they usually would and I _think_ this is comparable to what we had before. Also treating function and symbol as false like we used to and like we do on initial mount. DiffTrain build for [4f4c52a](4f4c52a)
facebook · Oct 2, 2023 · fbf7069 · fbf7069
1 parent 9d56820
commit fbf7069
Show file tree

Hide file tree

Showing 14 changed files with 66 additions and 46 deletions.
diff --git a/compiled/facebook-www/REVISION b/compiled/facebook-www/REVISION
@@ -1 +1 @@
-54baa7997c7b0bbd456460ead6e051655ea43790
+4f4c52a3c8f9c8a2d8133c654841fee257c37249
diff --git a/compiled/facebook-www/React-dev.classic.js b/compiled/facebook-www/React-dev.classic.js
@@ -27,7 +27,7 @@ if (
 }
           "use strict";
 
-var ReactVersion = "18.3.0-www-classic-591e80f2";
+var ReactVersion = "18.3.0-www-classic-ff54ec02";
 
 // ATTENTION
 // When adding new symbols to this file,

diff --git a/compiled/facebook-www/React-prod.modern.js b/compiled/facebook-www/React-prod.modern.js
@@ -615,4 +615,4 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactCurrentDispatcher.current.useTransition();
 };
-exports.version = "18.3.0-www-modern-96829b2e";
+exports.version = "18.3.0-www-modern-dc699db3";
diff --git a/compiled/facebook-www/React-profiling.modern.js b/compiled/facebook-www/React-profiling.modern.js
@@ -626,7 +626,7 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactCurrentDispatcher.current.useTransition();
 };
-exports.version = "18.3.0-www-modern-1a772a6d";
+exports.version = "18.3.0-www-modern-622fc29e";
 
           /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
 if (

diff --git a/compiled/facebook-www/ReactDOM-dev.classic.js b/compiled/facebook-www/ReactDOM-dev.classic.js
@@ -3899,8 +3899,13 @@ function updateInput(
     }
   }
 
-  if (checked != null && node.checked !== !!checked) {
-    node.checked = checked;
+  if (checked != null) {
+    // Important to set this even if it's not a change in order to update input
+    // value tracking with radio buttons
+    // TODO: Should really update input value tracking for the whole radio
+    // button group in an effect or something (similar to #27024)
+    node.checked =
+      checked && typeof checked !== "function" && typeof checked !== "symbol";
   }
 
   if (
@@ -33972,7 +33977,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-classic-707e543f";
+var ReactVersion = "18.3.0-www-classic-9c42e3d4";
 
 function createPortal$1(
   children,

diff --git a/compiled/facebook-www/ReactDOM-dev.modern.js b/compiled/facebook-www/ReactDOM-dev.modern.js
@@ -3741,8 +3741,13 @@ function updateInput(
     }
   }
 
-  if (checked != null && node.checked !== !!checked) {
-    node.checked = checked;
+  if (checked != null) {
+    // Important to set this even if it's not a change in order to update input
+    // value tracking with radio buttons
+    // TODO: Should really update input value tracking for the whole radio
+    // button group in an effect or something (similar to #27024)
+    node.checked =
+      checked && typeof checked !== "function" && typeof checked !== "symbol";
   }
 
   if (
@@ -33817,7 +33822,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-modern-b8e372cd";
+var ReactVersion = "18.3.0-www-modern-752f226e";
 
 function createPortal$1(
   children,

diff --git a/compiled/facebook-www/ReactDOM-prod.classic.js b/compiled/facebook-www/ReactDOM-prod.classic.js
@@ -1038,8 +1038,8 @@ function updateInput(
       null != defaultChecked &&
       (element.defaultChecked = !!defaultChecked);
   null != checked &&
-    element.checked !== !!checked &&
-    (element.checked = checked);
+    (element.checked =
+      checked && "function" !== typeof checked && "symbol" !== typeof checked);
   null != name &&
   "function" !== typeof name &&
   "symbol" !== typeof name &&
@@ -16375,7 +16375,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1779 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-746b6ac2",
+  version: "18.3.0-www-classic-4ef77085",
   rendererPackageName: "react-dom"
 };
 var internals$jscomp$inline_2123 = {
@@ -16405,7 +16405,7 @@ var internals$jscomp$inline_2123 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-746b6ac2"
+  reconcilerVersion: "18.3.0-www-classic-4ef77085"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_2124 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -16742,4 +16742,4 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-classic-746b6ac2";
+exports.version = "18.3.0-www-classic-4ef77085";
diff --git a/compiled/facebook-www/ReactDOM-prod.modern.js b/compiled/facebook-www/ReactDOM-prod.modern.js
@@ -892,8 +892,8 @@ function updateInput(
       null != defaultChecked &&
       (element.defaultChecked = !!defaultChecked);
   null != checked &&
-    element.checked !== !!checked &&
-    (element.checked = checked);
+    (element.checked =
+      checked && "function" !== typeof checked && "symbol" !== typeof checked);
   null != name &&
   "function" !== typeof name &&
   "symbol" !== typeof name &&
@@ -15897,7 +15897,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1738 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-84053073",
+  version: "18.3.0-www-modern-7f3360c5",
   rendererPackageName: "react-dom"
 };
 var internals$jscomp$inline_2087 = {
@@ -15928,7 +15928,7 @@ var internals$jscomp$inline_2087 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-84053073"
+  reconcilerVersion: "18.3.0-www-modern-7f3360c5"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_2088 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -16193,4 +16193,4 @@ exports.unstable_createEventHandle = function (type, options) {
   return eventHandle;
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-modern-84053073";
+exports.version = "18.3.0-www-modern-7f3360c5";
diff --git a/compiled/facebook-www/ReactDOM-profiling.classic.js b/compiled/facebook-www/ReactDOM-profiling.classic.js
@@ -1182,8 +1182,8 @@ function updateInput(
       null != defaultChecked &&
       (element.defaultChecked = !!defaultChecked);
   null != checked &&
-    element.checked !== !!checked &&
-    (element.checked = checked);
+    (element.checked =
+      checked && "function" !== typeof checked && "symbol" !== typeof checked);
   null != name &&
   "function" !== typeof name &&
   "symbol" !== typeof name &&
@@ -17150,7 +17150,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1864 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-5a92b4d5",
+  version: "18.3.0-www-classic-9802da3a",
   rendererPackageName: "react-dom"
 };
 (function (internals) {
@@ -17194,7 +17194,7 @@ var devToolsConfig$jscomp$inline_1864 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-5a92b4d5"
+  reconcilerVersion: "18.3.0-www-classic-9802da3a"
 });
 assign(Internals, {
   ReactBrowserEventEmitter: {
@@ -17518,7 +17518,7 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-classic-5a92b4d5";
+exports.version = "18.3.0-www-classic-9802da3a";
 
           /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
 if (

diff --git a/compiled/facebook-www/ReactDOM-profiling.modern.js b/compiled/facebook-www/ReactDOM-profiling.modern.js
@@ -1036,8 +1036,8 @@ function updateInput(
       null != defaultChecked &&
       (element.defaultChecked = !!defaultChecked);
   null != checked &&
-    element.checked !== !!checked &&
-    (element.checked = checked);
+    (element.checked =
+      checked && "function" !== typeof checked && "symbol" !== typeof checked);
   null != name &&
   "function" !== typeof name &&
   "symbol" !== typeof name &&
@@ -16666,7 +16666,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1823 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-f998be57",
+  version: "18.3.0-www-modern-ea3ac45f",
   rendererPackageName: "react-dom"
 };
 (function (internals) {
@@ -16711,7 +16711,7 @@ var devToolsConfig$jscomp$inline_1823 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-f998be57"
+  reconcilerVersion: "18.3.0-www-modern-ea3ac45f"
 });
 exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals;
 exports.createPortal = function (children, container) {
@@ -16963,7 +16963,7 @@ exports.unstable_createEventHandle = function (type, options) {
   return eventHandle;
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-modern-f998be57";
+exports.version = "18.3.0-www-modern-ea3ac45f";
 
           /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
 if (

diff --git a/compiled/facebook-www/ReactDOMTesting-dev.classic.js b/compiled/facebook-www/ReactDOMTesting-dev.classic.js
@@ -4033,8 +4033,13 @@ function updateInput(
     }
   }
 
-  if (checked != null && node.checked !== !!checked) {
-    node.checked = checked;
+  if (checked != null) {
+    // Important to set this even if it's not a change in order to update input
+    // value tracking with radio buttons
+    // TODO: Should really update input value tracking for the whole radio
+    // button group in an effect or something (similar to #27024)
+    node.checked =
+      checked && typeof checked !== "function" && typeof checked !== "symbol";
   }
 
   if (
@@ -34589,7 +34594,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-classic-49f3ea5b";
+var ReactVersion = "18.3.0-www-classic-ffc4f8d2";
 
 function createPortal$1(
   children,

diff --git a/compiled/facebook-www/ReactDOMTesting-dev.modern.js b/compiled/facebook-www/ReactDOMTesting-dev.modern.js
@@ -3875,8 +3875,13 @@ function updateInput(
     }
   }
 
-  if (checked != null && node.checked !== !!checked) {
-    node.checked = checked;
+  if (checked != null) {
+    // Important to set this even if it's not a change in order to update input
+    // value tracking with radio buttons
+    // TODO: Should really update input value tracking for the whole radio
+    // button group in an effect or something (similar to #27024)
+    node.checked =
+      checked && typeof checked !== "function" && typeof checked !== "symbol";
   }
 
   if (
@@ -34434,7 +34439,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-modern-96829b2e";
+var ReactVersion = "18.3.0-www-modern-dc699db3";
 
 function createPortal$1(
   children,

diff --git a/compiled/facebook-www/ReactDOMTesting-prod.classic.js b/compiled/facebook-www/ReactDOMTesting-prod.classic.js
@@ -1124,8 +1124,8 @@ function updateInput(
       null != defaultChecked &&
       (element.defaultChecked = !!defaultChecked);
   null != checked &&
-    element.checked !== !!checked &&
-    (element.checked = checked);
+    (element.checked =
+      checked && "function" !== typeof checked && "symbol" !== typeof checked);
   null != name &&
   "function" !== typeof name &&
   "symbol" !== typeof name &&
@@ -16704,7 +16704,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1808 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-591e80f2",
+  version: "18.3.0-www-classic-ff54ec02",
   rendererPackageName: "react-dom"
 };
 var internals$jscomp$inline_2157 = {
@@ -16734,7 +16734,7 @@ var internals$jscomp$inline_2157 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-591e80f2"
+  reconcilerVersion: "18.3.0-www-classic-ff54ec02"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_2158 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -17222,4 +17222,4 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-classic-591e80f2";
+exports.version = "18.3.0-www-classic-ff54ec02";
diff --git a/compiled/facebook-www/ReactDOMTesting-prod.modern.js b/compiled/facebook-www/ReactDOMTesting-prod.modern.js
@@ -1033,8 +1033,8 @@ function updateInput(
       null != defaultChecked &&
       (element.defaultChecked = !!defaultChecked);
   null != checked &&
-    element.checked !== !!checked &&
-    (element.checked = checked);
+    (element.checked =
+      checked && "function" !== typeof checked && "symbol" !== typeof checked);
   null != name &&
   "function" !== typeof name &&
   "symbol" !== typeof name &&
@@ -16281,7 +16281,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1767 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-1a772a6d",
+  version: "18.3.0-www-modern-622fc29e",
   rendererPackageName: "react-dom"
 };
 var internals$jscomp$inline_2121 = {
@@ -16312,7 +16312,7 @@ var internals$jscomp$inline_2121 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-1a772a6d"
+  reconcilerVersion: "18.3.0-www-modern-622fc29e"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_2122 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -16728,4 +16728,4 @@ exports.unstable_createEventHandle = function (type, options) {
   return eventHandle;
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-modern-1a772a6d";
+exports.version = "18.3.0-www-modern-622fc29e";