Skip to content

fix(replay): Fix error state quickly flashing when loading replay #72823

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

Merged
merged 4 commits into from
Jun 18, 2024

Conversation

billyvg
Copy link
Member

@billyvg billyvg commented Jun 14, 2024

This fixes the error state that quickly flashes when loading a replay.

The useReplayData hook makes ~5 requests, but they do not all happen in parallel. The fetching state ends up looking like the following:

  • fetch replay, fetch extra errors, fetch platform ("fetching" == true)
  • above requests finish ("fetching" == false)
  • fetch attachments, fetch extra errors, fetch platform errors ("fetching" == true)

This intermittent fetching state means that we have components that erroneously render an error state because it believes API requests have completed and that the data is missing.

To test:
Loading a replay should no longer flicker and should no longer flicker with a red error screen. We use useReplayReader in quite a few places besides replay details, but I think all of them should benefit from this change.

Closes #70077

This fixes the error state that quickly flashes when loading a replay.

The `useReplayData` hook makes ~5 requests, but they do not all happen in parallel. The fetching state ends up looking like the following:

* fetch replay, fetch extra errors, fetch platform ("fetching" == true)
* above requests finish ("fetching" == false)
* fetch attachments, fetch extra errors, fetch platform errors ("fetching" == true)

This intermittent fetching state means that we have [components that erroneously render](https://github.com/getsentry/sentry/blob/78334b95bc5ff69816fcaeafff8f67fadf0727c7/static/app/components/replays/replayView.tsx#L43) an error state because it believes API requests have completed and that the data is missing.

Closes #70077
@github-actions github-actions bot added the Scope: Frontend Automatically applied to PRs that change frontend components label Jun 14, 2024
Comment on lines +243 to +244
hasFetchedAttachments.current =
hasFetchedAttachments.current || isFetchingAttachments;
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

please double check my logic, but i'm pretty sure this is right and pretty sure we always want to make at least 1 request for attachments or something is wrong.

@billyvg billyvg marked this pull request as ready for review June 14, 2024 21:41
@billyvg billyvg requested a review from a team as a code owner June 14, 2024 21:41
Copy link

codecov bot commented Jun 14, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 78.04%. Comparing base (78334b9) to head (886b128).
Report is 82 commits behind head on master.

Additional details and impacted files
@@            Coverage Diff             @@
##           master   #72823      +/-   ##
==========================================
- Coverage   78.05%   78.04%   -0.02%     
==========================================
  Files        6599     6603       +4     
  Lines      294323   294363      +40     
  Branches    50748    50752       +4     
==========================================
  Hits       229728   229728              
+ Misses      58352    58301      -51     
- Partials     6243     6334      +91     
Files Coverage Δ
static/app/utils/replays/hooks/useReplayData.tsx 100.00% <100.00%> (ø)

... and 169 files with indirect coverage changes

@billyvg billyvg merged commit 9ef7939 into master Jun 18, 2024
42 checks passed
@billyvg billyvg deleted the fix-replay-fix-flashing-of-error-state branch June 18, 2024 15:49
@github-actions github-actions bot locked and limited conversation to collaborators Jul 4, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Scope: Frontend Automatically applied to PRs that change frontend components
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Error screen very briefly flashes during loading state of a replay
3 participants