Skip to content

Commit c1f236d

Browse files
committed
early attach in devtools extension so we can patch the console
1 parent f920725 commit c1f236d

File tree

1 file changed

+16
-19
lines changed

1 file changed

+16
-19
lines changed

packages/react-devtools-extensions/src/injectGlobalHook.js

+16-19
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,6 @@
22

33
import nullthrows from 'nullthrows';
44
import {installHook} from 'react-devtools-shared/src/hook';
5-
import {SESSION_STORAGE_RELOAD_AND_PROFILE_KEY} from 'react-devtools-shared/src/constants';
6-
import {sessionStorageGetItem} from 'react-devtools-shared/src/storage';
75

86
function injectCode(code) {
97
const script = document.createElement('script');
@@ -67,24 +65,23 @@ window.__REACT_DEVTOOLS_GLOBAL_HOOK__.nativeWeakMap = WeakMap;
6765
window.__REACT_DEVTOOLS_GLOBAL_HOOK__.nativeSet = Set;
6866
`;
6967

70-
// If we have just reloaded to profile, we need to inject the renderer interface before the app loads.
71-
if (sessionStorageGetItem(SESSION_STORAGE_RELOAD_AND_PROFILE_KEY) === 'true') {
72-
const rendererURL = chrome.runtime.getURL('build/renderer.js');
73-
let rendererCode;
68+
// We need to inject the renderer interface before the app loads so we can patch the
69+
// console before initial render.
70+
const rendererURL = chrome.runtime.getURL('build/renderer.js');
71+
let rendererCode;
7472

75-
// We need to inject in time to catch the initial mount.
76-
// This means we need to synchronously read the renderer code itself,
77-
// and synchronously inject it into the page.
78-
// There are very few ways to actually do this.
79-
// This seems to be the best approach.
80-
const request = new XMLHttpRequest();
81-
request.addEventListener('load', function() {
82-
rendererCode = this.responseText;
83-
});
84-
request.open('GET', rendererURL, false);
85-
request.send();
86-
injectCode(rendererCode);
87-
}
73+
// We need to inject in time to catch the initial mount.
74+
// This means we need to synchronously read the renderer code itself,
75+
// and synchronously inject it into the page.
76+
// There are very few ways to actually do this.
77+
// This seems to be the best approach.
78+
const request = new XMLHttpRequest();
79+
request.addEventListener('load', function() {
80+
rendererCode = this.responseText;
81+
});
82+
request.open('GET', rendererURL, false);
83+
request.send();
84+
injectCode(rendererCode);
8885

8986
// Inject a __REACT_DEVTOOLS_GLOBAL_HOOK__ global for React to interact with.
9087
// Only do this for HTML documents though, to avoid e.g. breaking syntax highlighting for XML docs.

0 commit comments

Comments
 (0)