Skip to content

Commit

Permalink
feat[devtools]: symbolicate source for inspected element (#28471)
Browse files Browse the repository at this point in the history
Stacked on #28351, please review
only the last commit.

Top-level description of the approach:
1. Once user selects an element from the tree, frontend asks backend to
return the inspected element, this is where we simulate an error
happening in `render` function of the component and then we parse the
error stack. As an improvement, we should probably migrate from custom
implementation of error stack parser to `error-stack-parser` from npm.
2. When frontend receives the inspected element and this object is being
propagated, we create a Promise for symbolicated source, which is then
passed down to all components, which are using `source`.
3. These components use `use` hook for this promise and are wrapped in
Suspense.

Caching:
1. For browser extension, we cache Promises based on requested resource
+ key + column, also added use of
`chrome.devtools.inspectedWindow.getResource` API.
2. For standalone case (RN), we cache based on requested resource url,
we cache the content of it.

DiffTrain build for commit e528728.
  • Loading branch information
hoxyq committed Mar 5, 2024
1 parent 33cc522 commit e534ebb
Show file tree
Hide file tree
Showing 7 changed files with 9 additions and 9 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -25733,7 +25733,7 @@ if (__DEV__) {
return root;
}

var ReactVersion = "18.3.0-canary-61bd00498-20240305";
var ReactVersion = "18.3.0-canary-e5287287a-20240305";

// Might add PROFILE later.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9173,7 +9173,7 @@ var devToolsConfig$jscomp$inline_1014 = {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 0,
version: "18.3.0-canary-61bd00498-20240305",
version: "18.3.0-canary-e5287287a-20240305",
rendererPackageName: "react-test-renderer"
};
var internals$jscomp$inline_1195 = {
Expand Down Expand Up @@ -9204,7 +9204,7 @@ var internals$jscomp$inline_1195 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-canary-61bd00498-20240305"
reconcilerVersion: "18.3.0-canary-e5287287a-20240305"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1196 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9601,7 +9601,7 @@ var devToolsConfig$jscomp$inline_1056 = {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 0,
version: "18.3.0-canary-61bd00498-20240305",
version: "18.3.0-canary-e5287287a-20240305",
rendererPackageName: "react-test-renderer"
};
var internals$jscomp$inline_1236 = {
Expand Down Expand Up @@ -9632,7 +9632,7 @@ var internals$jscomp$inline_1236 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-canary-61bd00498-20240305"
reconcilerVersion: "18.3.0-canary-e5287287a-20240305"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1237 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ if (__DEV__) {
}
var dynamicFlags = require("ReactNativeInternalFeatureFlags");

var ReactVersion = "18.3.0-canary-61bd00498-20240305";
var ReactVersion = "18.3.0-canary-e5287287a-20240305";

// ATTENTION
// When adding new symbols to this file,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -598,4 +598,4 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactCurrentDispatcher.current.useTransition();
};
exports.version = "18.3.0-canary-61bd00498-20240305";
exports.version = "18.3.0-canary-e5287287a-20240305";
Original file line number Diff line number Diff line change
Expand Up @@ -594,7 +594,7 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactCurrentDispatcher.current.useTransition();
};
exports.version = "18.3.0-canary-61bd00498-20240305";
exports.version = "18.3.0-canary-e5287287a-20240305";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
Expand Down
Original file line number Diff line number Diff line change
@@ -1 +1 @@
61bd00498d2a6e23885bac42f3aeb0e02cadb8eb
e5287287aacd3c51d24e223651b7f38ece584c49

0 comments on commit e534ebb

Please sign in to comment.