[Bug]: `/* rrweb_split */` logic causing valid sessions to crash on replayer

[otan]

Preflight Checklist

• [X] I have searched the issue tracker for a bug report that matches the one I want to file, without success.

What package is this bug report for?

rrweb-player

Version

v2.0.0-alpha.17

Expected Behavior

No crashes when a style sheet has multiple child nodes where the individual nodes don't form valid CSS, e.g.

const s = document.createElement("style"); s.append(document.createTextNode("a {")); s.append(document.createTextNode("color: red; }"));
document.head.appendChild(s);

Actual Behavior

Crashes as postcss encounters invalid CSS. Encountered on multiple websites in the wild after https://github.com/rrweb-io/rrweb/pull/1437 was merged by @eoghanmurray

Steps to Reproduce

Add this test to packages/rrweb-snapshot/test/css.test.ts

  it('sad applies css splits correctly', () => {
    // sad path
    const arranHalfCssText = '.a { background-color';
    const arranOtherHalfCssText = ': red; }';
    const markedCssText = [arranHalfCssText, arranOtherHalfCssText].join('/* rr_split */');
    applyCssSplits(sn, markedCssText, true, mockLastUnusedArg);
    expect((sn.childNodes[0] as textNode).textContent).toEqual(arranHalfCssText);
    expect((sn.childNodes[1] as textNode).textContent).toEqual(
      arranOtherHalfCssText,
    );
  });

Testcase Gist URL

No response

Additional Information

No response