getsentry / sentry-javascript

Official Sentry SDKs for JavaScript
https://sentry.io
MIT License
7.95k stars 1.57k forks source link

Include window focus/blur and/or visibilitychange in browser breadcrumbs #13300

Open joshkel opened 2 months ago

joshkel commented 2 months ago

Problem Statement

I'm investigating a bug report that I believe may be related to the user switching between tabs. (Our app uses cross-tab coordination and SWR's revalidate on focus feature.) Sentry's breadcrumbs are great for helping me to mentally reconstruct the state that led to the error report, but (by default) it doesn't show when the user switches to or from a web page's tab.

Solution Brainstorm

As I understand it, this can be done with window.onfocus / window.onblur or with document.onvisibilitychange. Focus/blur is probably better, to catch scenarios where the user switches to another app or another browser window as well as scenarios where the user switches to another browser tab. (Or Sentry could record breadcrumbs for both, for examples such as MDN's audio player that want visibilitychange.)

lforst commented 2 months ago

Hi, I think this is a great idea. Gut feeling wise I wouldn't create breadcrumbs for focus/blur because it can get spammy. I believe focus events would also already be covered by our click breadcrumbs. The onvisibilitychange thing though makes sense to me. Backlogging.

joshkel commented 2 months ago

@lforst, for what it's worth, the specific issue I was debugging ended up being related to window.onfocus / window.onblur (i.e., the user has more than one browser window open and is switching between them), not document.onvisibilitychange (the user has more than one browser tab open and is switching between them). I'm not sure that focus events of the web page as a whole (the user switching focus to/from the browser window) would be spammy, and I'm not sure how they would be covered by click events within the webpage, but I'm happy to accept whatever you decide.

Thanks for the consideration and the quick reply.

lforst commented 2 months ago

Ah right, I thought we were talking about adding breadcrumbs for all blur/focus events. Only putting it on window makes sense imo.