Skip to content

Commit bce2ac6

Browse files
author
Brian Vaughn
authored
Revert change to backend injection method from PR #16752 (#16864)
PR #16752 changed how we were injecting the backend script to be done by the content script in order to work around Trusted Type limitations with our previous approach. This may have caused a regression (see #16840) so I'm backing it out to verify.
1 parent 9b3cde9 commit bce2ac6

File tree

3 files changed

+37
-28
lines changed

3 files changed

+37
-28
lines changed
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
/* global chrome */
2+
3+
export default function inject(scriptName: string, done: ?Function) {
4+
const source = `
5+
// the prototype stuff is in case document.createElement has been modified
6+
(function () {
7+
var script = document.constructor.prototype.createElement.call(document, 'script');
8+
script.src = "${scriptName}";
9+
script.charset = "utf-8";
10+
document.documentElement.appendChild(script);
11+
script.parentNode.removeChild(script);
12+
})()
13+
`;
14+
15+
chrome.devtools.inspectedWindow.eval(source, function(response, error) {
16+
if (error) {
17+
console.log(error);
18+
}
19+
20+
if (typeof done === 'function') {
21+
done();
22+
}
23+
});
24+
}

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

Lines changed: 10 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -24,26 +24,16 @@ let lastDetectionResult;
2424
// So instead, the hook will use postMessage() to pass message to us here.
2525
// And when this happens, we'll send a message to the "background page".
2626
window.addEventListener('message', function(evt) {
27-
if (evt.source === window && evt.data) {
28-
if (evt.data.source === 'react-devtools-detector') {
29-
lastDetectionResult = {
30-
hasDetectedReact: true,
31-
reactBuildType: evt.data.reactBuildType,
32-
};
33-
chrome.runtime.sendMessage(lastDetectionResult);
34-
} else if (evt.data.source === 'react-devtools-inject-backend') {
35-
// The backend is injected by the content script to avoid CSP and Trusted Types violations,
36-
// since content scripts can modify the DOM and are not subject to the page's policies.
37-
// The prototype stuff is in case document.createElement has been modified.
38-
const script = document.constructor.prototype.createElement.call(
39-
document,
40-
'script',
41-
);
42-
script.src = chrome.runtime.getURL('build/backend.js');
43-
script.charset = 'utf-8';
44-
document.documentElement.appendChild(script);
45-
script.parentNode.removeChild(script);
46-
}
27+
if (
28+
evt.source === window &&
29+
evt.data &&
30+
evt.data.source === 'react-devtools-detector'
31+
) {
32+
lastDetectionResult = {
33+
hasDetectedReact: true,
34+
reactBuildType: evt.data.reactBuildType,
35+
};
36+
chrome.runtime.sendMessage(lastDetectionResult);
4737
}
4838
});
4939

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

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import {createElement} from 'react';
44
import {unstable_createRoot as createRoot, flushSync} from 'react-dom';
55
import Bridge from 'react-devtools-shared/src/bridge';
66
import Store from 'react-devtools-shared/src/devtools/store';
7+
import inject from './inject';
78
import {
89
createViewElementSource,
910
getBrowserName,
@@ -134,14 +135,7 @@ function createPanelIfReactLoaded() {
134135

135136
// Initialize the backend only once the Store has been initialized.
136137
// Otherwise the Store may miss important initial tree op codes.
137-
chrome.devtools.inspectedWindow.eval(
138-
`window.postMessage({ source: 'react-devtools-inject-backend' });`,
139-
function(response, evalError) {
140-
if (evalError) {
141-
console.log(evalError);
142-
}
143-
},
144-
);
138+
inject(chrome.runtime.getURL('build/backend.js'));
145139

146140
const viewElementSourceFunction = createViewElementSource(
147141
bridge,
@@ -161,6 +155,7 @@ function createPanelIfReactLoaded() {
161155
overrideTab,
162156
profilerPortalContainer,
163157
showTabBar: false,
158+
showWelcomeToTheNewDevToolsDialog: true,
164159
store,
165160
viewElementSourceFunction,
166161
}),

0 commit comments

Comments
 (0)