Add support behind enableNewBooleanProps flag

facebook · Feb 7, 2024 · 78f1ad6 · 78f1ad6
1 parent 5dbdb16
commit 78f1ad6
Show file tree

Hide file tree

Showing 12 changed files with 28 additions and 3 deletions.
diff --git a/packages/react-dom-bindings/src/client/ReactDOMComponent.js b/packages/react-dom-bindings/src/client/ReactDOMComponent.js
@@ -72,6 +72,7 @@ import {
   disableIEWorkarounds,
   enableTrustedTypesIntegration,
   enableFilterEmptyStringAttributesDOM,
+  enableNewBooleanProps,
 } from 'shared/ReactFeatureFlags';
 import {
   mediaEventTypes,
@@ -715,7 +716,7 @@ function setProp(
     case 'disableRemotePlayback':
     case 'formNoValidate':
     case 'hidden':
-    case 'inert':
+    case enableNewBooleanProps ? 'inert' : 'formNoValidate':
     case 'loop':
     case 'noModule':
     case 'noValidate':
@@ -2494,6 +2495,7 @@ function diffHydratedGenericElement(
       case 'disableRemotePlayback':
       case 'formNoValidate':
       case 'hidden':
+      case enableNewBooleanProps ? 'inert' : 'formNoValidate':
       case 'loop':
       case 'noModule':
       case 'noValidate':

diff --git a/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js b/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js
@@ -33,6 +33,7 @@ import {
   enableFloat,
   enableFormActions,
   enableFizzExternalRuntime,
+  enableNewBooleanProps,
 } from 'shared/ReactFeatureFlags';
 
 import type {
@@ -1289,6 +1290,7 @@ function pushAttribute(
     case 'disableRemotePlayback':
     case 'formNoValidate':
     case 'hidden':
+    case enableNewBooleanProps ? 'inert' : 'formNoValidate':
     case 'loop':
     case 'noModule':
     case 'noValidate':

diff --git a/packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js b/packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js
@@ -12,6 +12,7 @@ import hasOwnProperty from 'shared/hasOwnProperty';
 import {
   enableCustomElementPropertySupport,
   enableFormActions,
+  enableNewBooleanProps,
 } from 'shared/ReactFeatureFlags';
 
 const warnedProperties = {};
@@ -223,7 +224,7 @@ function validateProperty(tagName, name, value, eventRegistry) {
           case 'disableRemotePlayback':
           case 'formNoValidate':
           case 'hidden':
-          case 'inert':
+          case enableNewBooleanProps ? 'inert' : 'formNoValidate':
           case 'loop':
           case 'noModule':
           case 'noValidate':
@@ -301,6 +302,7 @@ function validateProperty(tagName, name, value, eventRegistry) {
             case 'disableRemotePlayback':
             case 'formNoValidate':
             case 'hidden':
+            case enableNewBooleanProps ? 'inert' : 'formNoValidate':
             case 'loop':
             case 'noModule':
             case 'noValidate':

diff --git a/packages/react-dom-bindings/src/shared/possibleStandardNames.js b/packages/react-dom-bindings/src/shared/possibleStandardNames.js
@@ -4,6 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+import {enableNewBooleanProps} from 'shared/ReactFeatureFlags';
 
 // When adding attributes to the HTML or SVG allowed attribute list, be sure to
 // also add them to this module to ensure casing and incorrect name
@@ -82,7 +83,6 @@ const possibleStandardNames = {
   id: 'id',
   imagesizes: 'imageSizes',
   imagesrcset: 'imageSrcSet',
-  inert: 'inert',
   innerhtml: 'innerHTML',
   inputmode: 'inputMode',
   integrity: 'integrity',
@@ -503,4 +503,8 @@ const possibleStandardNames = {
   zoomandpan: 'zoomAndPan',
 };
 
+if (enableNewBooleanProps) {
+  possibleStandardNames.inert = 'inert';
+}
+
 export default possibleStandardNames;
diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js
@@ -208,6 +208,13 @@ export const disableInputAttributeSyncing = false;
 // Disables children for <textarea> elements
 export const disableTextareaChildren = false;
 
+// HTML boolean attributes need a special PropertyInfoRecord.
+// Between support of these attributes in browsers and React supporting them as
+// boolean props library users can use them as `<div someBooleanAttribute="" />`.
+// However, once React considers them as boolean props an empty string will
+// result in false property i.e. break existing usage.
+export const enableNewBooleanProps = __EXPERIMENTAL__;
+
 // -----------------------------------------------------------------------------
 // Debugging and DevTools
 // -----------------------------------------------------------------------------

diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js
@@ -78,6 +78,7 @@ export const enableLegacyHidden = true;
 export const forceConcurrentByDefaultForTesting = false;
 export const allowConcurrentByDefault = true;
 export const enableCustomElementPropertySupport = false;
+export const enableNewBooleanProps = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = false;
 

diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js
@@ -64,6 +64,7 @@ export const forceConcurrentByDefaultForTesting = false;
 export const enableUnifiedSyncLane = true;
 export const allowConcurrentByDefault = false;
 export const enableCustomElementPropertySupport = false;
+export const enableNewBooleanProps = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = false;
 

diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js
@@ -64,6 +64,7 @@ export const forceConcurrentByDefaultForTesting = false;
 export const enableUnifiedSyncLane = __EXPERIMENTAL__;
 export const allowConcurrentByDefault = false;
 export const enableCustomElementPropertySupport = false;
+export const enableNewBooleanProps = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = false;
 

diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js
@@ -62,6 +62,7 @@ export const enableLegacyHidden = false;
 export const forceConcurrentByDefaultForTesting = false;
 export const enableUnifiedSyncLane = true;
 export const allowConcurrentByDefault = true;
+export const enableNewBooleanProps = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = false;
 

diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js
@@ -64,6 +64,7 @@ export const forceConcurrentByDefaultForTesting = false;
 export const enableUnifiedSyncLane = true;
 export const allowConcurrentByDefault = true;
 export const enableCustomElementPropertySupport = false;
+export const enableNewBooleanProps = false;
 
 export const consoleManagedByDevToolsDuringStrictMode = false;
 

diff --git a/packages/shared/forks/ReactFeatureFlags.www-dynamic.js b/packages/shared/forks/ReactFeatureFlags.www-dynamic.js
@@ -23,6 +23,7 @@ export const enableLazyContextPropagation = __VARIANT__;
 export const forceConcurrentByDefaultForTesting = __VARIANT__;
 export const enableUnifiedSyncLane = __VARIANT__;
 export const enableTransitionTracing = __VARIANT__;
+export const enableNewBooleanProps = __VARIANT__;
 export const enableDeferRootSchedulingToMicrotask = __VARIANT__;
 export const enableAsyncActions = __VARIANT__;
 export const enableFormActions = __VARIANT__;

diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js
@@ -101,6 +101,8 @@ export const allowConcurrentByDefault = true;
 
 export const consoleManagedByDevToolsDuringStrictMode = true;
 
+export const enableNewBooleanProps = __EXPERIMENTAL__;
+
 export const useModernStrictMode = false;
 export const enableFizzExternalRuntime = true;