Skip to content

Conversation

KuznetsovRoman
Copy link

Fixes #1734

Copy link

changeset-bot bot commented Sep 8, 2025

🦋 Changeset detected

Latest commit: 9a9db7c

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

This PR includes changesets to release 19 packages
Name Type
@rrweb/record Patch
rrweb Patch
rrweb-snapshot Patch
rrdom Patch
rrdom-nodejs Patch
rrweb-player Patch
@rrweb/all Patch
@rrweb/replay Patch
@rrweb/types Patch
@rrweb/packer Patch
@rrweb/utils Patch
@rrweb/web-extension Patch
rrvideo Patch
@rrweb/rrweb-plugin-console-record Patch
@rrweb/rrweb-plugin-console-replay Patch
@rrweb/rrweb-plugin-sequential-id-record Patch
@rrweb/rrweb-plugin-sequential-id-replay Patch
@rrweb/rrweb-plugin-canvas-webrtc-record Patch
@rrweb/rrweb-plugin-canvas-webrtc-replay Patch

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

@KuznetsovRoman KuznetsovRoman force-pushed the TESTPLANE-712.syntax_err branch 6 times, most recently from d0328dc to 5408907 Compare September 8, 2025 15:53

if (quickTestRegExp.test(cssStringified)) {
// Remove e.g. "border-top-style: ;"
const regex = /(?<=^|\{|\;)\s*[_a-zA-Z][_a-zA-Z0-9-]*:\s*;/gm;
Copy link
Author

Choose a reason for hiding this comment

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

regex breakdown:

  • We should see "new line" or "{" or ";" before regex starts (which is precedes css rule name) (?<=^|\{|\;)
  • Regex might start with empty symbols (between "new line / { / ;" and actual css rule name) \s*
  • Then it matches css rule name [_a-zA-Z][_a-zA-Z0-9-]*
  • After css rule name, there should be ":" symbol (between css rule name and its value) :
  • Then it might have some empty symbols \s*
  • Then its essential to end css rule, without any characters, which might be interpreted as css value ;

All occurrences of that regex are invalid css properties and have to be removed

Comment on lines +175 to +177
const quickTestRegExp = /:\s*;/;

if (quickTestRegExp.test(cssStringified)) {
Copy link
Author

Choose a reason for hiding this comment

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

The bug is rare, so it worth to check "if original css rules even has pattern of :\s*;"

If it hasn't, then we don't need to execute regex.

This will save some CPU cycles

@KuznetsovRoman KuznetsovRoman force-pushed the TESTPLANE-712.syntax_err branch from 5408907 to 9a9db7c Compare September 8, 2025 21:43
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.

[Bug]: Empty css rules break replay with "CssSyntaxError CssSyntaxError: Unclosed string" error
1 participant