Apollo Client Dev Tools get stuck

[stazcp]

Intended outcome: Dev Tools Shows the actual queries live and doesn't get stuck.

Actual outcome: Dev Tools work at times and other times they get stuck showing some queries and not updating when refreshing the page or visiting other pages, it also stops showing new incoming queries.

The workaround is to clear the browser cache and reload the dev tools.

How to reproduce the issue: Use the dev tools in Chrome or Brave browsers.

Desktop (please complete the following information):

• OS: Mac
• Browser [e.g. chrome, safari]: Chrome and Brave
• Browser version [e.g. 22]: latest
• Extension version [e.g. 3.0]: latest

I am trying to increase adoption of useQuery by Apollo because of the ability to use these dev tools so I want to make sure it won't keep getting stuck and make it painful for us to work with.

[jerelmiller]

Hey @stazcp 👋

Thanks for the report and apologies for the difficulty in getting this to work! We've done a lot of updates to the message passing recently to try and make them a bit more robust, but still seems we have some work to do!

By chance do you have an app we can test this against? Unfortunately our demo app that we're using to test the devtools doesn't seem to show this behavior, so its been a bit difficult for us to really dig in to see what might be happening. A lot of the work at this point is a bit of guess work. Any more information you can help us with here would go a long ways!

We'd love to get this fixed! I'll keep poking at the reloading code to see if there is anything that sticks out to me. Hope we can get this figured out soon!

[stazcp]

I also noticed this issue has been brought up before similar issue: https://github.com/apollographql/apollo-client-devtools/issues/108

https://github.com/apollographql/apollo-client-devtools/assets/37573648/df24dbc4-61b7-443c-9201-d6e374ccdeb0

as you can see on the video provided I am performing queries and the tool has recorded 3 of them and now it has stopped working completely.

Forgot to post this comment.

Unfortunately, I cannot share this app with you since it is paid for, after restarting the dev tools a few times it seems to be working now. So I am not able to reproduce consistently but it does get stuck multiple times per day.

Ways to potentially reproduce were:

• making a change on my code and refreshing the page got it stuck.
• long time of inactivity

Although I cannot reproduce 100% of the time, sometimes I just do something else and come back to the window to find it stuck again.

Tech Stack: React, Typescript, Webpack

[jerelmiller]

Appreciate the info! I'm hoping to dig in a little more this week and see if I can figure something out. Again, sorry for the issue!

[jerelmiller]

Hey @stazcp 👋

I recently came to find out that Chrome will shut down the service worker after 30 seconds of inactivity, and in doing so, the port used to communicate between your browser tab and the extension was disconnected.

I just released 4.14.2 of the extension that will automatically reconnect the ports when they disconnect, so I'm hoping you see less of this issue.

Once you're updated to that version (should hit the stores within the next couple hours), let me know if you're still seeing this issue.

[jerelmiller]

Since I haven't heard anything in some time, I'm going to assume this issue has been fixed with recent versions of the devtools. If you still see this issue with recent versions of the devtools, please open a new issue detailing what you're seeing. Thanks!

[github-actions[bot]]

Do you have any feedback for the maintainers? Please tell us by taking a one-minute survey. Your responses will help us understand Apollo Client usage and allow us to serve you better.