Skip to content

[rrweb] fix session replay crash#9365

Merged
Vadman97 merged 13 commits intomainfrom
vadim/session-troubleshooting
Oct 10, 2024
Merged

[rrweb] fix session replay crash#9365
Vadman97 merged 13 commits intomainfrom
vadim/session-troubleshooting

Conversation

@Vadman97
Copy link
Member

@Vadman97 Vadman97 commented Sep 23, 2024

Summary

Bring back postcss css parsing which offers better reliability with inlined stylesheets and better performance.
Fixes replay of a session where the existing CSS parsing of rrweb was broken.
Incorporates rrweb-io/rrweb#1580 to fix broken replays due to postcss crash.

How did you test this change?

https://preview.highlight.io/102751/sessions/35zPFX0OPXs166n5L7m1GEZaqWgL?%7Er_preview=%7B%22action%22%3A%22start%22%2C%22mode%22%3A%22production%22%2C%22region%22%3A%22ewr%22%2C%22variantId%22%3A%2201J8GFGDTWBWCRZZZ7G92P9HJX%22%2C%22variantData%22%3A%22%7B%5C%22type%5C%22%3A%5C%22branch%5C%22%2C%5C%22branch%5C%22%3A%5C%22vadim%2Fsession-troubleshooting%5C%22%2C%5C%22githubOwnerName%5C%22%3A%5C%22highlight%5C%22%2C%5C%22githubRepositoryName%5C%22%3A%5C%22highlight%5C%22%7D%22%7D

fixes replay that is otherwise broken

https://preview.highlight.io/14083/sessions/77X2eTJA5TIbEydiUytAFmZhJoXn?commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&page=1&query=viewed_by_anyone%3Dtrue+visited-url%3D%22*6532da*%22&commentId=90302&commentId=90302&%7Er_preview=%7B%22action%22%3A%22start%22%2C%22mode%22%3A%22production%22%2C%22region%22%3A%22ewr%22%2C%22variantId%22%3A%2201J8GFGDTWBWCRZZZ7G92P9HJX%22%2C%22variantData%22%3A%22%7B%5C%22type%5C%22%3A%5C%22branch%5C%22%2C%5C%22branch%5C%22%3A%5C%22vadim%2Fsession-troubleshooting%5C%22%2C%5C%22githubOwnerName%5C%22%3A%5C%22highlight%5C%22%2C%5C%22githubRepositoryName%5C%22%3A%5C%22highlight%5C%22%7D%22%7D

Are there any deployment considerations?

frontend only

continues to work
Screenshot from 2024-10-09 17-36-41

Does this work require review from our design team?

no

@changeset-bot
Copy link

changeset-bot bot commented Sep 23, 2024

🦋 Changeset detected

Latest commit: 1cca972

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

💥 An error occurred when fetching the changed packages and changesets in this PR
Some errors occurred when validating the changesets config:
The package or glob expression "rrdom" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "rrdom-nodejs" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "rrweb" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "rrweb-player" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "rrweb-snapshot" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/all" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/types" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/record" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/replay" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/packer" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/rrweb-plugin-canvas-webrtc-record" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/rrweb-plugin-canvas-webrtc-replay" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/rrweb-plugin-console-record" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/rrweb-plugin-console-replay" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/rrweb-plugin-sequential-id-record" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/rrweb-plugin-sequential-id-replay" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/utils" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "@rrweb/web-extension" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.
The package or glob expression "rrvideo" is specified in the `ignore` option but it is not found in the project. You may have misspelled the package name or provided an invalid glob expression. Note that glob expressions must be defined according to https://www.npmjs.com/package/micromatch.

