-
-
Notifications
You must be signed in to change notification settings - Fork 1.7k
fix(browser-utils): Ensure web vital client hooks unsubscribe correctly #17272
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
size-limit report 📦
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Honestly feels like we shouldn't be using arrays at all, but approving to unblock
Yeah you're right, we should think of a more robust way of storing and removing the subscribers. I'll merge this for now to unblock but will think about a safer approach to solve this more generally. Opened #17276 to track. |
This PR fixes two edge cases around our client hook subscriber management: 1. Registering the same callback instance twice on the same hook, resulted in the callback only being invoked once. Fixed by wrapping the passed callback in a function to "unique-ify" it. 2. Unregistering one callback synchronously within the callback, caused other callbacks to not be invoked due to in-place, sync array mutation. Fixed by converting the hooks data structure from `Array<Function>` to `Set<Function>` which is resilient to sync, in-place mutation. This also lets us remove the workaround introduced in #17272 where we initially discovered this bug. Added regression tests for both cases that failed beforehand. closes #17276
So this was a fun one to track down 😅
In our standalone span web vitals code, we register multiple client hooks to listen e.g. for
afterStartPageloadSpan
events. This hook will only fire once (by design), so we want to unsbscribe from it afterwards.Howerver, we register two callbacks (one for LCP, once for CLS). Because we used to unsubscribe synchronously from within the client hook callback, we synchronously removed the callback from the client's hooks array. This synchronous array mutation (shrinking) caused the second callback to no longer be executed.
This surfaced by the LCP span being sent but the CLS span not being sent, due to the CLS span's hook callback no longer being called.
This PR fixes this incorrect unsubscription by deferring the unsubscription calls to the next tick. This way, the array mutation no longer happens synchronously and all remaining callback hooks are invoked correctly.
If you're confused by this, rest assured, I was too 😅 Happy to explain better/in-person on request :D
closes https://linear.app/getsentry/issue/JS-811/investigate-missing-standalone-cls-spans-in-latest-sdk-versions