fix(replay): Fixes Firefox playback issues #81199
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
... due to shared object references in `replayStepper`. This happens on Replay details page where we have the replayer as well as a tab that uses `replayStepper` (e.g. Breadcrumbs). Both `Replayer` instances were access the same rrweb event object references and because `replayStepper` plays through the entire replay as fast as possible, it ends up mutating the event objects that the player instance later reads. This ends up causing issues in the playback (like screens not updating so the replay appears frozen and broken). We now deep clone the events in `createHiddenPlayer` to avoid the above situation.
billyvg
commented
Nov 22, 2024
| // Replay details player and a hidden player via `replayStepper`) can cause | ||
| // playback issues as the object references are the same, even though the | ||
| // arrays are not. | ||
| structuredClone(rrwebEvents), |
There was a problem hiding this comment.
https://caniuse.com/?search=structuredClone (supported by 94% of browsers)
github-actions
bot
added
the
Scope: Frontend
Bundle ReportChanges will increase total bundle size by 14.48kB (0.05%) ⬆️. This is within the configured threshold ✅ Detailed changes
|
Codecov ReportAttention: Patch coverage is ✅ All tests successful. No failed tests found.
Additional details and impacted files@@ Coverage Diff @@
## master #81199 +/- ##
=======================================
Coverage 80.32% 80.32%
=======================================
Files 7215 7215
Lines 319443 319465 +22
Branches 20773 20775 +2
=======================================
+ Hits 256583 256612 +29
+ Misses 62466 62459 -7
Partials 394 394 |
michellewzhang
approved these changes
Nov 22, 2024
harshithadurai
pushed a commit
that referenced
this pull request
Nov 25, 2024
... due to shared object references in `replayStepper`. This happens on Replay details page where we have the replayer as well as a tab that uses `replayStepper` (e.g. Breadcrumbs). Both `Replayer` instances were access the same rrweb event object references and because `replayStepper` plays through the entire replay as fast as possible, it ends up mutating the event objects that the player instance later reads. This ends up causing issues in the playback (like screens not updating so the replay appears frozen and broken). I don't know exactly what mutations are happening that cause the playback issues, nor do I know why it only affects Firefox and not Chrome. We now deep clone the events in `createHiddenPlayer` to avoid the above situation. We first realized this was an issue with `replayStepper` due to #80681 and [its fix](#80697). The events in our hidden replayer were affecting our main playback which indicates that there was some shared state happening. h/t @ryan953 for the suggestion re: object mutations! Closes getsentry/sentry-javascript#14381 Closes getsentry/sentry-javascript#12978
evanh
pushed a commit
that referenced
this pull request
Nov 25, 2024
... due to shared object references in `replayStepper`. This happens on Replay details page where we have the replayer as well as a tab that uses `replayStepper` (e.g. Breadcrumbs). Both `Replayer` instances were access the same rrweb event object references and because `replayStepper` plays through the entire replay as fast as possible, it ends up mutating the event objects that the player instance later reads. This ends up causing issues in the playback (like screens not updating so the replay appears frozen and broken). I don't know exactly what mutations are happening that cause the playback issues, nor do I know why it only affects Firefox and not Chrome. We now deep clone the events in `createHiddenPlayer` to avoid the above situation. We first realized this was an issue with `replayStepper` due to #80681 and [its fix](#80697). The events in our hidden replayer were affecting our main playback which indicates that there was some shared state happening. h/t @ryan953 for the suggestion re: object mutations! Closes getsentry/sentry-javascript#14381 Closes getsentry/sentry-javascript#12978
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
... due to shared object references in
replayStepper. This happens on Replay details page where we have the replayer as well as a tab that usesreplayStepper(e.g. Breadcrumbs). BothReplayerinstances were access the same rrweb event object references and becausereplayStepperplays through the entire replay as fast as possible, it ends up mutating the event objects that the player instance later reads. This ends up causing issues in the playback (like screens not updating so the replay appears frozen and broken). I don't know exactly what mutations are happening that cause the playback issues, nor do I know why it only affects Firefox and not Chrome.We now deep clone the events in
createHiddenPlayerto avoid the above situation.We first realized this was an issue with
replayStepperdue to #80681 and its fix. The events in our hidden replayer were affecting our main playback which indicates that there was some shared state happening. h/t @ryan953 for the suggestion re: object mutations!Closes getsentry/sentry-javascript#14381
Closes getsentry/sentry-javascript#12978