Skip to content

Commit 7922199

Browse files
committed
refactor[devtools/extension]: migrate from using setInterval for polling if react is loaded (#27323)
`chrome.devtools.inspectedWindow.eval` is asynchronous, so using it in `setInterval` is a mistake. Sometimes this results into mounting React DevTools twice, and user sees errors about duplicated fibers in store. With these changes, `executeIfReactHasLoaded` executed recursively with a threshold (in case if page doesn't have react). Although we minimize the risk of mounting DevTools twice here, this approach is not the best way to have this problem solved. Dumping some thoughts and ideas that I've tried, but which are out of the scope for this release, because they can be too risky and time-consuming. Potential changes: - Have 2 content scripts: - One `prepareInjection` to notify service worker on renderer attached - One which runs on `document_idle` to finalize check, in case if there is no react - Service worker will notify devtools page that it is ready to mount React DevTools panels or should show that there is no React to be found - Extension port from devtools page should be persistent and connected when `main.js` is executed - Might require refactoring the logic of how we connect devtools and proxy ports Some corner cases: - Navigating to restricted pages, like `chrome://<something>` and back - When react is lazily loaded, like in an attached iframe, or just opened modal - In-tab navigation with pre-cached pages, I think only Chrome does it - Firefox is still on manifest v2 and it doesn't allow running content scripts in ExecutionWorld.MAIN, so it requires a different approach DiffTrain build for commit 9b4f847.
1 parent ae2f6ca commit 7922199

File tree

7 files changed

+9
-9
lines changed

7 files changed

+9
-9
lines changed

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-dev.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23994,7 +23994,7 @@ function createFiberRoot(
2399423994
return root;
2399523995
}
2399623996

23997-
var ReactVersion = "18.3.0-canary-7022e8d6a-20230831";
23997+
var ReactVersion = "18.3.0-canary-9b4f847d9-20230901";
2399823998

2399923999
// Might add PROFILE later.
2400024000

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-prod.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8617,7 +8617,7 @@ var devToolsConfig$jscomp$inline_1027 = {
86178617
throw Error("TestRenderer does not support findFiberByHostInstance()");
86188618
},
86198619
bundleType: 0,
8620-
version: "18.3.0-canary-7022e8d6a-20230831",
8620+
version: "18.3.0-canary-9b4f847d9-20230901",
86218621
rendererPackageName: "react-test-renderer"
86228622
};
86238623
var internals$jscomp$inline_1226 = {
@@ -8648,7 +8648,7 @@ var internals$jscomp$inline_1226 = {
86488648
scheduleRoot: null,
86498649
setRefreshHandler: null,
86508650
getCurrentFiber: null,
8651-
reconcilerVersion: "18.3.0-canary-7022e8d6a-20230831"
8651+
reconcilerVersion: "18.3.0-canary-9b4f847d9-20230901"
86528652
};
86538653
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
86548654
var hook$jscomp$inline_1227 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-profiling.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9043,7 +9043,7 @@ var devToolsConfig$jscomp$inline_1069 = {
90439043
throw Error("TestRenderer does not support findFiberByHostInstance()");
90449044
},
90459045
bundleType: 0,
9046-
version: "18.3.0-canary-7022e8d6a-20230831",
9046+
version: "18.3.0-canary-9b4f847d9-20230901",
90479047
rendererPackageName: "react-test-renderer"
90489048
};
90499049
var internals$jscomp$inline_1267 = {
@@ -9074,7 +9074,7 @@ var internals$jscomp$inline_1267 = {
90749074
scheduleRoot: null,
90759075
setRefreshHandler: null,
90769076
getCurrentFiber: null,
9077-
reconcilerVersion: "18.3.0-canary-7022e8d6a-20230831"
9077+
reconcilerVersion: "18.3.0-canary-9b4f847d9-20230901"
90789078
};
90799079
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
90809080
var hook$jscomp$inline_1268 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-dev.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ if (
2727
}
2828
"use strict";
2929

30-
var ReactVersion = "18.3.0-canary-7022e8d6a-20230831";
30+
var ReactVersion = "18.3.0-canary-9b4f847d9-20230901";
3131

3232
// ATTENTION
3333
// When adding new symbols to this file,

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-prod.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -616,4 +616,4 @@ exports.useSyncExternalStore = function (
616616
exports.useTransition = function () {
617617
return ReactCurrentDispatcher.current.useTransition();
618618
};
619-
exports.version = "18.3.0-canary-7022e8d6a-20230831";
619+
exports.version = "18.3.0-canary-9b4f847d9-20230901";

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-profiling.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -619,7 +619,7 @@ exports.useSyncExternalStore = function (
619619
exports.useTransition = function () {
620620
return ReactCurrentDispatcher.current.useTransition();
621621
};
622-
exports.version = "18.3.0-canary-7022e8d6a-20230831";
622+
exports.version = "18.3.0-canary-9b4f847d9-20230901";
623623

624624
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
625625
if (
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
7022e8d6a3222c97d287dfa0f2361acc8a30683a
1+
9b4f847d93aa302c953543ae0631023c06408ad3

0 commit comments

Comments
 (0)