[DevTools Bug]: `sayHelloToBackendManager` continuously and pointlessly polls on every page

[sneakers-the-rat]

Website or app

(all sites)

Repro steps

From any page:

const printMessage = (event) => {console.log(event)};
window.addEventListener('message', printMessage);

Since there isn't a place to actually describe the bug, i'll put it here: sayHelloToBackendManager is set to poll here until backendInitialized is true: https://github.com/facebook/react/blob/b3003047101b4c7a643788a8faf576f7e370fb45/packages/react-devtools-extensions/src/contentScripts/proxy.js#L17-L23

The polling message has a source react-devtools-content-script: https://github.com/facebook/react/blob/b3003047101b4c7a643788a8faf576f7e370fb45/packages/react-devtools-extensions/src/contentScripts/proxy.js#L41

The switch to set backendInitialized = true checks for the message source react-devtools-bridge: https://github.com/facebook/react/blob/b3003047101b4c7a643788a8faf576f7e370fb45/packages/react-devtools-extensions/src/contentScripts/proxy.js#L65-L66

the react-devtools-bridge sourced message is sent from the backend by whatever invokes this: https://github.com/facebook/react/blob/b3003047101b4c7a643788a8faf576f7e370fb45/packages/react-devtools-extensions/src/contentScripts/backendManager.js#L127

but the handleMessageFromPage function returns if the event.source isn't the window object of the page. Presumably the backend does not have the same window object as the page, or else using postMessage() would be pointless: https://github.com/facebook/react/blob/b3003047101b4c7a643788a8faf576f7e370fb45/packages/react-devtools-extensions/src/contentScripts/proxy.js#L59

The 'react-devtools-bridge' message never flips backendInitialized = true, so the polling never terminates.

This is causing the bitwarden ppl to get a decent amount of heat, and it's actually devtools causing the problem - https://github.com/bitwarden/clients/issues/7575

How often does this bug happen?

Every time

DevTools package (automated)

No response

DevTools version (automated)

No response

Error message (automated)

No response

Error call stack (automated)

No response

Error component stack (automated)

No response

GitHub query string (automated)

No response

[Nathan-Roberts123]

I don't think that the problem bitwarden/clients#7575 should be fix here in the react source code, because the problem is in the bitwarden source code.

[sneakers-the-rat]

the bug in bitwarden revealed a bug in devtools. they are both bugs.

[ctrble]

I think this is related to https://github.com/facebook/react/issues/28323. The site I'm testing on is private and I can't share a repro (sorry!), but this issue describes our situation exactly. It's not a React site and the only extension I have running is the React dev tools. When I disable the extension the message and memory leak both go away.

I'm on a Mac running Chrome Version 123.0.6312.87 (Official Build) (arm64).

[aescobaricc]

if you are using chrome

• go to: chrome://extensions/

• pick React Developer Tools

• set option: Site access Allow this extension to read and change all your data on websites you visit: On Click