Skip to content

Commit 0ccec15

Browse files
committed
[string-refs] log string ref from prod (#31161)
If passed as a feature flag, this calls the configured function when a string ref is used even from prod code to find the last usages. DiffTrain build for [5636fad](5636fad)
1 parent 877636d commit 0ccec15

36 files changed

+728
-176
lines changed

compiled/facebook-www/JSXDEVRuntime-dev.classic.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -790,7 +790,9 @@ __DEV__ &&
790790
)
791791
(type = getComponentNameFromFiber(owner) || "Component"),
792792
didWarnAboutStringRefs[type] ||
793-
(error(
793+
(enableLogStringRefsProd &&
794+
enableLogStringRefsProd(type, stringRef),
795+
error(
794796
'Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. We recommend using useRef() or createRef() instead. Learn more about using refs safely here: https://react.dev/link/strict-mode-string-ref',
795797
type,
796798
stringRef
@@ -811,6 +813,7 @@ __DEV__ &&
811813
disableDefaultPropsExceptForClasses =
812814
dynamicFeatureFlags.disableDefaultPropsExceptForClasses,
813815
enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
816+
enableLogStringRefsProd = dynamicFeatureFlags.enableLogStringRefsProd,
814817
enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
815818
enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
816819
renameElementSymbol = dynamicFeatureFlags.renameElementSymbol,

compiled/facebook-www/JSXDEVRuntime-dev.modern.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -787,7 +787,9 @@ __DEV__ &&
787787
)
788788
(type = getComponentNameFromFiber(owner) || "Component"),
789789
didWarnAboutStringRefs[type] ||
790-
(error(
790+
(enableLogStringRefsProd &&
791+
enableLogStringRefsProd(type, stringRef),
792+
error(
791793
'Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. We recommend using useRef() or createRef() instead. Learn more about using refs safely here: https://react.dev/link/strict-mode-string-ref',
792794
type,
793795
stringRef
@@ -808,6 +810,7 @@ __DEV__ &&
808810
disableDefaultPropsExceptForClasses =
809811
dynamicFeatureFlags.disableDefaultPropsExceptForClasses,
810812
enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
813+
enableLogStringRefsProd = dynamicFeatureFlags.enableLogStringRefsProd,
811814
enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
812815
enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing;
813816
dynamicFeatureFlags = dynamicFeatureFlags.renameElementSymbol;

compiled/facebook-www/REVISION

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
b78a7f2f35e554a8647c3262d7f392e68d06febc
1+
5636fad840942cfea80301d91e931a50c6370d19
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
b78a7f2f35e554a8647c3262d7f392e68d06febc
1+
5636fad840942cfea80301d91e931a50c6370d19

compiled/facebook-www/React-dev.classic.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -860,7 +860,9 @@ __DEV__ &&
860860
)
861861
(type = getComponentNameFromFiber(owner) || "Component"),
862862
didWarnAboutStringRefs[type] ||
863-
(error$jscomp$0(
863+
(enableLogStringRefsProd &&
864+
enableLogStringRefsProd(type, stringRef),
865+
error$jscomp$0(
864866
'Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. We recommend using useRef() or createRef() instead. Learn more about using refs safely here: https://react.dev/link/strict-mode-string-ref',
865867
type,
866868
stringRef
@@ -1200,6 +1202,7 @@ __DEV__ &&
12001202
disableDefaultPropsExceptForClasses =
12011203
dynamicFeatureFlags.disableDefaultPropsExceptForClasses,
12021204
enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
1205+
enableLogStringRefsProd = dynamicFeatureFlags.enableLogStringRefsProd,
12031206
enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
12041207
enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
12051208
renameElementSymbol = dynamicFeatureFlags.renameElementSymbol,
@@ -2002,7 +2005,7 @@ __DEV__ &&
20022005
exports.useTransition = function () {
20032006
return resolveDispatcher().useTransition();
20042007
};
2005-
exports.version = "19.0.0-www-classic-b78a7f2f-20241007";
2008+
exports.version = "19.0.0-www-classic-5636fad8-20241010";
20062009
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
20072010
"function" ===
20082011
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-dev.modern.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -857,7 +857,9 @@ __DEV__ &&
857857
)
858858
(type = getComponentNameFromFiber(owner) || "Component"),
859859
didWarnAboutStringRefs[type] ||
860-
(error$jscomp$0(
860+
(enableLogStringRefsProd &&
861+
enableLogStringRefsProd(type, stringRef),
862+
error$jscomp$0(
861863
'Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. We recommend using useRef() or createRef() instead. Learn more about using refs safely here: https://react.dev/link/strict-mode-string-ref',
862864
type,
863865
stringRef
@@ -1197,6 +1199,7 @@ __DEV__ &&
11971199
disableDefaultPropsExceptForClasses =
11981200
dynamicFeatureFlags.disableDefaultPropsExceptForClasses,
11991201
enableDebugTracing = dynamicFeatureFlags.enableDebugTracing,
1202+
enableLogStringRefsProd = dynamicFeatureFlags.enableLogStringRefsProd,
12001203
enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
12011204
enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
12021205
renameElementSymbol = dynamicFeatureFlags.renameElementSymbol,
@@ -1982,7 +1985,7 @@ __DEV__ &&
19821985
exports.useTransition = function () {
19831986
return resolveDispatcher().useTransition();
19841987
};
1985-
exports.version = "19.0.0-www-modern-b78a7f2f-20241007";
1988+
exports.version = "19.0.0-www-modern-5636fad8-20241010";
19861989
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
19871990
"function" ===
19881991
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-prod.classic.js

Lines changed: 146 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,11 @@
1414
var dynamicFeatureFlags = require("ReactFeatureFlags"),
1515
disableDefaultPropsExceptForClasses =
1616
dynamicFeatureFlags.disableDefaultPropsExceptForClasses,
17+
enableLogStringRefsProd = dynamicFeatureFlags.enableLogStringRefsProd,
1718
enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
1819
enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
1920
renameElementSymbol = dynamicFeatureFlags.renameElementSymbol,
21+
disableLegacyMode = dynamicFeatureFlags.disableLegacyMode,
2022
REACT_LEGACY_ELEMENT_TYPE = Symbol.for("react.element"),
2123
REACT_ELEMENT_TYPE = renameElementSymbol
2224
? Symbol.for("react.transitional.element")
@@ -90,12 +92,140 @@ pureComponentPrototype.constructor = PureComponent;
9092
assign(pureComponentPrototype, Component.prototype);
9193
pureComponentPrototype.isPureReactComponent = !0;
9294
var isArrayImpl = Array.isArray,
93-
ReactSharedInternals = { H: null, A: null, T: null, S: null },
95+
REACT_CLIENT_REFERENCE = Symbol.for("react.client.reference");
96+
function getComponentNameFromType(type) {
97+
if (null == type) return null;
98+
if ("function" === typeof type)
99+
return type.$$typeof === REACT_CLIENT_REFERENCE
100+
? null
101+
: type.displayName || type.name || null;
102+
if ("string" === typeof type) return type;
103+
switch (type) {
104+
case REACT_FRAGMENT_TYPE:
105+
return "Fragment";
106+
case REACT_PORTAL_TYPE:
107+
return "Portal";
108+
case REACT_PROFILER_TYPE:
109+
return "Profiler";
110+
case REACT_STRICT_MODE_TYPE:
111+
return "StrictMode";
112+
case REACT_SUSPENSE_TYPE:
113+
return "Suspense";
114+
case REACT_SUSPENSE_LIST_TYPE:
115+
return "SuspenseList";
116+
case REACT_TRACING_MARKER_TYPE:
117+
if (enableTransitionTracing) return "TracingMarker";
118+
}
119+
if ("object" === typeof type)
120+
switch (type.$$typeof) {
121+
case REACT_PROVIDER_TYPE:
122+
if (enableRenderableContext) break;
123+
else return (type._context.displayName || "Context") + ".Provider";
124+
case REACT_CONTEXT_TYPE:
125+
return enableRenderableContext
126+
? (type.displayName || "Context") + ".Provider"
127+
: (type.displayName || "Context") + ".Consumer";
128+
case REACT_CONSUMER_TYPE:
129+
if (enableRenderableContext)
130+
return (type._context.displayName || "Context") + ".Consumer";
131+
break;
132+
case REACT_FORWARD_REF_TYPE:
133+
var innerType = type.render;
134+
type = type.displayName;
135+
type ||
136+
((type = innerType.displayName || innerType.name || ""),
137+
(type = "" !== type ? "ForwardRef(" + type + ")" : "ForwardRef"));
138+
return type;
139+
case REACT_MEMO_TYPE:
140+
return (
141+
(innerType = type.displayName || null),
142+
null !== innerType
143+
? innerType
144+
: getComponentNameFromType(type.type) || "Memo"
145+
);
146+
case REACT_LAZY_TYPE:
147+
innerType = type._payload;
148+
type = type._init;
149+
try {
150+
return getComponentNameFromType(type(innerType));
151+
} catch (x) {}
152+
}
153+
return null;
154+
}
155+
var ReactSharedInternals = { H: null, A: null, T: null, S: null },
94156
hasOwnProperty = Object.prototype.hasOwnProperty;
157+
function getComponentNameFromFiber(fiber) {
158+
var type = fiber.type;
159+
switch (fiber.tag) {
160+
case 24:
161+
return "Cache";
162+
case 9:
163+
return enableRenderableContext
164+
? (type._context.displayName || "Context") + ".Consumer"
165+
: (type.displayName || "Context") + ".Consumer";
166+
case 10:
167+
return enableRenderableContext
168+
? (type.displayName || "Context") + ".Provider"
169+
: (type._context.displayName || "Context") + ".Provider";
170+
case 18:
171+
return "DehydratedFragment";
172+
case 11:
173+
return (
174+
(fiber = type.render),
175+
(fiber = fiber.displayName || fiber.name || ""),
176+
type.displayName ||
177+
("" !== fiber ? "ForwardRef(" + fiber + ")" : "ForwardRef")
178+
);
179+
case 7:
180+
return "Fragment";
181+
case 26:
182+
case 27:
183+
case 5:
184+
return type;
185+
case 4:
186+
return "Portal";
187+
case 3:
188+
return "Root";
189+
case 6:
190+
return "Text";
191+
case 16:
192+
return getComponentNameFromType(type);
193+
case 8:
194+
return type === REACT_STRICT_MODE_TYPE ? "StrictMode" : "Mode";
195+
case 22:
196+
return "Offscreen";
197+
case 12:
198+
return "Profiler";
199+
case 21:
200+
return "Scope";
201+
case 13:
202+
return "Suspense";
203+
case 19:
204+
return "SuspenseList";
205+
case 25:
206+
return "TracingMarker";
207+
case 17:
208+
case 28:
209+
if (disableLegacyMode) break;
210+
case 1:
211+
case 0:
212+
case 14:
213+
case 15:
214+
if ("function" === typeof type)
215+
return type.displayName || type.name || null;
216+
if ("string" === typeof type) return type;
217+
break;
218+
case 23:
219+
return "LegacyHidden";
220+
}
221+
return null;
222+
}
95223
function getOwner() {
96224
var dispatcher = ReactSharedInternals.A;
97225
return null === dispatcher ? null : dispatcher.getOwner();
98226
}
227+
var didWarnAboutStringRefs;
228+
enableLogStringRefsProd && (didWarnAboutStringRefs = {});
99229
function ReactElement(type, key, _ref, self, source, owner, props) {
100230
_ref = props.ref;
101231
return {
@@ -121,9 +251,9 @@ function jsxProd(type, config, maybeKey) {
121251
} else maybeKey = config;
122252
if (!disableDefaultPropsExceptForClasses && type && type.defaultProps) {
123253
config = type.defaultProps;
124-
for (var propName$0 in config)
125-
void 0 === maybeKey[propName$0] &&
126-
(maybeKey[propName$0] = config[propName$0]);
254+
for (var propName$1 in config)
255+
void 0 === maybeKey[propName$1] &&
256+
(maybeKey[propName$1] = config[propName$1]);
127257
}
128258
return ReactElement(type, key, null, void 0, void 0, getOwner(), maybeKey);
129259
}
@@ -167,15 +297,22 @@ function stringRefAsCallbackRef(stringRef, type, owner, value) {
167297
throw Error(
168298
"Function components cannot have string refs. We recommend using useRef() instead. Learn more about using refs safely here: https://react.dev/link/strict-mode-string-ref"
169299
);
170-
type = owner.stateNode;
171-
if (!type)
300+
enableLogStringRefsProd &&
301+
("function" !== typeof type ||
302+
(type.prototype && type.prototype.isReactComponent)) &&
303+
((type = getComponentNameFromFiber(owner) || "Component"),
304+
didWarnAboutStringRefs[type] ||
305+
(enableLogStringRefsProd && enableLogStringRefsProd(type, stringRef),
306+
(didWarnAboutStringRefs[type] = !0)));
307+
owner = owner.stateNode;
308+
if (!owner)
172309
throw Error(
173310
"Missing owner for string ref " +
174311
stringRef +
175312
". This error is likely caused by a bug in React. Please file an issue."
176313
);
177-
type = type.refs;
178-
null === value ? delete type[stringRef] : (type[stringRef] = value);
314+
owner = owner.refs;
315+
null === value ? delete owner[stringRef] : (owner[stringRef] = value);
179316
}
180317
function escape(key) {
181318
var escaperLookup = { "=": "=0", ":": "=2" };
@@ -667,4 +804,4 @@ exports.useSyncExternalStore = function (
667804
exports.useTransition = function () {
668805
return ReactSharedInternals.H.useTransition();
669806
};
670-
exports.version = "19.0.0-www-classic-b78a7f2f-20241007";
807+
exports.version = "19.0.0-www-classic-5636fad8-20241010";

0 commit comments

Comments
 (0)