From 3ea2885b1ab6d091580c10503c157065717b9de0 Mon Sep 17 00:00:00 2001 From: eoghanmurray Date: Fri, 5 Apr 2024 16:29:55 +0000 Subject: [PATCH] Apply formatting changes --- packages/rrweb-snapshot/src/rebuild.ts | 8 +++++-- packages/rrweb-snapshot/src/snapshot.ts | 15 +++++++------ packages/rrweb-snapshot/test/snapshot.test.ts | 5 +++-- packages/rrweb/test/integration.test.ts | 21 ++++++++++++------- 4 files changed, 30 insertions(+), 19 deletions(-) diff --git a/packages/rrweb-snapshot/src/rebuild.ts b/packages/rrweb-snapshot/src/rebuild.ts index 719477bb57..a305e1eccb 100644 --- a/packages/rrweb-snapshot/src/rebuild.ts +++ b/packages/rrweb-snapshot/src/rebuild.ts @@ -227,9 +227,13 @@ function buildNode( value = adaptCssForReplay(value, cache); } if ((isTextarea || isRemoteOrDynamicCss) && typeof value === 'string') { - if (isRemoteOrDynamicCss && n.childNodes.length && n.childNodes[0].type === NodeType.Text) { + if ( + isRemoteOrDynamicCss && + n.childNodes.length && + n.childNodes[0].type === NodeType.Text + ) { n.childNodes[0].textContent = value; - continue + continue; } node.appendChild(doc.createTextNode(value)); // https://github.com/rrweb-io/rrweb/issues/112 diff --git a/packages/rrweb-snapshot/src/snapshot.ts b/packages/rrweb-snapshot/src/snapshot.ts index bde6e1a49b..c4c2ba90dd 100644 --- a/packages/rrweb-snapshot/src/snapshot.ts +++ b/packages/rrweb-snapshot/src/snapshot.ts @@ -541,7 +541,7 @@ function serializeTextNode( needsMask: boolean | undefined; maskTextFn: MaskTextFn | undefined; rootId: number | undefined; - blankTextNodes? : boolean; + blankTextNodes?: boolean; }, ): serializedNode { const { needsMask, maskTextFn, rootId, blankTextNodes } = options; @@ -569,7 +569,9 @@ function serializeTextNode( ); } catch (err) { console.warn( - `Cannot get CSS styles from text's parentNode. Error: ${err as string}`, + `Cannot get CSS styles from text's parentNode. Error: ${ + err as string + }`, n, ); } @@ -654,10 +656,7 @@ function serializeElementNode( attributes._cssText = absoluteToStylesheet(cssText, stylesheet!.href!); } } - if ( - tagName === 'style' && - (n as HTMLStyleElement).sheet - ) { + if (tagName === 'style' && (n as HTMLStyleElement).sheet) { const cssText = stringifyStylesheet( (n as HTMLStyleElement).sheet as CSSStyleSheet, ); @@ -954,7 +953,7 @@ export function serializeNodeWithId( node: serializedElementNodeWithId, ) => unknown; stylesheetLoadTimeout?: number; - blankTextNodes? : boolean; + blankTextNodes?: boolean; }, ): serializedNodeWithId | null { const { @@ -1106,7 +1105,7 @@ export function serializeNodeWithId( } else { if ( serializedNode.type === NodeType.Element && - (serializedNode as elementNode).attributes._cssText !== undefined + (serializedNode as elementNode).attributes._cssText !== undefined ) { bypassOptions.blankTextNodes = true; } diff --git a/packages/rrweb-snapshot/test/snapshot.test.ts b/packages/rrweb-snapshot/test/snapshot.test.ts index 77bd1da502..54d058a6d9 100644 --- a/packages/rrweb-snapshot/test/snapshot.test.ts +++ b/packages/rrweb-snapshot/test/snapshot.test.ts @@ -172,13 +172,14 @@ describe('style elements', () => { it('should serialize all rules on stylesheets with mix of insertion type', () => { const styleEl = render(``); - styleEl.sheet?.insertRule('section.lost { color: unseeable; }'); // browser throws this away after append + styleEl.sheet?.insertRule('section.lost { color: unseeable; }'); // browser throws this away after append styleEl.append(document.createTextNode('section { color: blue; }')); styleEl.sheet?.insertRule('section.working { color: pink; }'); expect(serializeNode(styleEl)).toMatchObject({ rootId: undefined, attributes: { - _cssText: 'section.working {color: pink;}body {color: red;}section {color: blue;}', + _cssText: + 'section.working {color: pink;}body {color: red;}section {color: blue;}', }, type: 2, }); diff --git a/packages/rrweb/test/integration.test.ts b/packages/rrweb/test/integration.test.ts index 8384765ef1..19d357b00f 100644 --- a/packages/rrweb/test/integration.test.ts +++ b/packages/rrweb/test/integration.test.ts @@ -180,15 +180,21 @@ describe('record integration tests', function (this: ISuite) { await page.evaluate(() => { let styleEl = document.querySelector('style'); if (styleEl) { - styleEl.append(document.createTextNode('body { background-color: darkgreen; }')); - styleEl.append(document.createTextNode('.absolutify { background-image: url("./rel"); }')); + styleEl.append( + document.createTextNode('body { background-color: darkgreen; }'), + ); + styleEl.append( + document.createTextNode( + '.absolutify { background-image: url("./rel"); }', + ), + ); } }); await page.evaluate(() => { let styleEl = document.querySelector('style'); if (styleEl) { - styleEl.childNodes.forEach((cn)=>{ + styleEl.childNodes.forEach((cn) => { if (cn.textContent) { cn.textContent = cn.textContent.replace('darkgreen', 'purple'); } @@ -199,9 +205,12 @@ describe('record integration tests', function (this: ISuite) { await page.evaluate(() => { let styleEl = document.querySelector('style'); if (styleEl) { - styleEl.childNodes.forEach((cn)=>{ + styleEl.childNodes.forEach((cn) => { if (cn.textContent) { - cn.textContent = cn.textContent.replace('black', 'black !important'); + cn.textContent = cn.textContent.replace( + 'black', + 'black !important', + ); } }); } @@ -231,8 +240,6 @@ describe('record integration tests', function (this: ISuite) { 'rgb(128, 0, 128)', // purple 'rgb(0, 0, 0)', // black !important ]); - - }); it('can record childList mutations', async () => {