Skip to content

Commit e026437

Browse files
josephsavonajosephsavona
committed
[compiler] Option to infer names for anonymous functions (#34410)
Adds a `@enableNameAnonymousFunctions` feature to infer helpful names for anonymous functions within components and hooks. The logic is inspired by a custom Next.js transform, flagged to us by @eps1lon, that does something similar. Implementing this transform within React Compiler means that all React (Compiler) users can benefit from more helpful names when debugging. The idea builds on the fact that JS engines try to infer helpful names for anonymous functions (in stack traces) when those functions are accessed through an object property lookup: ```js ({'a[xyz]': () => { throw new Error('hello!') } }['a[xyz]'])() // Stack trace: Uncaught Error: hello! at a[xyz] (<anonymous>:1:26) // <-- note the name here at <anonymous>:1:60 ``` The new NameAnonymousFunctions transform is gated by the above flag, which is off by default. It attemps to infer names for functions as follows: First, determine a "local" name: * Assigning a function to a named variable uses the variable name. `const f = () => {}` gets the name "f". * Passing the function as an argument to a function gets the name of the function, ie `foo(() => ...)` get the name "foo()", `foo.bar(() => ...)` gets the name "foo.bar()". Note the parenthesis to help understand that it was part of a call. * Passing the function to a known hook uses the name of the hook, `useEffect(() => ...)` uses "useEffect()". * Passing the function as a JSX prop uses the element and attr name, eg `<div onClick={() => ...}` uses "<div>.onClick". Second, the local name is combined with the name of the outer component/hook, so the final names will be strings like `Component[f]` or `useMyHook[useEffect()]`. --- [//]: # (BEGIN SAPLING FOOTER) Stack created with [Sapling](https://sapling-scm.com). Best reviewed with [ReviewStack](https://reviewstack.dev/facebook/react/pull/34410). * #34434 * __->__ #34410 DiffTrain build for [a9410fb](a9410fb)
1 parent 866cba0 commit e026437

26 files changed

+413
-95
lines changed

‎compiled-rn/VERSION_NATIVE_FB‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
19.2.0-native-fb-3f2a42a5-20250908
1+
19.2.0-native-fb-a9410fb4-20250909

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-dev.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<e7695c0bc1692a27009902d171426576>>
10+
* @generated SignedSource<<ab106fb4055a126b611db4d06bc514bd>>
1111
*/
1212

1313
"use strict";
@@ -404,5 +404,5 @@ __DEV__ &&
404404
exports.useFormStatus = function () {
405405
return resolveDispatcher().useHostTransitionStatus();
406406
};
407-
exports.version = "19.2.0-native-fb-3f2a42a5-20250908";
407+
exports.version = "19.2.0-native-fb-a9410fb4-20250909";
408408
})();

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-prod.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<1ff7b31d0764d05d0f7a8aa00a1e4f30>>
10+
* @generated SignedSource<<ebb8d83293db804dee0e0cb2fad3a188>>
1111
*/
1212

