message event sent when devtools are opened.

[ar5had]

Hi,

I have setup a message event handler that parses the data sent via message event in my app. Whenever I open react devtools it fires many message events whose source is sometimes Window and it looks like -

Right now I am blocking these message event by doing this -

if((/^react-devtools/gi).test(e.data.source)) {
return;
}

I wanted to know why these message event are being sent and what it is the best way to block these event. I get these message events in both firefox and chrome.

Thanks.

[bvaughn]

DevTools backend and content scripts talk to each other via window.postMessage. These messages are tagged with a source that's either "react-devtools-bridge" or "react-devtools-content-script". DevTools uses this to filter all but its own messages (see backend.js and contentScript.js).

Maybe you could use a similar approach in your application/extension to ignore messages from other extensions?

I'm going to close this issue since it doesn't seem very actionable. 😄

[ar5had]

@bvaughn thanks.
But can you elaborate a bit more on other extensions part -

Maybe you could use a similar approach in your application/extension to ignore messages from other extensions?

[bvaughn]

I thought I did elaborate above 😄 I was suggesting you could do a similar thing as React DevTools does: tag your messages with some unique identifier and then filter out any messages not containing your unique identifier (a whitelist).

[ar5had]

@bvaughn nvm, yes you did elaborate it above. thanks for doing it again.

[bvaughn]

No worries 🤣 I thought maybe my explanation just didn't make sense.