From 3fb42fe6fdc662705cde3cb86d0981964121d7c1 Mon Sep 17 00:00:00 2001 From: Jinxing Lin <172601673@qq.com> Date: Tue, 12 Jul 2022 11:41:51 +0800 Subject: [PATCH 1/7] rrweb: add selection observer --- packages/rrweb/src/record/index.ts | 11 ++ packages/rrweb/src/record/observer.ts | 53 ++++++++ packages/rrweb/src/replay/index.ts | 25 ++++ packages/rrweb/src/types.ts | 21 ++++ packages/rrweb/test/record.test.ts | 42 +++++++ packages/rrweb/test/replayer.test.ts | 16 +++ packages/rrweb/test/utils.ts | 174 ++++++++++++++++++++++++++ 7 files changed, 342 insertions(+) diff --git a/packages/rrweb/src/record/index.ts b/packages/rrweb/src/record/index.ts index fffb4ce8b8..a7b513c2a0 100644 --- a/packages/rrweb/src/record/index.ts +++ b/packages/rrweb/src/record/index.ts @@ -430,6 +430,17 @@ function record( }, }), ), + selectionCb: (p) => { + wrappedEmit( + wrapEvent({ + type: EventType.IncrementalSnapshot, + data: { + source: IncrementalSource.Selection, + ...p, + }, + }), + ); + }, blockClass, ignoreClass, maskTextClass, diff --git a/packages/rrweb/src/record/observer.ts b/packages/rrweb/src/record/observer.ts index f745a413b2..98fdb70496 100644 --- a/packages/rrweb/src/record/observer.ts +++ b/packages/rrweb/src/record/observer.ts @@ -35,6 +35,8 @@ import { styleDeclarationCallback, IWindow, MutationBufferParam, + SelectionRange, + selectionCallback, } from '../types'; import MutationBuffer from './mutation'; @@ -752,6 +754,47 @@ function initFontObserver({ fontCb, doc }: observerParam): listenerHandler { }; } +function initSelectionObserver(param: observerParam): listenerHandler { + const { mirror, blockClass, selectionCb } = param; + let collapsed = true; + + const updateSelection = () => { + const selection = document.getSelection(); + + if (!selection || (collapsed && selection?.isCollapsed)) return; + + collapsed = selection.isCollapsed || false; + + const ranges: SelectionRange[] = []; + const count = selection.rangeCount || 0; + + for (let i = 0; i < count; i++) { + const range = selection.getRangeAt(i); + + const { startContainer, startOffset, endContainer, endOffset } = range; + + const blocked = + isBlocked(startContainer, blockClass, true) || + isBlocked(endContainer, blockClass, true); + + if (blocked) continue; + + ranges.push({ + start: mirror.getId(startContainer), + startOffset, + end: mirror.getId(endContainer), + endOffset, + }); + } + + selectionCb({ ranges }); + }; + + updateSelection(); + + return on('selectionchange', updateSelection); +} + function mergeHooks(o: observerParam, hooks: hooksParam) { const { mutationCb, @@ -765,6 +808,7 @@ function mergeHooks(o: observerParam, hooks: hooksParam) { styleDeclarationCb, canvasMutationCb, fontCb, + selectionCb, } = o; o.mutationCb = (...p: Arguments) => { if (hooks.mutation) { @@ -832,6 +876,12 @@ function mergeHooks(o: observerParam, hooks: hooksParam) { } fontCb(...p); }; + o.selectionCb = (...p: Arguments) => { + if (hooks.selection) { + hooks.selection(...p); + } + selectionCb(...p); + }; } export function initObservers( @@ -863,6 +913,8 @@ export function initObservers( : () => { // }; + const selectionObserver = initSelectionObserver(o); + // plugins const pluginHandlers: listenerHandler[] = []; for (const plugin of o.plugins) { @@ -883,6 +935,7 @@ export function initObservers( styleSheetObserver(); styleDeclarationObserver(); fontObserver(); + selectionObserver(); pluginHandlers.forEach((h) => h()); }; } diff --git a/packages/rrweb/src/replay/index.ts b/packages/rrweb/src/replay/index.ts index 70efba2b9a..737f089e57 100644 --- a/packages/rrweb/src/replay/index.ts +++ b/packages/rrweb/src/replay/index.ts @@ -1320,6 +1320,31 @@ export class Replayer { } break; } + case IncrementalSource.Selection: { + const doc = this.iframe.contentDocument; + + const ranges = d.ranges.map( + ({ start, startOffset, end, endOffset }) => { + const startContainer = this.mirror.getNode(start); + const endContainer = this.mirror.getNode(end); + + if (!startContainer || !endContainer) return; + + const result = new Range(); + + result.setStart(startContainer, startOffset); + result.setEnd(endContainer, endOffset); + + return result; + }, + ); + + const selection = doc?.getSelection(); + selection?.removeAllRanges(); + + ranges.forEach((r) => r && selection?.addRange(r)); + break; + } default: } } diff --git a/packages/rrweb/src/types.ts b/packages/rrweb/src/types.ts index 2442fb2d35..79ae529651 100644 --- a/packages/rrweb/src/types.ts +++ b/packages/rrweb/src/types.ts @@ -91,6 +91,7 @@ export enum IncrementalSource { Log, Drag, StyleDeclaration, + Selection, } export type mutationData = { @@ -142,6 +143,10 @@ export type fontData = { source: IncrementalSource.Font; } & fontParam; +export type selectionData = { + source: IncrementalSource.Selection; +} & selectionParam; + export type incrementalData = | mutationData | mousemoveData @@ -153,6 +158,7 @@ export type incrementalData = | styleSheetRuleData | canvasMutationData | fontData + | selectionData | styleDeclarationData; export type event = @@ -261,6 +267,7 @@ export type observerParam = { viewportResizeCb: viewportResizeCallback; inputCb: inputCallback; mediaInteractionCb: mediaInteractionCallback; + selectionCb: selectionCallback; blockClass: blockClass; blockSelector: string | null; ignoreClass: string; @@ -331,6 +338,7 @@ export type hooksParam = { styleDeclaration?: styleDeclarationCallback; canvasMutation?: canvasMutationCallback; font?: fontCallback; + selection?: selectionCallback; }; // https://dom.spec.whatwg.org/#interface-mutationrecord @@ -619,6 +627,19 @@ export type DocumentDimension = { absoluteScale: number; }; +export type SelectionRange = { + start: number; + startOffset: number; + end: number; + endOffset: number; +}; + +export type selectionParam = { + ranges: Array; +}; + +export type selectionCallback = (p: selectionParam) => void; + export type DeprecatedMirror = { map: { [key: number]: INode; diff --git a/packages/rrweb/test/record.test.ts b/packages/rrweb/test/record.test.ts index 7fd98d92f5..f9b46aea02 100644 --- a/packages/rrweb/test/record.test.ts +++ b/packages/rrweb/test/record.test.ts @@ -8,6 +8,7 @@ import { EventType, IncrementalSource, styleSheetRuleData, + selectionData, } from '../src/types'; import { assertSnapshot, launchPuppeteer, waitForRAF } from './utils'; @@ -211,6 +212,47 @@ describe('record', function (this: ISuite) { assertSnapshot(ctx.events); }); + it('should record selection event', async () => { + await ctx.page.evaluate(() => { + const { record } = ((window as unknown) as IWindow).rrweb; + record({ + emit: ((window as unknown) as IWindow).emit, + }); + const startNode = document.createElement('p'); + + startNode.innerText = + 'Lorem ipsum dolor sit amet consectetur adipisicing elit.'; + + const endNode = document.createElement('span'); + endNode.innerText = + 'nihil ipsum officiis pariatur laboriosam quas,corrupti vero vitae minus.'; + + document.body.appendChild(startNode); + document.body.appendChild(endNode); + + const selection = window.getSelection(); + const range = new Range(); + + range.setStart(startNode!.firstChild!, 10); + range.setEnd(endNode!.firstChild!, 2); + + selection?.addRange(range); + }); + await waitForRAF(ctx.page); + const selectionData = ctx.events + .filter(({ type, data }) => { + return ( + type === EventType.IncrementalSnapshot && + data.source === IncrementalSource.Selection + ); + }) + .map((ev) => ev.data as selectionData); + + expect(selectionData.length).toEqual(1); + expect(selectionData[0].ranges[0].startOffset).toEqual(10); + expect(selectionData[0].ranges[0].endOffset).toEqual(2); + }); + it('can add custom event', async () => { await ctx.page.evaluate(() => { const { record, addCustomEvent } = ((window as unknown) as IWindow).rrweb; diff --git a/packages/rrweb/test/replayer.test.ts b/packages/rrweb/test/replayer.test.ts index 01927e4dd1..d7ba3fcf81 100644 --- a/packages/rrweb/test/replayer.test.ts +++ b/packages/rrweb/test/replayer.test.ts @@ -5,6 +5,7 @@ import { assertDomSnapshot, launchPuppeteer, sampleEvents as events, + sampleSelectionEvents, sampleStyleSheetRemoveEvents as stylesheetRemoveEvents, waitForRAF, } from './utils'; @@ -202,6 +203,21 @@ describe('replayer', function () { ); }); + it('can restore selection', async () => { + await page.evaluate(`events = ${JSON.stringify(sampleSelectionEvents)}`); + const [startOffset, endOffset] = (await page.evaluate(` + const { Replayer } = rrweb; + const replayer = new Replayer(events); + replayer.pause(1500); + const range = replayer.iframe.contentDocument.getSelection().getRangeAt(0); + + [range.startOffset, range.endOffset]; + `)) as [startOffset: number, endOffset: number]; + + expect(startOffset).toEqual(11); + expect(endOffset).toEqual(6); + }); + it('can fast forward past StyleSheetRule deletion on virtual elements', async () => { await page.evaluate(`events = ${JSON.stringify(styleSheetRuleEvents)}`); diff --git a/packages/rrweb/test/utils.ts b/packages/rrweb/test/utils.ts index eb271598b9..22b54922e9 100644 --- a/packages/rrweb/test/utils.ts +++ b/packages/rrweb/test/utils.ts @@ -459,6 +459,180 @@ export const sampleStyleSheetRemoveEvents: eventWithTime[] = [ }, ]; +export const sampleSelectionEvents: eventWithTime[] = [ + { + type: 0, + data: {}, + timestamp: now, + }, + { + type: 1, + data: {}, + timestamp: now + 100, + }, + { + type: 4, + data: { + href: 'about:blank', + width: 1920, + height: 1080, + }, + timestamp: now + 200, + }, + { + type: 2, + data: { + node: { + type: 0, + childNodes: [ + { + type: 1, + name: 'html', + publicId: '', + systemId: '', + id: 2, + }, + { + type: 2, + tagName: 'html', + attributes: {}, + childNodes: [ + { + type: 2, + tagName: 'head', + attributes: {}, + childNodes: [ + { + type: 3, + textContent: '\\\\n ', + id: 5, + }, + { + type: 2, + tagName: 'meta', + attributes: { + charset: 'UTF-8', + }, + childNodes: [], + id: 6, + }, + { + type: 3, + textContent: '\\\\n ', + id: 7, + }, + ], + id: 4, + }, + { + type: 3, + textContent: '\\\\n ', + id: 8, + }, + { + type: 2, + tagName: 'body', + attributes: {}, + childNodes: [ + { + type: 3, + textContent: '\\\\n Lorem, ipsum\\\\n ', + id: 10, + }, + { + type: 2, + tagName: 'span', + attributes: { + id: 'startNode', + }, + childNodes: [ + { + type: 3, + textContent: + '\\\\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores culpa\\\\n corporis voluptas odit nobis recusandae inventore, magni praesentium\\\\n maiores perferendis quaerat excepturi officia minus velit voluptate\\\\n placeat minima? Nesciunt, eum!\\\\n ', + id: 12, + }, + ], + id: 11, + }, + { + type: 3, + textContent: + '\\\\n dolor sit amet consectetur adipisicing elit. Ad repellendus quas hic\\\\n deleniti, delectus consequatur voluptas aliquam dolore voluptates repellat\\\\n perferendis aperiam saepe maxime officia rem corporis beatae, assumenda\\\\n doloribus.\\\\n ', + id: 13, + }, + { + type: 2, + tagName: 'span', + attributes: { + id: 'endNode', + }, + childNodes: [ + { + type: 3, + textContent: + '\\\\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Recusandae\\\\n explicabo omnis dolores magni, ea doloribus possimus debitis reiciendis\\\\n distinctio perferendis nihil ipsum officiis pariatur laboriosam quas,\\\\n corrupti vero vitae minus.\\\\n ', + id: 15, + }, + ], + id: 14, + }, + { + type: 3, + textContent: '\\\\n \\\\n ', + id: 16, + }, + { + type: 2, + tagName: 'script', + attributes: {}, + childNodes: [ + { + type: 3, + textContent: 'SCRIPT_PLACEHOLDER', + id: 18, + }, + ], + id: 17, + }, + { + type: 3, + textContent: '\\\\n \\\\n \\\\n\\\\n', + id: 19, + }, + ], + id: 9, + }, + ], + id: 3, + }, + ], + id: 1, + }, + initialOffset: { + left: 0, + top: 0, + }, + }, + timestamp: now + 300, + }, + { + type: 3, + data: { + source: 14, + ranges: [ + { + start: 12, + startOffset: 11, + end: 15, + endOffset: 6, + }, + ], + }, + timestamp: now + 400, + }, +]; + export const polyfillWebGLGlobals = () => { // polyfill as jsdom does not have support for these classes // consider replacing with https://www.npmjs.com/package/canvas From cac7d11a1c836bf2ffcc2afb9f4a703a023d68b7 Mon Sep 17 00:00:00 2001 From: Jinxing Lin <172601673@qq.com> Date: Wed, 3 Aug 2022 17:44:21 +0800 Subject: [PATCH 2/7] Update packages/rrweb/src/record/observer.ts Co-authored-by: Yun Feng --- packages/rrweb/src/record/observer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/rrweb/src/record/observer.ts b/packages/rrweb/src/record/observer.ts index 98fdb70496..7a371e93e3 100644 --- a/packages/rrweb/src/record/observer.ts +++ b/packages/rrweb/src/record/observer.ts @@ -755,7 +755,7 @@ function initFontObserver({ fontCb, doc }: observerParam): listenerHandler { } function initSelectionObserver(param: observerParam): listenerHandler { - const { mirror, blockClass, selectionCb } = param; + const { doc, mirror, blockClass, selectionCb } = param; let collapsed = true; const updateSelection = () => { From 1edcc5a3011ff805d41bcb88073fa8899a068561 Mon Sep 17 00:00:00 2001 From: Jinxing Lin <172601673@qq.com> Date: Wed, 3 Aug 2022 17:44:32 +0800 Subject: [PATCH 3/7] Update packages/rrweb/src/record/observer.ts Co-authored-by: Yun Feng --- packages/rrweb/src/record/observer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/rrweb/src/record/observer.ts b/packages/rrweb/src/record/observer.ts index 7a371e93e3..d5b76578cd 100644 --- a/packages/rrweb/src/record/observer.ts +++ b/packages/rrweb/src/record/observer.ts @@ -789,7 +789,7 @@ function initSelectionObserver(param: observerParam): listenerHandler { selectionCb({ ranges }); }; - + updateSelection(); updateSelection(); return on('selectionchange', updateSelection); From 55cafc8e808d812ba55de8f4b268f2a74d9a310b Mon Sep 17 00:00:00 2001 From: Jinxing Lin <172601673@qq.com> Date: Wed, 3 Aug 2022 17:44:38 +0800 Subject: [PATCH 4/7] Update packages/rrweb/src/replay/index.ts Co-authored-by: Yun Feng --- packages/rrweb/src/replay/index.ts | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) diff --git a/packages/rrweb/src/replay/index.ts b/packages/rrweb/src/replay/index.ts index 737f089e57..df76ca9eeb 100644 --- a/packages/rrweb/src/replay/index.ts +++ b/packages/rrweb/src/replay/index.ts @@ -1321,8 +1321,7 @@ export class Replayer { break; } case IncrementalSource.Selection: { - const doc = this.iframe.contentDocument; - + const selectionSet = new Set(); const ranges = d.ranges.map( ({ start, startOffset, end, endOffset }) => { const startContainer = this.mirror.getNode(start); @@ -1334,15 +1333,20 @@ export class Replayer { result.setStart(startContainer, startOffset); result.setEnd(endContainer, endOffset); + const doc = startContainer.ownerDocument; + const selection = doc?.getSelection(); + selection && selectionSet.add(selection); - return result; + return { + range: result, + selection, + }; }, ); - const selection = doc?.getSelection(); - selection?.removeAllRanges(); + selectionSet.forEach((s) => s.removeAllRanges()); - ranges.forEach((r) => r && selection?.addRange(r)); + ranges.forEach((r) => r && r.selection?.addRange(r.range)); break; } default: From dfbfc6f2c42c9831cdff22ea809dcfd3ad575998 Mon Sep 17 00:00:00 2001 From: Jinxing Lin <172601673@qq.com> Date: Wed, 3 Aug 2022 17:48:05 +0800 Subject: [PATCH 5/7] remove: repeat updateSelection --- packages/rrweb/src/record/observer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/rrweb/src/record/observer.ts b/packages/rrweb/src/record/observer.ts index d5b76578cd..7a371e93e3 100644 --- a/packages/rrweb/src/record/observer.ts +++ b/packages/rrweb/src/record/observer.ts @@ -789,7 +789,7 @@ function initSelectionObserver(param: observerParam): listenerHandler { selectionCb({ ranges }); }; - updateSelection(); + updateSelection(); return on('selectionchange', updateSelection); From 9f54a3dd91a98885be7c0c1b3a0a8616eb4c0c1a Mon Sep 17 00:00:00 2001 From: Jinxing Lin <172601673@qq.com> Date: Wed, 3 Aug 2022 18:27:45 +0800 Subject: [PATCH 6/7] Update packages/rrweb/src/record/observer.ts Co-authored-by: Yun Feng --- packages/rrweb/src/record/observer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/rrweb/src/record/observer.ts b/packages/rrweb/src/record/observer.ts index 7a371e93e3..9350906cec 100644 --- a/packages/rrweb/src/record/observer.ts +++ b/packages/rrweb/src/record/observer.ts @@ -759,7 +759,7 @@ function initSelectionObserver(param: observerParam): listenerHandler { let collapsed = true; const updateSelection = () => { - const selection = document.getSelection(); + const selection = doc.getSelection(); if (!selection || (collapsed && selection?.isCollapsed)) return; From 6ec71bc827e2e71805dc08cc50aa7132eaac0ae7 Mon Sep 17 00:00:00 2001 From: Jinxing Lin <172601673@qq.com> Date: Wed, 3 Aug 2022 19:29:04 +0800 Subject: [PATCH 7/7] remove: utils sample events --- packages/rrweb/test/events/selection.ts | 179 ++++++++++++++++++++++++ packages/rrweb/test/replayer.test.ts | 4 +- packages/rrweb/test/utils.ts | 174 ----------------------- 3 files changed, 181 insertions(+), 176 deletions(-) create mode 100644 packages/rrweb/test/events/selection.ts diff --git a/packages/rrweb/test/events/selection.ts b/packages/rrweb/test/events/selection.ts new file mode 100644 index 0000000000..152350b0d4 --- /dev/null +++ b/packages/rrweb/test/events/selection.ts @@ -0,0 +1,179 @@ +import { EventType, eventWithTime, IncrementalSource } from '../../src/types'; + +const now = Date.now(); + +const events: eventWithTime[] = [ + { + type: EventType.DomContentLoaded, + data: {}, + timestamp: now, + }, + { + type: EventType.Load, + data: {}, + timestamp: now + 100, + }, + { + type: EventType.Meta, + data: { + href: 'about:blank', + width: 1920, + height: 1080, + }, + timestamp: now + 200, + }, + { + type: EventType.FullSnapshot, + data: { + node: { + type: 0, + childNodes: [ + { + type: 1, + name: 'html', + publicId: '', + systemId: '', + id: 2, + }, + { + type: 2, + tagName: 'html', + attributes: {}, + childNodes: [ + { + type: 2, + tagName: 'head', + attributes: {}, + childNodes: [ + { + type: 3, + textContent: '\\\\n ', + id: 5, + }, + { + type: 2, + tagName: 'meta', + attributes: { + charset: 'UTF-8', + }, + childNodes: [], + id: 6, + }, + { + type: 3, + textContent: '\\\\n ', + id: 7, + }, + ], + id: 4, + }, + { + type: 3, + textContent: '\\\\n ', + id: 8, + }, + { + type: 2, + tagName: 'body', + attributes: {}, + childNodes: [ + { + type: 3, + textContent: '\\\\n Lorem, ipsum\\\\n ', + id: 10, + }, + { + type: 2, + tagName: 'span', + attributes: { + id: 'startNode', + }, + childNodes: [ + { + type: 3, + textContent: + '\\\\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores culpa\\\\n corporis voluptas odit nobis recusandae inventore, magni praesentium\\\\n maiores perferendis quaerat excepturi officia minus velit voluptate\\\\n placeat minima? Nesciunt, eum!\\\\n ', + id: 12, + }, + ], + id: 11, + }, + { + type: 3, + textContent: + '\\\\n dolor sit amet consectetur adipisicing elit. Ad repellendus quas hic\\\\n deleniti, delectus consequatur voluptas aliquam dolore voluptates repellat\\\\n perferendis aperiam saepe maxime officia rem corporis beatae, assumenda\\\\n doloribus.\\\\n ', + id: 13, + }, + { + type: 2, + tagName: 'span', + attributes: { + id: 'endNode', + }, + childNodes: [ + { + type: 3, + textContent: + '\\\\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Recusandae\\\\n explicabo omnis dolores magni, ea doloribus possimus debitis reiciendis\\\\n distinctio perferendis nihil ipsum officiis pariatur laboriosam quas,\\\\n corrupti vero vitae minus.\\\\n ', + id: 15, + }, + ], + id: 14, + }, + { + type: 3, + textContent: '\\\\n \\\\n ', + id: 16, + }, + { + type: 2, + tagName: 'script', + attributes: {}, + childNodes: [ + { + type: 3, + textContent: 'SCRIPT_PLACEHOLDER', + id: 18, + }, + ], + id: 17, + }, + { + type: 3, + textContent: '\\\\n \\\\n \\\\n\\\\n', + id: 19, + }, + ], + id: 9, + }, + ], + id: 3, + }, + ], + id: 1, + }, + initialOffset: { + left: 0, + top: 0, + }, + }, + timestamp: now + 300, + }, + { + type: EventType.IncrementalSnapshot, + data: { + source: IncrementalSource.Selection, + ranges: [ + { + start: 12, + startOffset: 11, + end: 15, + endOffset: 6, + }, + ], + }, + timestamp: now + 400, + }, +]; + +export default events; diff --git a/packages/rrweb/test/replayer.test.ts b/packages/rrweb/test/replayer.test.ts index d7ba3fcf81..c0c8a07827 100644 --- a/packages/rrweb/test/replayer.test.ts +++ b/packages/rrweb/test/replayer.test.ts @@ -5,7 +5,6 @@ import { assertDomSnapshot, launchPuppeteer, sampleEvents as events, - sampleSelectionEvents, sampleStyleSheetRemoveEvents as stylesheetRemoveEvents, waitForRAF, } from './utils'; @@ -14,6 +13,7 @@ import orderingEvents from './events/ordering'; import scrollEvents from './events/scroll'; import inputEvents from './events/input'; import iframeEvents from './events/iframe'; +import selectionEvents from './events/selection'; import shadowDomEvents from './events/shadow-dom'; import StyleSheetTextMutation from './events/style-sheet-text-mutation'; import canvasInIframe from './events/canvas-in-iframe'; @@ -204,7 +204,7 @@ describe('replayer', function () { }); it('can restore selection', async () => { - await page.evaluate(`events = ${JSON.stringify(sampleSelectionEvents)}`); + await page.evaluate(`events = ${JSON.stringify(selectionEvents)}`); const [startOffset, endOffset] = (await page.evaluate(` const { Replayer } = rrweb; const replayer = new Replayer(events); diff --git a/packages/rrweb/test/utils.ts b/packages/rrweb/test/utils.ts index 22b54922e9..eb271598b9 100644 --- a/packages/rrweb/test/utils.ts +++ b/packages/rrweb/test/utils.ts @@ -459,180 +459,6 @@ export const sampleStyleSheetRemoveEvents: eventWithTime[] = [ }, ]; -export const sampleSelectionEvents: eventWithTime[] = [ - { - type: 0, - data: {}, - timestamp: now, - }, - { - type: 1, - data: {}, - timestamp: now + 100, - }, - { - type: 4, - data: { - href: 'about:blank', - width: 1920, - height: 1080, - }, - timestamp: now + 200, - }, - { - type: 2, - data: { - node: { - type: 0, - childNodes: [ - { - type: 1, - name: 'html', - publicId: '', - systemId: '', - id: 2, - }, - { - type: 2, - tagName: 'html', - attributes: {}, - childNodes: [ - { - type: 2, - tagName: 'head', - attributes: {}, - childNodes: [ - { - type: 3, - textContent: '\\\\n ', - id: 5, - }, - { - type: 2, - tagName: 'meta', - attributes: { - charset: 'UTF-8', - }, - childNodes: [], - id: 6, - }, - { - type: 3, - textContent: '\\\\n ', - id: 7, - }, - ], - id: 4, - }, - { - type: 3, - textContent: '\\\\n ', - id: 8, - }, - { - type: 2, - tagName: 'body', - attributes: {}, - childNodes: [ - { - type: 3, - textContent: '\\\\n Lorem, ipsum\\\\n ', - id: 10, - }, - { - type: 2, - tagName: 'span', - attributes: { - id: 'startNode', - }, - childNodes: [ - { - type: 3, - textContent: - '\\\\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores culpa\\\\n corporis voluptas odit nobis recusandae inventore, magni praesentium\\\\n maiores perferendis quaerat excepturi officia minus velit voluptate\\\\n placeat minima? Nesciunt, eum!\\\\n ', - id: 12, - }, - ], - id: 11, - }, - { - type: 3, - textContent: - '\\\\n dolor sit amet consectetur adipisicing elit. Ad repellendus quas hic\\\\n deleniti, delectus consequatur voluptas aliquam dolore voluptates repellat\\\\n perferendis aperiam saepe maxime officia rem corporis beatae, assumenda\\\\n doloribus.\\\\n ', - id: 13, - }, - { - type: 2, - tagName: 'span', - attributes: { - id: 'endNode', - }, - childNodes: [ - { - type: 3, - textContent: - '\\\\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Recusandae\\\\n explicabo omnis dolores magni, ea doloribus possimus debitis reiciendis\\\\n distinctio perferendis nihil ipsum officiis pariatur laboriosam quas,\\\\n corrupti vero vitae minus.\\\\n ', - id: 15, - }, - ], - id: 14, - }, - { - type: 3, - textContent: '\\\\n \\\\n ', - id: 16, - }, - { - type: 2, - tagName: 'script', - attributes: {}, - childNodes: [ - { - type: 3, - textContent: 'SCRIPT_PLACEHOLDER', - id: 18, - }, - ], - id: 17, - }, - { - type: 3, - textContent: '\\\\n \\\\n \\\\n\\\\n', - id: 19, - }, - ], - id: 9, - }, - ], - id: 3, - }, - ], - id: 1, - }, - initialOffset: { - left: 0, - top: 0, - }, - }, - timestamp: now + 300, - }, - { - type: 3, - data: { - source: 14, - ranges: [ - { - start: 12, - startOffset: 11, - end: 15, - endOffset: 6, - }, - ], - }, - timestamp: now + 400, - }, -]; - export const polyfillWebGLGlobals = () => { // polyfill as jsdom does not have support for these classes // consider replacing with https://www.npmjs.com/package/canvas