1313
"use strict";
@@ -203,4 +203,4 @@ exports.useFormState = function (action, initialState, permalink) {
203203
exports.useFormStatus = function () {
204204
return ReactSharedInternals.H.useHostTransitionStatus();
205205
};
206-
exports.version = "19.2.0-native-fb-3f2a42a5-20250908";
206+
exports.version = "19.2.0-native-fb-a9410fb4-20250909";

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-profiling.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<1ff7b31d0764d05d0f7a8aa00a1e4f30>>
10+
* @generated SignedSource<<ebb8d83293db804dee0e0cb2fad3a188>>
1111
*/
1212

1313
"use strict";
@@ -203,4 +203,4 @@ exports.useFormState = function (action, initialState, permalink) {
203203
exports.useFormStatus = function () {
204204
return ReactSharedInternals.H.useHostTransitionStatus();
205205
};
206-
exports.version = "19.2.0-native-fb-3f2a42a5-20250908";
206+
exports.version = "19.2.0-native-fb-a9410fb4-20250909";

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-dev.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<eeaa77b6ff880bf55d3ec6d4978cea6c>>
10+
* @generated SignedSource<<9f29f72f6f5795bbd29c31ca0b5cfece>>
1111
*/
1212

1313
/*
@@ -29580,11 +29580,11 @@ __DEV__ &&
2958029580
};
2958129581
(function () {
2958229582
var isomorphicReactPackageVersion = React.version;
29583-
if ("19.2.0-native-fb-3f2a42a5-20250908" !== isomorphicReactPackageVersion)
29583+
if ("19.2.0-native-fb-a9410fb4-20250909" !== isomorphicReactPackageVersion)
2958429584
throw Error(
2958529585
'Incompatible React versions: The "react" and "react-dom" packages must have the exact same version. Instead got:\n - react: ' +
2958629586
(isomorphicReactPackageVersion +
29587-
"\n - react-dom: 19.2.0-native-fb-3f2a42a5-20250908\nLearn more: https://react.dev/warnings/version-mismatch")
29587+
"\n - react-dom: 19.2.0-native-fb-a9410fb4-20250909\nLearn more: https://react.dev/warnings/version-mismatch")
2958829588
);
2958929589
})();
2959029590
("function" === typeof Map &&
@@ -29621,10 +29621,10 @@ __DEV__ &&
2962129621
!(function () {
2962229622
var internals = {
2962329623
bundleType: 1,
29624-
version: "19.2.0-native-fb-3f2a42a5-20250908",
29624+
version: "19.2.0-native-fb-a9410fb4-20250909",
2962529625
rendererPackageName: "react-dom",
2962629626
currentDispatcherRef: ReactSharedInternals,
29627-
reconcilerVersion: "19.2.0-native-fb-3f2a42a5-20250908"
29627+
reconcilerVersion: "19.2.0-native-fb-a9410fb4-20250909"
2962829628
};
2962929629
internals.overrideHookState = overrideHookState;
2963029630
internals.overrideHookStateDeletePath = overrideHookStateDeletePath;
@@ -29773,5 +29773,5 @@ __DEV__ &&
2977329773
listenToAllSupportedEvents(container);
2977429774
return new ReactDOMHydrationRoot(initialChildren);
2977529775
};
29776-
exports.version = "19.2.0-native-fb-3f2a42a5-20250908";
29776+
exports.version = "19.2.0-native-fb-a9410fb4-20250909";
2977729777
})();

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-prod.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<92d51389784b006674cd5e30dccfbc4c>>
10+
* @generated SignedSource<<cdae6aebbeaffa3bdeda56dbabf0f617>>
1111
*/
1212

1313
/*
@@ -17388,14 +17388,14 @@ ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = function (target) {
1738817388
};
1738917389
var isomorphicReactPackageVersion$jscomp$inline_2057 = React.version;
1739017390
if (
17391-
"19.2.0-native-fb-3f2a42a5-20250908" !==
17391+
"19.2.0-native-fb-a9410fb4-20250909" !==
1739217392
isomorphicReactPackageVersion$jscomp$inline_2057
1739317393
)
1739417394
throw Error(
1739517395
formatProdErrorMessage(
1739617396
527,
1739717397
isomorphicReactPackageVersion$jscomp$inline_2057,
17398-
"19.2.0-native-fb-3f2a42a5-20250908"
17398+
"19.2.0-native-fb-a9410fb4-20250909"
1739917399
)
1740017400
);
1740117401
ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
@@ -17417,10 +17417,10 @@ ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
1741717417
};
1741817418
var internals$jscomp$inline_2630 = {
1741917419
bundleType: 0,
17420-
version: "19.2.0-native-fb-3f2a42a5-20250908",
17420+
version: "19.2.0-native-fb-a9410fb4-20250909",
1742117421
rendererPackageName: "react-dom",
1742217422
currentDispatcherRef: ReactSharedInternals,
17423-
reconcilerVersion: "19.2.0-native-fb-3f2a42a5-20250908"
17423+
reconcilerVersion: "19.2.0-native-fb-a9410fb4-20250909"
1742417424
};
1742517425
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
1742617426
var hook$jscomp$inline_2631 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -17527,4 +17527,4 @@ exports.hydrateRoot = function (container, initialChildren, options) {
1752717527
listenToAllSupportedEvents(container);
1752817528
return new ReactDOMHydrationRoot(initialChildren);
1752917529
};
17530-
exports.version = "19.2.0-native-fb-3f2a42a5-20250908";
17530+
exports.version = "19.2.0-native-fb-a9410fb4-20250909";

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-profiling.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<d854ec976f6d3c134c060d52440f4840>>
10+
* @generated SignedSource<<edc61f1e9751c6c0c77a45bf0ebcc92b>>
1111
*/
1212

1313
/*
@@ -19398,14 +19398,14 @@ ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = function (target) {
1939819398
};
1939919399
var isomorphicReactPackageVersion$jscomp$inline_2308 = React.version;
1940019400
if (
19401-
"19.2.0-native-fb-3f2a42a5-20250908" !==
19401+
"19.2.0-native-fb-a9410fb4-20250909" !==
1940219402
isomorphicReactPackageVersion$jscomp$inline_2308
1940319403
)
1940419404
throw Error(
1940519405
formatProdErrorMessage(
1940619406
527,
1940719407
isomorphicReactPackageVersion$jscomp$inline_2308,
19408-
"19.2.0-native-fb-3f2a42a5-20250908"
19408+
"19.2.0-native-fb-a9410fb4-20250909"
1940919409
)
1941019410
);
1941119411
ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
@@ -19427,10 +19427,10 @@ ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
1942719427
};
1942819428
var internals$jscomp$inline_2315 = {
1942919429
bundleType: 0,
19430-
version: "19.2.0-native-fb-3f2a42a5-20250908",
19430+
version: "19.2.0-native-fb-a9410fb4-20250909",
1943119431
rendererPackageName: "react-dom",
1943219432
currentDispatcherRef: ReactSharedInternals,
19433-
reconcilerVersion: "19.2.0-native-fb-3f2a42a5-20250908",
19433+
reconcilerVersion: "19.2.0-native-fb-a9410fb4-20250909",
1943419434
getLaneLabelMap: function () {
1943519435
for (
1943619436
var map = new Map(), lane = 1, index$324 = 0;
@@ -19553,4 +19553,4 @@ exports.hydrateRoot = function (container, initialChildren, options) {
1955319553
listenToAllSupportedEvents(container);
1955419554
return new ReactDOMHydrationRoot(initialChildren);
1955519555
};
19556-
exports.version = "19.2.0-native-fb-3f2a42a5-20250908";
19556+
exports.version = "19.2.0-native-fb-a9410fb4-20250909";

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMProfiling-dev.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<98c8085f57017a9e88c788e33791d907>>
10+
* @generated SignedSource<<f707e6dbd74b68b60826c3d97ee00ab5>>
1111
*/
1212

1313
/*
@@ -29636,11 +29636,11 @@ __DEV__ &&
2963629636
};
2963729637
(function () {
2963829638
var isomorphicReactPackageVersion = React.version;
29639-
if ("19.2.0-native-fb-3f2a42a5-20250908" !== isomorphicReactPackageVersion)
29639+
if ("19.2.0-native-fb-a9410fb4-20250909" !== isomorphicReactPackageVersion)
2964029640
throw Error(
2964129641
'Incompatible React versions: The "react" and "react-dom" packages must have the exact same version. Instead got:\n - react: ' +
2964229642
(isomorphicReactPackageVersion +
29643-
"\n - react-dom: 19.2.0-native-fb-3f2a42a5-20250908\nLearn more: https://react.dev/warnings/version-mismatch")
29643+
"\n - react-dom: 19.2.0-native-fb-a9410fb4-20250909\nLearn more: https://react.dev/warnings/version-mismatch")
2964429644
);
2964529645
})();
2964629646
("function" === typeof Map &&
@@ -29677,10 +29677,10 @@ __DEV__ &&
2967729677
!(function () {
2967829678
var internals = {
2967929679
bundleType: 1,
29680-
version: "19.2.0-native-fb-3f2a42a5-20250908",
29680+
version: "19.2.0-native-fb-a9410fb4-20250909",
2968129681
rendererPackageName: "react-dom",
2968229682
currentDispatcherRef: ReactSharedInternals,
29683-
reconcilerVersion: "19.2.0-native-fb-3f2a42a5-20250908"
29683+
reconcilerVersion: "19.2.0-native-fb-a9410fb4-20250909"
2968429684
};
2968529685
internals.overrideHookState = overrideHookState;
2968629686
internals.overrideHookStateDeletePath = overrideHookStateDeletePath;
@@ -30145,7 +30145,7 @@ __DEV__ &&
3014530145
exports.useFormStatus = function () {
3014630146
return resolveDispatcher().useHostTransitionStatus();
3014730147
};
30148-
exports.version = "19.2.0-native-fb-3f2a42a5-20250908";
30148+
exports.version = "19.2.0-native-fb-a9410fb4-20250909";
3014930149
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
3015030150
"function" ===
3015130151
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMProfiling-prod.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<91cd106513d4931e6663a57dd532be2e>>
10+
* @generated SignedSource<<aa2f1fd521880ff87e14cb7631a5764c>>
1111
*/
1212

1313
/*
@@ -17399,14 +17399,14 @@ ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = function (target) {
1739917399
};
1740017400
var isomorphicReactPackageVersion$jscomp$inline_2058 = React.version;
1740117401
if (
17402-
"19.2.0-native-fb-3f2a42a5-20250908" !==
17402+
"19.2.0-native-fb-a9410fb4-20250909" !==
1740317403
isomorphicReactPackageVersion$jscomp$inline_2058
1740417404
)
1740517405
throw Error(
1740617406
formatProdErrorMessage(
1740717407
527,
1740817408
isomorphicReactPackageVersion$jscomp$inline_2058,
17409-
"19.2.0-native-fb-3f2a42a5-20250908"
17409+
"19.2.0-native-fb-a9410fb4-20250909"
1741017410
)
1741117411
);
1741217412
ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
@@ -17428,10 +17428,10 @@ ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
1742817428
};
1742917429
var internals$jscomp$inline_2633 = {
1743017430
bundleType: 0,
17431-
version: "19.2.0-native-fb-3f2a42a5-20250908",
17431+
version: "19.2.0-native-fb-a9410fb4-20250909",
1743217432
rendererPackageName: "react-dom",
1743317433
currentDispatcherRef: ReactSharedInternals,
17434-
reconcilerVersion: "19.2.0-native-fb-3f2a42a5-20250908"
17434+
reconcilerVersion: "19.2.0-native-fb-a9410fb4-20250909"
1743517435
};
1743617436
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
1743717437
var hook$jscomp$inline_2634 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -17691,4 +17691,4 @@ exports.useFormState = function (action, initialState, permalink) {
1769117691
exports.useFormStatus = function () {
1769217692
return ReactSharedInternals.H.useHostTransitionStatus();
1769317693
};
17694-
exports.version = "19.2.0-native-fb-3f2a42a5-20250908";
17694+
exports.version = "19.2.0-native-fb-a9410fb4-20250909";

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMProfiling-profiling.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<60c470cf86324368d60caf7fc692aa50>>
10+
* @generated SignedSource<<b40a6e44898c9f9812a5380ea4b800f9>>
1111
*/
1212

1313
/*
@@ -19413,14 +19413,14 @@ ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = function (target) {
1941319413
};
1941419414
var isomorphicReactPackageVersion$jscomp$inline_2309 = React.version;
1941519415
if (
19416-
"19.2.0-native-fb-3f2a42a5-20250908" !==
19416+
"19.2.0-native-fb-a9410fb4-20250909" !==
1941719417
isomorphicReactPackageVersion$jscomp$inline_2309
1941819418
)
1941919419
throw Error(
1942019420
formatProdErrorMessage(
1942119421
527,
1942219422
isomorphicReactPackageVersion$jscomp$inline_2309,
19423-
"19.2.0-native-fb-3f2a42a5-20250908"
19423+
"19.2.0-native-fb-a9410fb4-20250909"
1942419424
)
1942519425
);
1942619426
ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
@@ -19442,10 +19442,10 @@ ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
1944219442
};
1944319443
var internals$jscomp$inline_2316 = {
1944419444
bundleType: 0,
19445-
version: "19.2.0-native-fb-3f2a42a5-20250908",
19445+
version: "19.2.0-native-fb-a9410fb4-20250909",
1944619446
rendererPackageName: "react-dom",
1944719447
currentDispatcherRef: ReactSharedInternals,
19448-
reconcilerVersion: "19.2.0-native-fb-3f2a42a5-20250908",
19448+
reconcilerVersion: "19.2.0-native-fb-a9410fb4-20250909",
1944919449
getLaneLabelMap: function () {
1945019450
for (
1945119451
var map = new Map(), lane = 1, index$324 = 0;
@@ -19721,7 +19721,7 @@ exports.useFormState = function (action, initialState, permalink) {
1972119721
exports.useFormStatus = function () {
1972219722
return ReactSharedInternals.H.useHostTransitionStatus();
1972319723
};
19724-
exports.version = "19.2.0-native-fb-3f2a42a5-20250908";
19724+
exports.version = "19.2.0-native-fb-a9410fb4-20250909";
1972519725
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
1972619726
"function" ===
1972719727
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

0 commit comments

Comments
 (0)