We are also facing same issue for ChroPath I didn’t get permanent solution yet but here is the work around-

1. Change the chrome DevTools theme, only once it is required.
2. Now open devtools, you find the extension tab in DevTools.
3. You can again change the theme whatever you want to keep and this will fix your problem.

Hi there. I have the same problem. Maybe this info will be useful:

1. When I open some of “pages” (let it be P1) of my SPA, then open DevTools I can’t see “Components” and “Profiler” tabs.
2. I close DevTools
3. Then I switch to the other “page” of SPA (let it be P2)
4. Open DevTools while I’m on P2
5. Now I see “Components” and “Profiler” tabs
6. Without closing DevTools I switch back to P1, the two tabs of RDT-extension still here, profit 😃

I noticed this seems to kill all my other extension-added console tabs as well. Redux, etc.

Does indeed look like the Canary fix resolves this issue (or at least makes it MUCH harder to repro). Going to leave this issue open until the fix has rolled to Chrome stable though, as we’re getting a lot of duplicate reports of this already.

I’m not sure if this is the answer you’re looking for but in Urql Devtools we’ve tried to move away from using chrome.devtools.inspectedWindow.eval in favor of handshaking because of unpredictability like this.

The problem with evaluating an inspected window is you can end up with race conditions or a dependency on polling as is in the case on react devtools.

const loadCheckInterval = setInterval(function() {
  createPanelIfReactLoaded();
}, 1000);

I haven’t been able to reproduce the bug but I wouldn’t be surprised if chrome is doing something funky with interval calls in extensions. It’s not fun but handshaking might make things a little more straight forward, I know messaging is something that the chrome docs encourage over window evals for security reasons.

I noticed this seems to kill all my other extension-added console tabs as well. Redux, etc.

I noticed the same. I just tried in Chrome Canary, I had the same behavior, after going to https://reactjs.org the React tabs appears, together with others:

I tried before with https://localhost:3000 (with no success opening and closing Dev Tools) and with https://farfetch.com. The tabs just reappeared with https://reactjs.org and after closing the Dev Tools between Farfetch and React and refreshing the page.

Oh btw, I was using the version you sent @bvaughn.

This seems to be resolved now for me in Chrome stable so I’m going to close this issue.

But this is a bug.

Yes.

Specifically, it’s a Chrome bug (CR bug 1085215) as mentioned in the issue description 😄 Nothing we can do (here) to fix it.

Thanks, @sanjayautonomiq, this work for me

Neither the experimental version nor 4.6 is working for me (only the workaround mentioned above). I also have the feeling that this is a Chrome issue, as the bug occurred after updating Canary some days ago and persists since that, but the extension works correctly in Stable.

@bvaughn

overscanRowCount={600} seems…very unexpectedly high. … RV and RW exist to avoid generating and working on long lists

True 😄 I know about performance. That was not good, but fast solution. Later I do some kind of custom search of course 😃 About source code to show my app and try to reproduce - sorry, I think I can’t do that, NDA and so on, you know. But I can try to make some small CRA-project with react-virtualized lists, heavy pages etc. And share that repo if I catch this bug again. I’ll tryto find some time to this investigation)

I think this might be related with Chrome 83, I started having this problem after upgrading to 83 and I can reproduce it on Chrome Canary 85.

A colleague using Chromium 81 doesn’t have the problem using the same app.