diff --git a/.changeset/angry-turtles-provide.md b/.changeset/angry-turtles-provide.md new file mode 100644 index 0000000000..94750199b2 --- /dev/null +++ b/.changeset/angry-turtles-provide.md @@ -0,0 +1,5 @@ +--- +"rrweb-snapshot": patch +--- + +Handle exceptions thrown from postcss when calling adaptCssForReplay diff --git a/packages/rrweb-snapshot/src/rebuild.ts b/packages/rrweb-snapshot/src/rebuild.ts index d79c8f8716..d5036380c0 100644 --- a/packages/rrweb-snapshot/src/rebuild.ts +++ b/packages/rrweb-snapshot/src/rebuild.ts @@ -64,11 +64,17 @@ export function adaptCssForReplay(cssText: string, cache: BuildCache): string { const cachedStyle = cache?.stylesWithHoverClass.get(cssText); if (cachedStyle) return cachedStyle; - const ast: { css: string } = postcss([ - mediaSelectorPlugin, - pseudoClassPlugin, - ]).process(cssText); - const result = ast.css; + let result = cssText; + try { + const ast: { css: string } = postcss([ + mediaSelectorPlugin, + pseudoClassPlugin, + ]).process(cssText); + result = ast.css; + } catch (error) { + console.warn('Failed to adapt css for replay', error); + } + cache?.stylesWithHoverClass.set(cssText, result); return result; } diff --git a/packages/rrweb-snapshot/test/rebuild.test.ts b/packages/rrweb-snapshot/test/rebuild.test.ts index 14a255bf6d..0eec4faaf1 100644 --- a/packages/rrweb-snapshot/test/rebuild.test.ts +++ b/packages/rrweb-snapshot/test/rebuild.test.ts @@ -3,7 +3,7 @@ */ import * as fs from 'fs'; import * as path from 'path'; -import { beforeEach, describe, expect as _expect, it } from 'vitest'; +import { beforeEach, describe, expect as _expect, it, vi } from 'vitest'; import { adaptCssForReplay, buildNodeWithSN, @@ -244,4 +244,17 @@ ul li.specified c.\\:hover img { should_not_modify, ); }); + + it('handles exceptions from postcss when calling adaptCssForReplay', () => { + const consoleWarnSpy = vi + .spyOn(console, 'warn') + .mockImplementation(() => {}); + // trigger CssSyntaxError by passing invalid css + const cssText = 'a{'; + adaptCssForReplay(cssText, cache); + expect(consoleWarnSpy).toHaveBeenLastCalledWith( + 'Failed to adapt css for replay', + expect.any(Error), + ); + }); });