@reflame reflame bot had a problem deploying to Preview September 23, 2024 22:21 Failure
@reflame reflame bot had a problem deploying to Preview September 23, 2024 22:25 Failure
@Vadman97 Vadman97 closed this Sep 23, 2024
@Vadman97 Vadman97 changed the title fix session replay crash due to large network resources payload fix session replay crash Sep 23, 2024
@Vadman97 Vadman97 reopened this Sep 23, 2024
@Vadman97 Vadman97 changed the title fix session replay crash [render preview] fix session replay crash Sep 23, 2024
@Vadman97 Vadman97 force-pushed the vadim/session-troubleshooting branch from a9e6f0a to ea0b484 Compare September 24, 2024 17:20
@reflame reflame bot had a problem deploying to Preview September 24, 2024 17:20 Failure
@jay-khatri jay-khatri temporarily deployed to vadim/session-troubleshooting - frontend PR #9365 September 24, 2024 17:20 — with Render Destroyed
@Vadman97 Vadman97 changed the title [render preview] fix session replay crash fix session replay crash Sep 24, 2024
@Vadman97 Vadman97 force-pushed the vadim/session-troubleshooting branch from ea0b484 to a8da995 Compare September 24, 2024 22:13
@reflame reflame bot had a problem deploying to Preview September 24, 2024 22:13 Failure
@Vadman97 Vadman97 force-pushed the vadim/session-troubleshooting branch from a8da995 to 986975c Compare September 24, 2024 22:15
@Vadman97 Vadman97 requested review from a team and SpennyNDaJets and removed request for a team September 24, 2024 22:34
@Vadman97 Vadman97 marked this pull request as ready for review September 24, 2024 22:34
Copy link
Contributor

@SpennyNDaJets SpennyNDaJets left a comment

Choose a reason for hiding this comment

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

@Vadman97 Vadman97 merged commit d94533a into main Oct 10, 2024
@Vadman97 Vadman97 deleted the vadim/session-troubleshooting branch October 10, 2024 18:04
giraffekey pushed a commit to giraffekey/highlight that referenced this pull request Nov 21, 2024
## Summary

Bring back postcss css parsing which offers better reliability with
inlined stylesheets and better performance.
Fixes replay of a session where the existing CSS parsing of rrweb was
broken.
Incorporates rrweb-io/rrweb#1580 to fix broken
replays due to postcss crash.

## How did you test this change?


https://preview.highlight.io/102751/sessions/35zPFX0OPXs166n5L7m1GEZaqWgL?%7Er_preview=%7B%22action%22%3A%22start%22%2C%22mode%22%3A%22production%22%2C%22region%22%3A%22ewr%22%2C%22variantId%22%3A%2201J8GFGDTWBWCRZZZ7G92P9HJX%22%2C%22variantData%22%3A%22%7B%5C%22type%5C%22%3A%5C%22branch%5C%22%2C%5C%22branch%5C%22%3A%5C%22vadim%2Fsession-troubleshooting%5C%22%2C%5C%22githubOwnerName%5C%22%3A%5C%22highlight%5C%22%2C%5C%22githubRepositoryName%5C%22%3A%5C%22highlight%5C%22%7D%22%7D

fixes replay that is otherwise broken 


https://preview.highlight.io/14083/sessions/77X2eTJA5TIbEydiUytAFmZhJoXn?commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&commentId=90302&page=1&query=viewed_by_anyone%3Dtrue+visited-url%3D%22*6532da*%22&commentId=90302&commentId=90302&%7Er_preview=%7B%22action%22%3A%22start%22%2C%22mode%22%3A%22production%22%2C%22region%22%3A%22ewr%22%2C%22variantId%22%3A%2201J8GFGDTWBWCRZZZ7G92P9HJX%22%2C%22variantData%22%3A%22%7B%5C%22type%5C%22%3A%5C%22branch%5C%22%2C%5C%22branch%5C%22%3A%5C%22vadim%2Fsession-troubleshooting%5C%22%2C%5C%22githubOwnerName%5C%22%3A%5C%22highlight%5C%22%2C%5C%22githubRepositoryName%5C%22%3A%5C%22highlight%5C%22%7D%22%7D

## Are there any deployment considerations?

frontend only

continues to work
![Screenshot from 2024-10-09
17-36-41](https://github.com/user-attachments/assets/f4e6b68a-e993-4292-9d76-0049d3e7b797)


## Does this work require review from our design team?

no
@Vadman97 Vadman97 changed the title fix session replay crash [rrweb] fix session replay crash Mar 20, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants