Rename the react.element symbol to react.transitional.element (#28813)

We have changed the shape (and the runtime) of React Elements. To help avoid precompiled or inlined JSX having subtle breakages or deopting hidden classes, I renamed the symbol so that we can early error if private implementation details are used or mismatching versions are used. Why "transitional"? Well, because this is not the last time we'll change the shape. This is just a stepping stone to removing the `ref` field on the elements in the next version so we'll likely have to do it again. DiffTrain build for [3b551c8](3b551c8)
facebook · Apr 22, 2024 · d1d0508 · d1d0508
1 parent 5d6e662
commit d1d0508
Show file tree

Hide file tree

Showing 45 changed files with 418 additions and 333 deletions.
diff --git a/compiled/facebook-www/JSXDEVRuntime-dev.classic.js b/compiled/facebook-www/JSXDEVRuntime-dev.classic.js
@@ -18,11 +18,25 @@ if (__DEV__) {
 
 var React = require('react');
 
-// ATTENTION
+// Re-export dynamic flags from the www version.
+var dynamicFeatureFlags = require('ReactFeatureFlags');
+
+var enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
+    enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
+    enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
+    enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
+    disableDefaultPropsExceptForClasses = dynamicFeatureFlags.disableDefaultPropsExceptForClasses;
+ // On WWW, false is used for a new modern build.
+// because JSX is an extremely hot path.
+
+var disableStringRefs = false;
+
 // When adding new symbols to this file,
 // Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
 // The Symbol used to tag the ReactElement-like types.
-var REACT_ELEMENT_TYPE = Symbol.for('react.element');
+
+var REACT_LEGACY_ELEMENT_TYPE = Symbol.for('react.element');
+var REACT_ELEMENT_TYPE = REACT_LEGACY_ELEMENT_TYPE;
 var REACT_PORTAL_TYPE = Symbol.for('react.portal');
 var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
 var REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode');
@@ -93,19 +107,6 @@ function printWarning(level, format, args) {
   }
 }
 
-// Re-export dynamic flags from the www version.
-var dynamicFeatureFlags = require('ReactFeatureFlags');
-
-var enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
-    enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
-    enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
-    enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
-    disableDefaultPropsExceptForClasses = dynamicFeatureFlags.disableDefaultPropsExceptForClasses;
- // On WWW, false is used for a new modern build.
-// because JSX is an extremely hot path.
-
-var disableStringRefs = false;
-
 function getWrappedName$1(outerType, innerType, wrapperName) {
   var displayName = outerType.displayName;
 
@@ -1026,7 +1027,7 @@ function elementRefGetterWithDeprecationWarning() {
 /**
  * Factory method to create a new React element. This no longer adheres to
  * the class pattern, so do not use new to call it. Also, instanceof check
- * will not work. Instead test $$typeof field against Symbol.for('react.element') to check
+ * will not work. Instead test $$typeof field against Symbol.for('react.transitional.element') to check
  * if something is a React Element.
  *
  * @param {*} type

diff --git a/compiled/facebook-www/JSXDEVRuntime-dev.modern.js b/compiled/facebook-www/JSXDEVRuntime-dev.modern.js
@@ -18,11 +18,25 @@ if (__DEV__) {
 
 var React = require('react');
 
-// ATTENTION
+// Re-export dynamic flags from the www version.
+var dynamicFeatureFlags = require('ReactFeatureFlags');
+
+var enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
+    enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
+    enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
+    enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
+    disableDefaultPropsExceptForClasses = dynamicFeatureFlags.disableDefaultPropsExceptForClasses;
+ // On WWW, true is used for a new modern build.
+// because JSX is an extremely hot path.
+
+var disableStringRefs = false;
+
 // When adding new symbols to this file,
 // Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
 // The Symbol used to tag the ReactElement-like types.
-var REACT_ELEMENT_TYPE = Symbol.for('react.element');
+
+var REACT_LEGACY_ELEMENT_TYPE = Symbol.for('react.element');
+var REACT_ELEMENT_TYPE = REACT_LEGACY_ELEMENT_TYPE;
 var REACT_PORTAL_TYPE = Symbol.for('react.portal');
 var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
 var REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode');
@@ -93,19 +107,6 @@ function printWarning(level, format, args) {
   }
 }
 
-// Re-export dynamic flags from the www version.
-var dynamicFeatureFlags = require('ReactFeatureFlags');
-
-var enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
-    enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
-    enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
-    enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
-    disableDefaultPropsExceptForClasses = dynamicFeatureFlags.disableDefaultPropsExceptForClasses;
- // On WWW, true is used for a new modern build.
-// because JSX is an extremely hot path.
-
-var disableStringRefs = false;
-
 function getWrappedName$1(outerType, innerType, wrapperName) {
   var displayName = outerType.displayName;
 
@@ -1029,7 +1030,7 @@ function elementRefGetterWithDeprecationWarning() {
 /**
  * Factory method to create a new React element. This no longer adheres to
  * the class pattern, so do not use new to call it. Also, instanceof check
- * will not work. Instead test $$typeof field against Symbol.for('react.element') to check
+ * will not work. Instead test $$typeof field against Symbol.for('react.transitional.element') to check
  * if something is a React Element.
  *
  * @param {*} type

diff --git a/compiled/facebook-www/JSXDEVRuntime-prod.classic.js b/compiled/facebook-www/JSXDEVRuntime-prod.classic.js
@@ -11,7 +11,7 @@
  */
 
 "use strict";
-var REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
 require("ReactFeatureFlags");
+var REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
 exports.Fragment = REACT_FRAGMENT_TYPE;
 exports.jsxDEV = void 0;
diff --git a/compiled/facebook-www/JSXDEVRuntime-prod.modern.js b/compiled/facebook-www/JSXDEVRuntime-prod.modern.js
@@ -11,7 +11,7 @@
  */
 
 "use strict";
-var REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
 require("ReactFeatureFlags");
+var REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
 exports.Fragment = REACT_FRAGMENT_TYPE;
 exports.jsxDEV = void 0;
diff --git a/compiled/facebook-www/JSXDEVRuntime-profiling.classic.js b/compiled/facebook-www/JSXDEVRuntime-profiling.classic.js
@@ -11,7 +11,7 @@
  */
 
 "use strict";
-var REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
 require("ReactFeatureFlags");
+var REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
 exports.Fragment = REACT_FRAGMENT_TYPE;
 exports.jsxDEV = void 0;
diff --git a/compiled/facebook-www/JSXDEVRuntime-profiling.modern.js b/compiled/facebook-www/JSXDEVRuntime-profiling.modern.js
@@ -11,7 +11,7 @@
  */
 
 "use strict";
-var REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
 require("ReactFeatureFlags");
+var REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
 exports.Fragment = REACT_FRAGMENT_TYPE;
 exports.jsxDEV = void 0;
diff --git a/compiled/facebook-www/REVISION b/compiled/facebook-www/REVISION
@@ -1 +1 @@
-db913d8e17db25045e0518f3621f1640f2390525
+3b551c82844bcfde51f0febb8e42c1a0d777df2c
diff --git a/compiled/facebook-www/React-dev.classic.js b/compiled/facebook-www/React-dev.classic.js
@@ -25,13 +25,28 @@ if (
 ) {
   __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
 }
-          var ReactVersion = '19.0.0-www-classic-29916c01';
+          var ReactVersion = '19.0.0-www-classic-ece5ea17';
+
+// Re-export dynamic flags from the www version.
+var dynamicFeatureFlags = require('ReactFeatureFlags');
+
+var enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
+    enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
+    enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
+    enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
+    disableDefaultPropsExceptForClasses = dynamicFeatureFlags.disableDefaultPropsExceptForClasses;
+ // On WWW, false is used for a new modern build.
+// because JSX is an extremely hot path.
+
+var disableStringRefs = false;
+var disableLegacyMode = false;
 
-// ATTENTION
 // When adding new symbols to this file,
 // Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
 // The Symbol used to tag the ReactElement-like types.
-var REACT_ELEMENT_TYPE = Symbol.for('react.element');
+
+var REACT_LEGACY_ELEMENT_TYPE = Symbol.for('react.element');
+var REACT_ELEMENT_TYPE = REACT_LEGACY_ELEMENT_TYPE;
 var REACT_PORTAL_TYPE = Symbol.for('react.portal');
 var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
 var REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode');
@@ -422,20 +437,6 @@ function checkPropStringCoercion(value, propName) {
   }
 }
 
-// Re-export dynamic flags from the www version.
-var dynamicFeatureFlags = require('ReactFeatureFlags');
-
-var enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
-    enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
-    enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
-    enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
-    disableDefaultPropsExceptForClasses = dynamicFeatureFlags.disableDefaultPropsExceptForClasses;
- // On WWW, false is used for a new modern build.
-// because JSX is an extremely hot path.
-
-var disableStringRefs = false;
-var disableLegacyMode = false;
-
 function getWrappedName$1(outerType, innerType, wrapperName) {
   var displayName = outerType.displayName;
 
@@ -1313,7 +1314,7 @@ function elementRefGetterWithDeprecationWarning() {
 /**
  * Factory method to create a new React element. This no longer adheres to
  * the class pattern, so do not use new to call it. Also, instanceof check
- * will not work. Instead test $$typeof field against Symbol.for('react.element') to check
+ * will not work. Instead test $$typeof field against Symbol.for('react.transitional.element') to check
  * if something is a React Element.
  *
  * @param {*} type

diff --git a/compiled/facebook-www/React-dev.modern.js b/compiled/facebook-www/React-dev.modern.js
@@ -25,13 +25,28 @@ if (
 ) {
   __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
 }
-          var ReactVersion = '19.0.0-www-modern-16b8232b';
+          var ReactVersion = '19.0.0-www-modern-367021cf';
+
+// Re-export dynamic flags from the www version.
+var dynamicFeatureFlags = require('ReactFeatureFlags');
+
+var enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
+    enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
+    enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
+    enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
+    disableDefaultPropsExceptForClasses = dynamicFeatureFlags.disableDefaultPropsExceptForClasses;
+ // On WWW, true is used for a new modern build.
+// because JSX is an extremely hot path.
+
+var disableStringRefs = false;
+var disableLegacyMode = true;
 
-// ATTENTION
 // When adding new symbols to this file,
 // Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
 // The Symbol used to tag the ReactElement-like types.
-var REACT_ELEMENT_TYPE = Symbol.for('react.element');
+
+var REACT_LEGACY_ELEMENT_TYPE = Symbol.for('react.element');
+var REACT_ELEMENT_TYPE = REACT_LEGACY_ELEMENT_TYPE;
 var REACT_PORTAL_TYPE = Symbol.for('react.portal');
 var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
 var REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode');
@@ -422,20 +437,6 @@ function checkPropStringCoercion(value, propName) {
   }
 }
 
-// Re-export dynamic flags from the www version.
-var dynamicFeatureFlags = require('ReactFeatureFlags');
-
-var enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
-    enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
-    enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
-    enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
-    disableDefaultPropsExceptForClasses = dynamicFeatureFlags.disableDefaultPropsExceptForClasses;
- // On WWW, true is used for a new modern build.
-// because JSX is an extremely hot path.
-
-var disableStringRefs = false;
-var disableLegacyMode = true;
-
 function getWrappedName$1(outerType, innerType, wrapperName) {
   var displayName = outerType.displayName;
 
@@ -1316,7 +1317,7 @@ function elementRefGetterWithDeprecationWarning() {
 /**
  * Factory method to create a new React element. This no longer adheres to
  * the class pattern, so do not use new to call it. Also, instanceof check
- * will not work. Instead test $$typeof field against Symbol.for('react.element') to check
+ * will not work. Instead test $$typeof field against Symbol.for('react.transitional.element') to check
  * if something is a React Element.
  *
  * @param {*} type

diff --git a/compiled/facebook-www/React-prod.classic.js b/compiled/facebook-www/React-prod.classic.js
@@ -11,7 +11,13 @@
  */
 
 "use strict";
-var REACT_ELEMENT_TYPE = Symbol.for("react.element"),
+var dynamicFeatureFlags = require("ReactFeatureFlags"),
+  enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
+  enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
+  enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
+  disableDefaultPropsExceptForClasses =
+    dynamicFeatureFlags.disableDefaultPropsExceptForClasses,
+  REACT_LEGACY_ELEMENT_TYPE = Symbol.for("react.element"),
   REACT_PORTAL_TYPE = Symbol.for("react.portal"),
   REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"),
   REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode"),
@@ -81,19 +87,13 @@ pureComponentPrototype.constructor = PureComponent;
 assign(pureComponentPrototype, Component.prototype);
 pureComponentPrototype.isPureReactComponent = !0;
 var isArrayImpl = Array.isArray,
-  dynamicFeatureFlags = require("ReactFeatureFlags"),
-  enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
-  enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
-  enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
-  disableDefaultPropsExceptForClasses =
-    dynamicFeatureFlags.disableDefaultPropsExceptForClasses,
   ReactSharedInternals = { H: null, C: null, T: null, owner: null },
   hasOwnProperty = Object.prototype.hasOwnProperty;
 function ReactElement(type, key, _ref, self, source, owner, props) {
   enableRefAsProp &&
     ((_ref = props.ref), (_ref = void 0 !== _ref ? _ref : null));
   return {
-    $$typeof: REACT_ELEMENT_TYPE,
+    $$typeof: REACT_LEGACY_ELEMENT_TYPE,
     type: type,
     key: key,
     ref: _ref,
@@ -152,7 +152,7 @@ function isValidElement(object) {
   return (
     "object" === typeof object &&
     null !== object &&
-    object.$$typeof === REACT_ELEMENT_TYPE
+    object.$$typeof === REACT_LEGACY_ELEMENT_TYPE
   );
 }
 function coerceStringRef(mixedRef, owner, type) {
@@ -249,7 +249,7 @@ function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
         break;
       case "object":
         switch (children.$$typeof) {
-          case REACT_ELEMENT_TYPE:
+          case REACT_LEGACY_ELEMENT_TYPE:
           case REACT_PORTAL_TYPE:
             invokeCallback = !0;
             break;
@@ -695,4 +695,4 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactSharedInternals.H.useTransition();
 };
-exports.version = "19.0.0-www-classic-c379aa62";
+exports.version = "19.0.0-www-classic-4c7400c8";
diff --git a/compiled/facebook-www/React-prod.modern.js b/compiled/facebook-www/React-prod.modern.js
@@ -11,7 +11,13 @@
  */
 
 "use strict";
-var REACT_ELEMENT_TYPE = Symbol.for("react.element"),
+var dynamicFeatureFlags = require("ReactFeatureFlags"),
+  enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
+  enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
+  enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
+  disableDefaultPropsExceptForClasses =
+    dynamicFeatureFlags.disableDefaultPropsExceptForClasses,
+  REACT_LEGACY_ELEMENT_TYPE = Symbol.for("react.element"),
   REACT_PORTAL_TYPE = Symbol.for("react.portal"),
   REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"),
   REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode"),
@@ -81,19 +87,13 @@ pureComponentPrototype.constructor = PureComponent;
 assign(pureComponentPrototype, Component.prototype);
 pureComponentPrototype.isPureReactComponent = !0;
 var isArrayImpl = Array.isArray,
-  dynamicFeatureFlags = require("ReactFeatureFlags"),
-  enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
-  enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
-  enableRefAsProp = dynamicFeatureFlags.enableRefAsProp,
-  disableDefaultPropsExceptForClasses =
-    dynamicFeatureFlags.disableDefaultPropsExceptForClasses,
   ReactSharedInternals = { H: null, C: null, T: null, owner: null },
   hasOwnProperty = Object.prototype.hasOwnProperty;
 function ReactElement(type, key, _ref, self, source, owner, props) {
   enableRefAsProp &&
     ((_ref = props.ref), (_ref = void 0 !== _ref ? _ref : null));
   return {
-    $$typeof: REACT_ELEMENT_TYPE,
+    $$typeof: REACT_LEGACY_ELEMENT_TYPE,
     type: type,
     key: key,
     ref: _ref,
@@ -152,7 +152,7 @@ function isValidElement(object) {
   return (
     "object" === typeof object &&
     null !== object &&
-    object.$$typeof === REACT_ELEMENT_TYPE
+    object.$$typeof === REACT_LEGACY_ELEMENT_TYPE
   );
 }
 function coerceStringRef(mixedRef, owner, type) {
@@ -249,7 +249,7 @@ function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
         break;
       case "object":
         switch (children.$$typeof) {
-          case REACT_ELEMENT_TYPE:
+          case REACT_LEGACY_ELEMENT_TYPE:
           case REACT_PORTAL_TYPE:
             invokeCallback = !0;
             break;
@@ -695,4 +695,4 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactSharedInternals.H.useTransition();
 };
-exports.version = "19.0.0-www-modern-c379aa62";
+exports.version = "19.0.0-www-modern-4c7400c8";
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		db913d8e17db25045e0518f3621f1640f2390525
		3b551c82844bcfde51f0febb8e42c1a0d777df2c