mirror of
https://github.com/facebook/react.git
synced 2025-11-01 09:12:30 +00:00
Ruslan Lesiutin
8fbd307942
Fixes https://github.com/facebook/react/issues/27119, https://github.com/facebook/react/issues/27185. Fixed: - React DevTools now works as expected when user performs in-tab navigation, previously it was just stuck. https://github.com/facebook/react/assets/28902667/b11c5f84-7155-47a5-8b5a-7e90baca5347 - When user closes browser DevTools panel, we now do some cleanup to disconnect ports and emit shutdown event for bridge. This should fix the issue with registering duplicated fibers with the same id in Store. Changed: - We reconnect proxy port once in 25 seconds, in order to [keep service worker alive](https://developer.chrome.com/docs/extensions/whatsnew/#m110-sw-idle). - Instead of unregistering dynamically injected content scripts, wen now get list of already registered scripts and filter them out from scripts that we want to inject again, see dynamicallyInjectContentScripts.js. - Split `main.js` and `background.js` into multiple files. Tested on Chromium and Firefox browsers.
43 lines
1.5 KiB
JavaScript
43 lines
1.5 KiB
JavaScript
/* global chrome */
|
|
|
|
export function setBrowserSelectionFromReact() {
|
|
// This is currently only called on demand when you press "view DOM".
|
|
// In the future, if Chrome adds an inspect() that doesn't switch tabs,
|
|
// we could make this happen automatically when you select another component.
|
|
chrome.devtools.inspectedWindow.eval(
|
|
'(window.__REACT_DEVTOOLS_GLOBAL_HOOK__.$0 !== $0) ?' +
|
|
'(inspect(window.__REACT_DEVTOOLS_GLOBAL_HOOK__.$0), true) :' +
|
|
'false',
|
|
(didSelectionChange, evalError) => {
|
|
if (evalError) {
|
|
console.error(evalError);
|
|
}
|
|
},
|
|
);
|
|
}
|
|
|
|
export function setReactSelectionFromBrowser(bridge) {
|
|
// When the user chooses a different node in the browser Elements tab,
|
|
// copy it over to the hook object so that we can sync the selection.
|
|
chrome.devtools.inspectedWindow.eval(
|
|
'(window.__REACT_DEVTOOLS_GLOBAL_HOOK__ && window.__REACT_DEVTOOLS_GLOBAL_HOOK__.$0 !== $0) ?' +
|
|
'(window.__REACT_DEVTOOLS_GLOBAL_HOOK__.$0 = $0, true) :' +
|
|
'false',
|
|
(didSelectionChange, evalError) => {
|
|
if (evalError) {
|
|
console.error(evalError);
|
|
} else if (didSelectionChange) {
|
|
if (!bridge) {
|
|
console.error(
|
|
'Browser element selection changed, but bridge was not initialized',
|
|
);
|
|
return;
|
|
}
|
|
|
|
// Remember to sync the selection next time we show Components tab.
|
|
bridge.send('syncSelectionFromNativeElementsPanel');
|
|
}
|
|
},
|
|
);
|
|
}
|