From f590bc0da6cfae3140f6b583406cad33bb5e7a2e Mon Sep 17 00:00:00 2001 From: Billy Vong Date: Wed, 19 Jul 2023 16:52:15 -0400 Subject: [PATCH 1/7] !!!! export some types --- .../browser-integration-tests/suites/replay/fileInput/test.ts | 2 +- .../suites/replay/privacyInput/test.ts | 2 +- .../suites/replay/privacyInputMaskAll/test.ts | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/browser-integration-tests/suites/replay/fileInput/test.ts b/packages/browser-integration-tests/suites/replay/fileInput/test.ts index e0827538ba56..3fc546c17322 100644 --- a/packages/browser-integration-tests/suites/replay/fileInput/test.ts +++ b/packages/browser-integration-tests/suites/replay/fileInput/test.ts @@ -1,6 +1,6 @@ import { expect } from '@playwright/test'; import { IncrementalSource } from '@sentry-internal/rrweb'; -import type { inputData } from '@sentry-internal/rrweb/typings/types'; +import type { inputData } from '@sentry-internal/rrweb'; import { sentryTest } from '../../../utils/fixtures'; import type { IncrementalRecordingSnapshot } from '../../../utils/replayHelpers'; diff --git a/packages/browser-integration-tests/suites/replay/privacyInput/test.ts b/packages/browser-integration-tests/suites/replay/privacyInput/test.ts index 3ffc628c133d..cd43dd25fd34 100644 --- a/packages/browser-integration-tests/suites/replay/privacyInput/test.ts +++ b/packages/browser-integration-tests/suites/replay/privacyInput/test.ts @@ -1,6 +1,6 @@ import { expect } from '@playwright/test'; import { IncrementalSource } from '@sentry-internal/rrweb'; -import type { inputData } from '@sentry-internal/rrweb/typings/types'; +import type { inputData } from '@sentry-internal/rrweb'; import { sentryTest } from '../../../utils/fixtures'; import type { IncrementalRecordingSnapshot } from '../../../utils/replayHelpers'; diff --git a/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts b/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts index 4ec89c97a2cb..f7f5edda8d62 100644 --- a/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts +++ b/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts @@ -1,6 +1,6 @@ import { expect } from '@playwright/test'; import { IncrementalSource } from '@sentry-internal/rrweb'; -import type { inputData } from '@sentry-internal/rrweb/typings/types'; +import type { inputData } from '@sentry-internal/rrweb'; import { sentryTest } from '../../../utils/fixtures'; import type { IncrementalRecordingSnapshot } from '../../../utils/replayHelpers'; From e2411e5f4abe708c2b30b5c43df171e6149b46c2 Mon Sep 17 00:00:00 2001 From: Billy Vong Date: Thu, 20 Jul 2023 09:48:43 -0400 Subject: [PATCH 2/7] feat: update references to `__sn` for serialized node, instead use mirror --- packages/replay/src/coreHandlers/handleDom.ts | 43 +++++++++---------- .../src/util/createPerformanceEntries.ts | 4 +- 2 files changed, 22 insertions(+), 25 deletions(-) diff --git a/packages/replay/src/coreHandlers/handleDom.ts b/packages/replay/src/coreHandlers/handleDom.ts index e97e3fe5b8fe..60220f0a5a66 100644 --- a/packages/replay/src/coreHandlers/handleDom.ts +++ b/packages/replay/src/coreHandlers/handleDom.ts @@ -1,4 +1,5 @@ -import type { INode } from '@sentry-internal/rrweb-snapshot'; +import { record } from '@sentry-internal/rrweb'; +import type { serializedElementNodeWithId, serializedNodeWithId } from '@sentry-internal/rrweb-snapshot'; import { NodeType } from '@sentry-internal/rrweb-snapshot'; import type { Breadcrumb } from '@sentry/types'; import { htmlTreeAsString } from '@sentry/utils'; @@ -49,28 +50,26 @@ export const handleDomListener: (replay: ReplayContainer) => (handlerData: DomHa }; /** Get the base DOM breadcrumb. */ -export function getBaseDomBreadcrumb(target: Node | INode | null, message: string): Breadcrumb { - // `__sn` property is the serialized node created by rrweb - const serializedNode = target && isRrwebNode(target) && target.__sn.type === NodeType.Element ? target.__sn : null; +export function getBaseDomBreadcrumb(target: Node | null, message: string): Breadcrumb { + const nodeId = record.mirror.getId(target); + const node = nodeId && record.mirror.getNode(nodeId); + const meta = node && record.mirror.getMeta(node); + const element = meta && isElement(meta) ? meta : null; return { message, - data: serializedNode + data: element ? { - nodeId: serializedNode.id, + nodeId, node: { - id: serializedNode.id, - tagName: serializedNode.tagName, - textContent: target - ? Array.from(target.childNodes) - .map( - (node: Node | INode) => '__sn' in node && node.__sn.type === NodeType.Text && node.__sn.textContent, - ) - .filter(Boolean) // filter out empty values - .map(text => (text as string).trim()) - .join('') - : '', - attributes: getAttributesToRecord(serializedNode.attributes), + id: nodeId, + tagName: element.tagName, + textContent: Array.from(element.childNodes) + .map((node: serializedNodeWithId) => node.type === NodeType.Text && node.textContent) + .filter(Boolean) // filter out empty values + .map(text => (text as string).trim()) + .join(''), + attributes: getAttributesToRecord(element.attributes), }, } : {}, @@ -90,11 +89,11 @@ export function handleDom(handlerData: DomHandlerData): Breadcrumb | null { }); } -function getDomTarget(handlerData: DomHandlerData): { target: Node | INode | null; message: string } { +function getDomTarget(handlerData: DomHandlerData): { target: Node | null; message: string } { const isClick = handlerData.name === 'click'; let message: string | undefined; - let target: Node | INode | null = null; + let target: Node | null = null; // Accessing event.target can throw (see getsentry/raven-js#838, #768) try { @@ -107,6 +106,6 @@ function getDomTarget(handlerData: DomHandlerData): { target: Node | INode | nul return { target, message }; } -function isRrwebNode(node: EventTarget): node is INode { - return '__sn' in node; +function isElement(node: serializedNodeWithId): node is serializedElementNodeWithId { + return node.type === NodeType.Element; } diff --git a/packages/replay/src/util/createPerformanceEntries.ts b/packages/replay/src/util/createPerformanceEntries.ts index f7b02aa324be..c24f04736e82 100644 --- a/packages/replay/src/util/createPerformanceEntries.ts +++ b/packages/replay/src/util/createPerformanceEntries.ts @@ -173,9 +173,7 @@ function createLargestContentfulPaint( data: { value, // LCP "duration" in ms size, - // Not sure why this errors, Node should be correct (Argument of type 'Node' is not assignable to parameter of type 'INode') - // eslint-disable-next-line @typescript-eslint/no-explicit-any - nodeId: record.mirror.getId(entry.element as any), + nodeId: record.mirror.getId(entry.element), }, }; } From 534cdbbd5b66ff3ae8cb4b7c1a3c408ee7510698 Mon Sep 17 00:00:00 2001 From: Billy Vong Date: Thu, 20 Jul 2023 09:49:02 -0400 Subject: [PATCH 3/7] feat: add new mask attributes fn --- .../suites/replay/customEvents/test.ts | 2 +- packages/replay/src/integration.ts | 9 +++++++++ packages/replay/src/types/replay.ts | 9 +++++++-- 3 files changed, 17 insertions(+), 3 deletions(-) diff --git a/packages/browser-integration-tests/suites/replay/customEvents/test.ts b/packages/browser-integration-tests/suites/replay/customEvents/test.ts index 690929dc9d3a..485e850e67bb 100644 --- a/packages/browser-integration-tests/suites/replay/customEvents/test.ts +++ b/packages/browser-integration-tests/suites/replay/customEvents/test.ts @@ -117,7 +117,7 @@ sentryTest( nodeId: expect.any(Number), node: { attributes: { - 'aria-label': '** ***** ** **********', + 'aria-label': 'An Error in aria-label', class: 'btn btn-error', id: 'error', role: 'button', diff --git a/packages/replay/src/integration.ts b/packages/replay/src/integration.ts index 9afe7c9716a8..ed70c3fb597b 100644 --- a/packages/replay/src/integration.ts +++ b/packages/replay/src/integration.ts @@ -79,6 +79,7 @@ export class Replay implements Integration { networkResponseHeaders = [], mask = [], + maskAttributes = ['title', 'placeholder'], unmask = [], block = [], unblock = [], @@ -106,6 +107,14 @@ export class Replay implements Integration { maskInputOptions: { ...(maskInputOptions || {}), password: true }, maskTextFn: maskFn, maskInputFn: maskFn, + maskAttributeFn: (key: string, value: string): string => { + // For now, always mask these attributes + if (maskAttributes.includes(key)) { + return value.replace(/[\S]/g, '*'); + } + + return value; + }, ...getPrivacyOptions({ mask, diff --git a/packages/replay/src/types/replay.ts b/packages/replay/src/types/replay.ts index 46f1e8f4ef93..448ea688d470 100644 --- a/packages/replay/src/types/replay.ts +++ b/packages/replay/src/types/replay.ts @@ -259,7 +259,12 @@ export interface ReplayIntegrationPrivacyOptions { } // These are optional for ReplayPluginOptions because the plugin sets default values -type OptionalReplayPluginOptions = Partial; +type OptionalReplayPluginOptions = Partial & { + /** + * Mask element attributes that are contained in list + */ + maskAttributes?: string[]; +}; export interface DeprecatedPrivacyOptions { /** @@ -283,7 +288,7 @@ export interface DeprecatedPrivacyOptions { */ maskTextClass?: RecordingOptions['maskTextClass']; /** - * @deprecated Use `mask` which accepts an array of CSS selectors + * @derecated Use `mask` which accepts an array of CSS selectors */ maskTextSelector?: RecordingOptions['maskTextSelector']; } From a2567157ce830ec92421eab888f4c505ff880e5c Mon Sep 17 00:00:00 2001 From: Billy Vong Date: Thu, 20 Jul 2023 10:12:58 -0400 Subject: [PATCH 4/7] update snapshots --- .../test.ts-snapshots/seg-1-snap-incremental | 11 +-- .../seg-1-snap-incremental-chromium | 11 +-- .../test.ts-snapshots/seg-3-snap-incremental | 11 +-- .../seg-3-snap-incremental-chromium | 11 +-- .../test.ts-snapshots/seg-5-snap-incremental | 11 +-- .../seg-5-snap-incremental-chromium | 11 +-- .../test.ts-snapshots/seg-6-snap-incremental | 11 +-- .../seg-6-snap-incremental-chromium | 11 +-- .../test.ts-snapshots/seg-7-snap-incremental | 11 +-- .../seg-7-snap-incremental-chromium | 11 +-- .../test.ts-snapshots/seg-9-snap-incremental | 11 +-- .../seg-9-snap-incremental-chromium | 11 +-- .../test.ts-snapshots/privacy-chromium.json | 2 +- .../test.ts-snapshots/privacy-firefox.json | 45 ++++++++----- .../test.ts-snapshots/privacy-webkit.json | 2 +- .../test.ts-snapshots/privacy.json | 45 ++++++++----- .../test.ts-snapshots/privacy-chromium.json | 67 ++++++++----------- .../test.ts-snapshots/privacy-firefox.json | 57 ++++------------ .../test.ts-snapshots/privacy-webkit.json | 67 ++++++++----------- .../test.ts-snapshots/privacy.json | 2 +- .../suites/replay/privacyInput/test.ts | 2 +- .../suites/replay/privacyInputMaskAll/test.ts | 2 +- .../snapshot-2-chromium.json | 44 +++++++----- .../test.ts-snapshots/snapshot-2-webkit.json | 44 +++++++----- .../snapshot-1-chromium.json | 44 +++++++----- .../test.ts-snapshots/snapshot-1-webkit.json | 44 +++++++----- 26 files changed, 321 insertions(+), 278 deletions(-) diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental index f612eadc8f80..02a3e3f893d6 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -25,8 +25,8 @@ "source": 2, "type": 0, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -37,7 +37,8 @@ "type": 2, "id": 9, "x": 41, - "y": 18 + "y": 18, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental-chromium b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental-chromium index f612eadc8f80..02a3e3f893d6 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental-chromium +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental-chromium @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -25,8 +25,8 @@ "source": 2, "type": 0, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -37,7 +37,8 @@ "type": 2, "id": 9, "x": 41, - "y": 18 + "y": 18, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental index f612eadc8f80..02a3e3f893d6 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -25,8 +25,8 @@ "source": 2, "type": 0, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -37,7 +37,8 @@ "type": 2, "id": 9, "x": 41, - "y": 18 + "y": 18, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental-chromium b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental-chromium index f612eadc8f80..02a3e3f893d6 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental-chromium +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental-chromium @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -25,8 +25,8 @@ "source": 2, "type": 0, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -37,7 +37,8 @@ "type": 2, "id": 9, "x": 41, - "y": 18 + "y": 18, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental index 13c75c43bf61..6dd84be3e2dc 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 12, - "x": 41, - "y": 90 + "x": 41.810001373291016, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -25,8 +25,8 @@ "source": 2, "type": 0, "id": 12, - "x": 41, - "y": 90 + "x": 41.810001373291016, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -37,7 +37,8 @@ "type": 2, "id": 12, "x": 41, - "y": 90 + "y": 90, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental-chromium b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental-chromium index 13c75c43bf61..6dd84be3e2dc 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental-chromium +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental-chromium @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 12, - "x": 41, - "y": 90 + "x": 41.810001373291016, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -25,8 +25,8 @@ "source": 2, "type": 0, "id": 12, - "x": 41, - "y": 90 + "x": 41.810001373291016, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -37,7 +37,8 @@ "type": 2, "id": 12, "x": 41, - "y": 90 + "y": 90, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental index c7be8ab3861a..575f1210087b 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 15, - "x": 157, - "y": 90 + "x": 157.13999938964844, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -34,8 +34,8 @@ "source": 2, "type": 0, "id": 15, - "x": 157, - "y": 90 + "x": 157.13999938964844, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -46,7 +46,8 @@ "type": 2, "id": 15, "x": 157, - "y": 90 + "y": 90, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental-chromium b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental-chromium index c7be8ab3861a..575f1210087b 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental-chromium +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental-chromium @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 15, - "x": 157, - "y": 90 + "x": 157.13999938964844, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -34,8 +34,8 @@ "source": 2, "type": 0, "id": 15, - "x": 157, - "y": 90 + "x": 157.13999938964844, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -46,7 +46,8 @@ "type": 2, "id": 15, "x": 157, - "y": 90 + "y": 90, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-7-snap-incremental b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-7-snap-incremental index 5b461c8cb66c..f952a6e3bfaa 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-7-snap-incremental +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-7-snap-incremental @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 12, - "x": 41, - "y": 90 + "x": 41.810001373291016, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -34,8 +34,8 @@ "source": 2, "type": 0, "id": 12, - "x": 41, - "y": 90 + "x": 41.810001373291016, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -46,7 +46,8 @@ "type": 2, "id": 12, "x": 41, - "y": 90 + "y": 90, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-7-snap-incremental-chromium b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-7-snap-incremental-chromium index 5b461c8cb66c..f952a6e3bfaa 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-7-snap-incremental-chromium +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-7-snap-incremental-chromium @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 12, - "x": 41, - "y": 90 + "x": 41.810001373291016, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -34,8 +34,8 @@ "source": 2, "type": 0, "id": 12, - "x": 41, - "y": 90 + "x": 41.810001373291016, + "y": 90.37000274658203 }, "timestamp": [timestamp] }, @@ -46,7 +46,8 @@ "type": 2, "id": 12, "x": 41, - "y": 90 + "y": 90, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-9-snap-incremental b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-9-snap-incremental index f612eadc8f80..02a3e3f893d6 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-9-snap-incremental +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-9-snap-incremental @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -25,8 +25,8 @@ "source": 2, "type": 0, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -37,7 +37,8 @@ "type": 2, "id": 9, "x": 41, - "y": 18 + "y": 18, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-9-snap-incremental-chromium b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-9-snap-incremental-chromium index f612eadc8f80..02a3e3f893d6 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-9-snap-incremental-chromium +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-9-snap-incremental-chromium @@ -5,8 +5,8 @@ "source": 2, "type": 1, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -25,8 +25,8 @@ "source": 2, "type": 0, "id": 9, - "x": 41, - "y": 18 + "x": 41.810001373291016, + "y": 18.479999542236328 }, "timestamp": [timestamp] }, @@ -37,7 +37,8 @@ "type": 2, "id": 9, "x": 41, - "y": 18 + "y": 18, + "pointerType": 0 }, "timestamp": [timestamp] } diff --git a/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-chromium.json b/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-chromium.json index 4ac06ffeb444..a3c9c494b0b5 100644 --- a/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-chromium.json +++ b/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-chromium.json @@ -62,7 +62,7 @@ "type": 2, "tagName": "button", "attributes": { - "aria-label": "***** **", + "aria-label": "Click me", "onclick": "console.log('Test log')" }, "childNodes": [ diff --git a/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-firefox.json b/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-firefox.json index 9ca91c2dc5da..a3c9c494b0b5 100644 --- a/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-firefox.json +++ b/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-firefox.json @@ -62,7 +62,7 @@ "type": 2, "tagName": "button", "attributes": { - "aria-label": "***** **", + "aria-label": "Click me", "onclick": "console.log('Test log')" }, "childNodes": [ @@ -194,6 +194,21 @@ "textContent": "\n ", "id": 28 }, + { + "type": 2, + "tagName": "div", + "attributes": { + "rr_width": "[1250-1300]px", + "rr_height": "[0-50]px" + }, + "childNodes": [], + "id": 29 + }, + { + "type": 3, + "textContent": "\n ", + "id": 30 + }, { "type": 2, "tagName": "svg", @@ -211,7 +226,7 @@ }, "childNodes": [], "isSVG": true, - "id": 30 + "id": 32 }, { "type": 2, @@ -219,7 +234,7 @@ "attributes": {}, "childNodes": [], "isSVG": true, - "id": 31 + "id": 33 }, { "type": 2, @@ -227,16 +242,16 @@ "attributes": {}, "childNodes": [], "isSVG": true, - "id": 32 + "id": 34 } ], "isSVG": true, - "id": 29 + "id": 31 }, { "type": 3, "textContent": "\n ", - "id": 33 + "id": 35 }, { "type": 2, @@ -246,12 +261,12 @@ "src": "file:///none.png" }, "childNodes": [], - "id": 34 + "id": 36 }, { "type": 3, "textContent": "\n ", - "id": 35 + "id": 37 }, { "type": 2, @@ -262,12 +277,12 @@ "src": "file:///none.png" }, "childNodes": [], - "id": 36 + "id": 38 }, { "type": 3, "textContent": "\n ", - "id": 37 + "id": 39 }, { "type": 2, @@ -277,12 +292,12 @@ "rr_height": "[0-50]px" }, "childNodes": [], - "id": 38 + "id": 40 }, { "type": 3, "textContent": "\n ", - "id": 39 + "id": 41 }, { "type": 2, @@ -293,17 +308,17 @@ "rr_height": "[0-50]px" }, "childNodes": [], - "id": 40 + "id": 42 }, { "type": 3, "textContent": "\n ", - "id": 41 + "id": 43 }, { "type": 3, "textContent": "\n\n", - "id": 42 + "id": 44 } ], "id": 8 diff --git a/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-webkit.json b/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-webkit.json index 4ac06ffeb444..a3c9c494b0b5 100644 --- a/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-webkit.json +++ b/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy-webkit.json @@ -62,7 +62,7 @@ "type": 2, "tagName": "button", "attributes": { - "aria-label": "***** **", + "aria-label": "Click me", "onclick": "console.log('Test log')" }, "childNodes": [ diff --git a/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy.json b/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy.json index 9ca91c2dc5da..a3c9c494b0b5 100644 --- a/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy.json +++ b/packages/browser-integration-tests/suites/replay/privacyBlock/test.ts-snapshots/privacy.json @@ -62,7 +62,7 @@ "type": 2, "tagName": "button", "attributes": { - "aria-label": "***** **", + "aria-label": "Click me", "onclick": "console.log('Test log')" }, "childNodes": [ @@ -194,6 +194,21 @@ "textContent": "\n ", "id": 28 }, + { + "type": 2, + "tagName": "div", + "attributes": { + "rr_width": "[1250-1300]px", + "rr_height": "[0-50]px" + }, + "childNodes": [], + "id": 29 + }, + { + "type": 3, + "textContent": "\n ", + "id": 30 + }, { "type": 2, "tagName": "svg", @@ -211,7 +226,7 @@ }, "childNodes": [], "isSVG": true, - "id": 30 + "id": 32 }, { "type": 2, @@ -219,7 +234,7 @@ "attributes": {}, "childNodes": [], "isSVG": true, - "id": 31 + "id": 33 }, { "type": 2, @@ -227,16 +242,16 @@ "attributes": {}, "childNodes": [], "isSVG": true, - "id": 32 + "id": 34 } ], "isSVG": true, - "id": 29 + "id": 31 }, { "type": 3, "textContent": "\n ", - "id": 33 + "id": 35 }, { "type": 2, @@ -246,12 +261,12 @@ "src": "file:///none.png" }, "childNodes": [], - "id": 34 + "id": 36 }, { "type": 3, "textContent": "\n ", - "id": 35 + "id": 37 }, { "type": 2, @@ -262,12 +277,12 @@ "src": "file:///none.png" }, "childNodes": [], - "id": 36 + "id": 38 }, { "type": 3, "textContent": "\n ", - "id": 37 + "id": 39 }, { "type": 2, @@ -277,12 +292,12 @@ "rr_height": "[0-50]px" }, "childNodes": [], - "id": 38 + "id": 40 }, { "type": 3, "textContent": "\n ", - "id": 39 + "id": 41 }, { "type": 2, @@ -293,17 +308,17 @@ "rr_height": "[0-50]px" }, "childNodes": [], - "id": 40 + "id": 42 }, { "type": 3, "textContent": "\n ", - "id": 41 + "id": 43 }, { "type": 3, "textContent": "\n\n", - "id": 42 + "id": 44 } ], "id": 8 diff --git a/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-chromium.json b/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-chromium.json index 6bf1ea7659d3..18759191f988 100644 --- a/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-chromium.json +++ b/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-chromium.json @@ -62,7 +62,7 @@ "type": 2, "tagName": "button", "attributes": { - "aria-label": "***** **", + "aria-label": "Click me", "onclick": "console.log('Test log')" }, "childNodes": [ @@ -186,45 +186,32 @@ "type": 2, "tagName": "svg", "attributes": { - "style": "width:200px;height:200px", - "viewBox": "0 0 80 80", - "data-sentry-unblock": "" + "rr_width": "[200-250]px", + "rr_height": "[200-250]px" }, - "childNodes": [ - { - "type": 2, - "tagName": "path", - "attributes": { - "d": "" - }, - "childNodes": [], - "isSVG": true, - "id": 29 - }, - { - "type": 2, - "tagName": "area", - "attributes": {}, - "childNodes": [], - "isSVG": true, - "id": 30 - }, - { - "type": 2, - "tagName": "rect", - "attributes": {}, - "childNodes": [], - "isSVG": true, - "id": 31 - } - ], + "childNodes": [], "isSVG": true, + "id": 26 + }, + { + "type": 3, + "textContent": "\n ", + "id": 27 + }, + { + "type": 2, + "tagName": "img", + "attributes": { + "rr_width": "[100-150]px", + "rr_height": "[100-150]px" + }, + "childNodes": [], "id": 28 }, { "type": 3, "textContent": "\n ", - "id": 32 + "id": 29 }, { "type": 2, @@ -234,12 +221,12 @@ "rr_height": "[100-150]px" }, "childNodes": [], - "id": 33 + "id": 30 }, { "type": 3, "textContent": "\n ", - "id": 34 + "id": 31 }, { "type": 2, @@ -250,12 +237,12 @@ "src": "file:///none.png" }, "childNodes": [], - "id": 35 + "id": 32 }, { "type": 3, - "textContent": "\n ", - "id": 36 + "textContent": "\n ", + "id": 33 }, { "type": 2, @@ -275,7 +262,7 @@ { "type": 3, "textContent": "\n\n", - "id": 39 + "id": 34 } ], "id": 8 @@ -292,4 +279,4 @@ } }, "timestamp": [timestamp] -} \ No newline at end of file +} diff --git a/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-firefox.json b/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-firefox.json index f1b55c0884ef..4f20b93e13ab 100644 --- a/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-firefox.json +++ b/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-firefox.json @@ -62,7 +62,7 @@ "type": 2, "tagName": "button", "attributes": { - "aria-label": "***** **", + "aria-label": "Click me", "onclick": "console.log('Test log')" }, "childNodes": [ @@ -171,45 +171,17 @@ "type": 2, "tagName": "svg", "attributes": { - "style": "width:200px;height:200px", - "viewBox": "0 0 80 80", - "data-sentry-unblock": "" + "rr_width": "[200-250]px", + "rr_height": "[200-250]px" }, - "childNodes": [ - { - "type": 2, - "tagName": "path", - "attributes": { - "d": "" - }, - "childNodes": [], - "isSVG": true, - "id": 27 - }, - { - "type": 2, - "tagName": "area", - "attributes": {}, - "childNodes": [], - "isSVG": true, - "id": 28 - }, - { - "type": 2, - "tagName": "rect", - "attributes": {}, - "childNodes": [], - "isSVG": true, - "id": 29 - } - ], + "childNodes": [], "isSVG": true, "id": 26 }, { "type": 3, "textContent": "\n ", - "id": 30 + "id": 27 }, { "type": 2, @@ -219,28 +191,27 @@ "rr_height": "[100-150]px" }, "childNodes": [], - "id": 31 + "id": 28 }, { "type": 3, "textContent": "\n ", - "id": 32 + "id": 29 }, { "type": 2, "tagName": "img", "attributes": { - "data-sentry-unblock": "", - "style": "width:100px;height:100px", - "src": "file:///none.png" + "rr_width": "[100-150]px", + "rr_height": "[100-150]px" }, "childNodes": [], - "id": 33 + "id": 30 }, { "type": 3, "textContent": "\n ", - "id": 34 + "id": 31 }, { "type": 2, @@ -250,17 +221,17 @@ "rr_height": "[0-50]px" }, "childNodes": [], - "id": 35 + "id": 32 }, { "type": 3, "textContent": "\n ", - "id": 36 + "id": 33 }, { "type": 3, "textContent": "\n\n", - "id": 37 + "id": 34 } ], "id": 8 diff --git a/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-webkit.json b/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-webkit.json index 6bf1ea7659d3..18759191f988 100644 --- a/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-webkit.json +++ b/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy-webkit.json @@ -62,7 +62,7 @@ "type": 2, "tagName": "button", "attributes": { - "aria-label": "***** **", + "aria-label": "Click me", "onclick": "console.log('Test log')" }, "childNodes": [ @@ -186,45 +186,32 @@ "type": 2, "tagName": "svg", "attributes": { - "style": "width:200px;height:200px", - "viewBox": "0 0 80 80", - "data-sentry-unblock": "" + "rr_width": "[200-250]px", + "rr_height": "[200-250]px" }, - "childNodes": [ - { - "type": 2, - "tagName": "path", - "attributes": { - "d": "" - }, - "childNodes": [], - "isSVG": true, - "id": 29 - }, - { - "type": 2, - "tagName": "area", - "attributes": {}, - "childNodes": [], - "isSVG": true, - "id": 30 - }, - { - "type": 2, - "tagName": "rect", - "attributes": {}, - "childNodes": [], - "isSVG": true, - "id": 31 - } - ], + "childNodes": [], "isSVG": true, + "id": 26 + }, + { + "type": 3, + "textContent": "\n ", + "id": 27 + }, + { + "type": 2, + "tagName": "img", + "attributes": { + "rr_width": "[100-150]px", + "rr_height": "[100-150]px" + }, + "childNodes": [], "id": 28 }, { "type": 3, "textContent": "\n ", - "id": 32 + "id": 29 }, { "type": 2, @@ -234,12 +221,12 @@ "rr_height": "[100-150]px" }, "childNodes": [], - "id": 33 + "id": 30 }, { "type": 3, "textContent": "\n ", - "id": 34 + "id": 31 }, { "type": 2, @@ -250,12 +237,12 @@ "src": "file:///none.png" }, "childNodes": [], - "id": 35 + "id": 32 }, { "type": 3, - "textContent": "\n ", - "id": 36 + "textContent": "\n ", + "id": 33 }, { "type": 2, @@ -275,7 +262,7 @@ { "type": 3, "textContent": "\n\n", - "id": 39 + "id": 34 } ], "id": 8 @@ -292,4 +279,4 @@ } }, "timestamp": [timestamp] -} \ No newline at end of file +} diff --git a/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy.json b/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy.json index f1b55c0884ef..964209872b06 100644 --- a/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy.json +++ b/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy.json @@ -62,7 +62,7 @@ "type": 2, "tagName": "button", "attributes": { - "aria-label": "***** **", + "aria-label": "Click me", "onclick": "console.log('Test log')" }, "childNodes": [ diff --git a/packages/browser-integration-tests/suites/replay/privacyInput/test.ts b/packages/browser-integration-tests/suites/replay/privacyInput/test.ts index cd43dd25fd34..3b76e5622225 100644 --- a/packages/browser-integration-tests/suites/replay/privacyInput/test.ts +++ b/packages/browser-integration-tests/suites/replay/privacyInput/test.ts @@ -1,6 +1,6 @@ import { expect } from '@playwright/test'; -import { IncrementalSource } from '@sentry-internal/rrweb'; import type { inputData } from '@sentry-internal/rrweb'; +import { IncrementalSource } from '@sentry-internal/rrweb'; import { sentryTest } from '../../../utils/fixtures'; import type { IncrementalRecordingSnapshot } from '../../../utils/replayHelpers'; diff --git a/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts b/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts index f7f5edda8d62..e98839f7fa37 100644 --- a/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts +++ b/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts @@ -1,6 +1,6 @@ import { expect } from '@playwright/test'; -import { IncrementalSource } from '@sentry-internal/rrweb'; import type { inputData } from '@sentry-internal/rrweb'; +import { IncrementalSource } from '@sentry-internal/rrweb'; import { sentryTest } from '../../../utils/fixtures'; import type { IncrementalRecordingSnapshot } from '../../../utils/replayHelpers'; diff --git a/packages/browser-integration-tests/suites/replay/sessionExpiry/test.ts-snapshots/snapshot-2-chromium.json b/packages/browser-integration-tests/suites/replay/sessionExpiry/test.ts-snapshots/snapshot-2-chromium.json index d510b410a343..13e5b1b70103 100644 --- a/packages/browser-integration-tests/suites/replay/sessionExpiry/test.ts-snapshots/snapshot-2-chromium.json +++ b/packages/browser-integration-tests/suites/replay/sessionExpiry/test.ts-snapshots/snapshot-2-chromium.json @@ -9,7 +9,8 @@ "name": "html", "publicId": "", "systemId": "", - "id": 2 + "rootId": 16, + "id": 17 }, { "type": 2, @@ -28,15 +29,18 @@ "charset": "utf-8" }, "childNodes": [], - "id": 5 + "rootId": 16, + "id": 20 } ], - "id": 4 + "rootId": 16, + "id": 19 }, { "type": 3, "textContent": "\n ", - "id": 6 + "rootId": 16, + "id": 21 }, { "type": 2, @@ -46,7 +50,8 @@ { "type": 3, "textContent": "\n ", - "id": 8 + "rootId": 16, + "id": 23 }, { "type": 2, @@ -59,15 +64,18 @@ { "type": 3, "textContent": "***** **", - "id": 10 + "rootId": 16, + "id": 25 } ], - "id": 9 + "rootId": 16, + "id": 24 }, { "type": 3, "textContent": "\n ", - "id": 11 + "rootId": 16, + "id": 26 }, { "type": 2, @@ -80,29 +88,35 @@ { "type": 3, "textContent": "***** **", - "id": 13 + "rootId": 16, + "id": 28 } ], - "id": 12 + "rootId": 16, + "id": 27 }, { "type": 3, "textContent": "\n ", - "id": 14 + "rootId": 16, + "id": 29 }, { "type": 3, "textContent": "\n\n", - "id": 15 + "rootId": 16, + "id": 30 } ], - "id": 7 + "rootId": 16, + "id": 22 } ], - "id": 3 + "rootId": 16, + "id": 18 } ], - "id": 1 + "id": 16 }, "initialOffset": { "left": 0, diff --git a/packages/browser-integration-tests/suites/replay/sessionExpiry/test.ts-snapshots/snapshot-2-webkit.json b/packages/browser-integration-tests/suites/replay/sessionExpiry/test.ts-snapshots/snapshot-2-webkit.json index d510b410a343..13e5b1b70103 100644 --- a/packages/browser-integration-tests/suites/replay/sessionExpiry/test.ts-snapshots/snapshot-2-webkit.json +++ b/packages/browser-integration-tests/suites/replay/sessionExpiry/test.ts-snapshots/snapshot-2-webkit.json @@ -9,7 +9,8 @@ "name": "html", "publicId": "", "systemId": "", - "id": 2 + "rootId": 16, + "id": 17 }, { "type": 2, @@ -28,15 +29,18 @@ "charset": "utf-8" }, "childNodes": [], - "id": 5 + "rootId": 16, + "id": 20 } ], - "id": 4 + "rootId": 16, + "id": 19 }, { "type": 3, "textContent": "\n ", - "id": 6 + "rootId": 16, + "id": 21 }, { "type": 2, @@ -46,7 +50,8 @@ { "type": 3, "textContent": "\n ", - "id": 8 + "rootId": 16, + "id": 23 }, { "type": 2, @@ -59,15 +64,18 @@ { "type": 3, "textContent": "***** **", - "id": 10 + "rootId": 16, + "id": 25 } ], - "id": 9 + "rootId": 16, + "id": 24 }, { "type": 3, "textContent": "\n ", - "id": 11 + "rootId": 16, + "id": 26 }, { "type": 2, @@ -80,29 +88,35 @@ { "type": 3, "textContent": "***** **", - "id": 13 + "rootId": 16, + "id": 28 } ], - "id": 12 + "rootId": 16, + "id": 27 }, { "type": 3, "textContent": "\n ", - "id": 14 + "rootId": 16, + "id": 29 }, { "type": 3, "textContent": "\n\n", - "id": 15 + "rootId": 16, + "id": 30 } ], - "id": 7 + "rootId": 16, + "id": 22 } ], - "id": 3 + "rootId": 16, + "id": 18 } ], - "id": 1 + "id": 16 }, "initialOffset": { "left": 0, diff --git a/packages/browser-integration-tests/suites/replay/sessionInactive/test.ts-snapshots/snapshot-1-chromium.json b/packages/browser-integration-tests/suites/replay/sessionInactive/test.ts-snapshots/snapshot-1-chromium.json index d510b410a343..13e5b1b70103 100644 --- a/packages/browser-integration-tests/suites/replay/sessionInactive/test.ts-snapshots/snapshot-1-chromium.json +++ b/packages/browser-integration-tests/suites/replay/sessionInactive/test.ts-snapshots/snapshot-1-chromium.json @@ -9,7 +9,8 @@ "name": "html", "publicId": "", "systemId": "", - "id": 2 + "rootId": 16, + "id": 17 }, { "type": 2, @@ -28,15 +29,18 @@ "charset": "utf-8" }, "childNodes": [], - "id": 5 + "rootId": 16, + "id": 20 } ], - "id": 4 + "rootId": 16, + "id": 19 }, { "type": 3, "textContent": "\n ", - "id": 6 + "rootId": 16, + "id": 21 }, { "type": 2, @@ -46,7 +50,8 @@ { "type": 3, "textContent": "\n ", - "id": 8 + "rootId": 16, + "id": 23 }, { "type": 2, @@ -59,15 +64,18 @@ { "type": 3, "textContent": "***** **", - "id": 10 + "rootId": 16, + "id": 25 } ], - "id": 9 + "rootId": 16, + "id": 24 }, { "type": 3, "textContent": "\n ", - "id": 11 + "rootId": 16, + "id": 26 }, { "type": 2, @@ -80,29 +88,35 @@ { "type": 3, "textContent": "***** **", - "id": 13 + "rootId": 16, + "id": 28 } ], - "id": 12 + "rootId": 16, + "id": 27 }, { "type": 3, "textContent": "\n ", - "id": 14 + "rootId": 16, + "id": 29 }, { "type": 3, "textContent": "\n\n", - "id": 15 + "rootId": 16, + "id": 30 } ], - "id": 7 + "rootId": 16, + "id": 22 } ], - "id": 3 + "rootId": 16, + "id": 18 } ], - "id": 1 + "id": 16 }, "initialOffset": { "left": 0, diff --git a/packages/browser-integration-tests/suites/replay/sessionInactive/test.ts-snapshots/snapshot-1-webkit.json b/packages/browser-integration-tests/suites/replay/sessionInactive/test.ts-snapshots/snapshot-1-webkit.json index d510b410a343..13e5b1b70103 100644 --- a/packages/browser-integration-tests/suites/replay/sessionInactive/test.ts-snapshots/snapshot-1-webkit.json +++ b/packages/browser-integration-tests/suites/replay/sessionInactive/test.ts-snapshots/snapshot-1-webkit.json @@ -9,7 +9,8 @@ "name": "html", "publicId": "", "systemId": "", - "id": 2 + "rootId": 16, + "id": 17 }, { "type": 2, @@ -28,15 +29,18 @@ "charset": "utf-8" }, "childNodes": [], - "id": 5 + "rootId": 16, + "id": 20 } ], - "id": 4 + "rootId": 16, + "id": 19 }, { "type": 3, "textContent": "\n ", - "id": 6 + "rootId": 16, + "id": 21 }, { "type": 2, @@ -46,7 +50,8 @@ { "type": 3, "textContent": "\n ", - "id": 8 + "rootId": 16, + "id": 23 }, { "type": 2, @@ -59,15 +64,18 @@ { "type": 3, "textContent": "***** **", - "id": 10 + "rootId": 16, + "id": 25 } ], - "id": 9 + "rootId": 16, + "id": 24 }, { "type": 3, "textContent": "\n ", - "id": 11 + "rootId": 16, + "id": 26 }, { "type": 2, @@ -80,29 +88,35 @@ { "type": 3, "textContent": "***** **", - "id": 13 + "rootId": 16, + "id": 28 } ], - "id": 12 + "rootId": 16, + "id": 27 }, { "type": 3, "textContent": "\n ", - "id": 14 + "rootId": 16, + "id": 29 }, { "type": 3, "textContent": "\n\n", - "id": 15 + "rootId": 16, + "id": 30 } ], - "id": 7 + "rootId": 16, + "id": 22 } ], - "id": 3 + "rootId": 16, + "id": 18 } ], - "id": 1 + "id": 16 }, "initialOffset": { "left": 0, From cf9c732b473a07e7df7b7dc05bc9e24ebde618ff Mon Sep 17 00:00:00 2001 From: Billy Vong Date: Tue, 25 Jul 2023 11:07:01 -0400 Subject: [PATCH 5/7] temp remove maskInputSelectors (use maskTextSelector) --- packages/replay/src/util/getPrivacyOptions.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/replay/src/util/getPrivacyOptions.ts b/packages/replay/src/util/getPrivacyOptions.ts index a2aec1dcdb9d..a3d20874f783 100644 --- a/packages/replay/src/util/getPrivacyOptions.ts +++ b/packages/replay/src/util/getPrivacyOptions.ts @@ -5,8 +5,8 @@ type GetPrivacyOptions = Required Date: Wed, 26 Jul 2023 08:03:17 -0400 Subject: [PATCH 6/7] accidentally a letter --- packages/replay/src/types/replay.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/replay/src/types/replay.ts b/packages/replay/src/types/replay.ts index 448ea688d470..e153db31a8b7 100644 --- a/packages/replay/src/types/replay.ts +++ b/packages/replay/src/types/replay.ts @@ -288,7 +288,7 @@ export interface DeprecatedPrivacyOptions { */ maskTextClass?: RecordingOptions['maskTextClass']; /** - * @derecated Use `mask` which accepts an array of CSS selectors + * @deprecated Use `mask` which accepts an array of CSS selectors */ maskTextSelector?: RecordingOptions['maskTextSelector']; } From 2f26b274993bec600aa1ee42ff5c156c1de96383 Mon Sep 17 00:00:00 2001 From: Billy Vong Date: Fri, 28 Jul 2023 17:28:19 -0400 Subject: [PATCH 7/7] feat can unmask attributes, masks input type=button/submit (only with maskAllText enabled) --- .../test.ts-snapshots/privacy.json | 49 ++++++++++++------- .../suites/replay/privacyInput/test.ts | 5 ++ .../suites/replay/privacyInputMaskAll/test.ts | 2 +- packages/replay/src/constants.ts | 3 ++ packages/replay/src/integration.ts | 46 +++++++++++------ 5 files changed, 72 insertions(+), 33 deletions(-) diff --git a/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy.json b/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy.json index 964209872b06..69f74ba00da8 100644 --- a/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy.json +++ b/packages/browser-integration-tests/suites/replay/privacyDefault/test.ts-snapshots/privacy.json @@ -131,6 +131,21 @@ "textContent": "\n ", "id": 20 }, + { + "type": 2, + "tagName": "input", + "attributes": { + "data-sentry-unmask": "", + "placeholder": "Placeholder can be unmasked" + }, + "childNodes": [], + "id": 21 + }, + { + "type": 3, + "textContent": "\n ", + "id": 22 + }, { "type": 2, "tagName": "div", @@ -141,15 +156,15 @@ { "type": 3, "textContent": "***** ****** ** ******", - "id": 22 + "id": 24 } ], - "id": 21 + "id": 23 }, { "type": 3, "textContent": "\n ", - "id": 23 + "id": 25 }, { "type": 2, @@ -160,12 +175,12 @@ }, "childNodes": [], "isSVG": true, - "id": 24 + "id": 26 }, { "type": 3, "textContent": "\n ", - "id": 25 + "id": 27 }, { "type": 2, @@ -184,7 +199,7 @@ }, "childNodes": [], "isSVG": true, - "id": 27 + "id": 29 }, { "type": 2, @@ -192,7 +207,7 @@ "attributes": {}, "childNodes": [], "isSVG": true, - "id": 28 + "id": 30 }, { "type": 2, @@ -200,16 +215,16 @@ "attributes": {}, "childNodes": [], "isSVG": true, - "id": 29 + "id": 31 } ], "isSVG": true, - "id": 26 + "id": 28 }, { "type": 3, "textContent": "\n ", - "id": 30 + "id": 32 }, { "type": 2, @@ -219,12 +234,12 @@ "rr_height": "[100-150]px" }, "childNodes": [], - "id": 31 + "id": 33 }, { "type": 3, "textContent": "\n ", - "id": 32 + "id": 34 }, { "type": 2, @@ -235,12 +250,12 @@ "src": "file:///none.png" }, "childNodes": [], - "id": 33 + "id": 35 }, { "type": 3, "textContent": "\n ", - "id": 34 + "id": 36 }, { "type": 2, @@ -250,17 +265,17 @@ "rr_height": "[0-50]px" }, "childNodes": [], - "id": 35 + "id": 37 }, { "type": 3, "textContent": "\n ", - "id": 36 + "id": 38 }, { "type": 3, "textContent": "\n\n", - "id": 37 + "id": 39 } ], "id": 8 diff --git a/packages/browser-integration-tests/suites/replay/privacyInput/test.ts b/packages/browser-integration-tests/suites/replay/privacyInput/test.ts index 3b76e5622225..8a7208688262 100644 --- a/packages/browser-integration-tests/suites/replay/privacyInput/test.ts +++ b/packages/browser-integration-tests/suites/replay/privacyInput/test.ts @@ -4,13 +4,18 @@ import { IncrementalSource } from '@sentry-internal/rrweb'; import { sentryTest } from '../../../utils/fixtures'; import type { IncrementalRecordingSnapshot } from '../../../utils/replayHelpers'; +<<<<<<< HEAD import { getFullRecordingSnapshots, +======= +import { getFullRecordingSnapshots , +>>>>>>> d495cdedf (feat can unmask attributes, masks input type=button/submit (only with maskAllText enabled)) getIncrementalRecordingSnapshots, shouldSkipReplayTest, waitForReplayRequest, } from '../../../utils/replayHelpers'; + function isInputMutation( snap: IncrementalRecordingSnapshot, ): snap is IncrementalRecordingSnapshot & { data: inputData } { diff --git a/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts b/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts index e98839f7fa37..e305211cfd6a 100644 --- a/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts +++ b/packages/browser-integration-tests/suites/replay/privacyInputMaskAll/test.ts @@ -3,7 +3,7 @@ import type { inputData } from '@sentry-internal/rrweb'; import { IncrementalSource } from '@sentry-internal/rrweb'; import { sentryTest } from '../../../utils/fixtures'; -import type { IncrementalRecordingSnapshot } from '../../../utils/replayHelpers'; +import { getFullRecordingSnapshots, IncrementalRecordingSnapshot } from '../../../utils/replayHelpers'; import { getFullRecordingSnapshots, getIncrementalRecordingSnapshots, diff --git a/packages/replay/src/constants.ts b/packages/replay/src/constants.ts index d8d5e792a619..982c4c165ae8 100644 --- a/packages/replay/src/constants.ts +++ b/packages/replay/src/constants.ts @@ -50,3 +50,6 @@ export const REPLAY_MAX_EVENT_BUFFER_SIZE = 20_000_000; // ~20MB export const MIN_REPLAY_DURATION = 4_999; /* The max. allowed value that the minReplayDuration can be set to. */ export const MIN_REPLAY_DURATION_LIMIT = 15_000; + +/** Default attributes to be ignored when `maskAllText` is enabled */ +export const DEFAULT_IGNORED_ATTRIBUTES = ['title', 'placeholder']; diff --git a/packages/replay/src/integration.ts b/packages/replay/src/integration.ts index ed70c3fb597b..5e2b6aaf559b 100644 --- a/packages/replay/src/integration.ts +++ b/packages/replay/src/integration.ts @@ -101,33 +101,49 @@ export class Replay implements Integration { // eslint-disable-next-line deprecation/deprecation ignoreClass, }: ReplayConfiguration = {}) { + const privacyOptions = getPrivacyOptions({ + mask, + unmask, + block, + unblock, + ignore, + blockClass, + blockSelector, + maskTextClass, + maskTextSelector, + ignoreClass, + }); + this._recordingOptions = { maskAllInputs, maskAllText, maskInputOptions: { ...(maskInputOptions || {}), password: true }, maskTextFn: maskFn, maskInputFn: maskFn, - maskAttributeFn: (key: string, value: string): string => { - // For now, always mask these attributes - if (maskAttributes.includes(key)) { + maskAttributeFn: (key: string, value: string, el: HTMLElement): string => { + // We only mask attributes if `maskAllText` is true + if (!maskAllText) { + return value; + } + + // unmaskTextSelector takes precendence + if (privacyOptions.unmaskTextSelector && el.matches(privacyOptions.unmaskTextSelector)) { + return value; + } + + if ( + maskAttributes.includes(key) || + // Need to mask `value` attribute for `` if it's a button-like + // type + (key === 'value' && el.tagName === 'INPUT' && ['submit', 'button'].includes(el.getAttribute('type') || '')) + ) { return value.replace(/[\S]/g, '*'); } return value; }, - ...getPrivacyOptions({ - mask, - unmask, - block, - unblock, - ignore, - blockClass, - blockSelector, - maskTextClass, - maskTextSelector, - ignoreClass, - }), + ...privacyOptions, // Our defaults slimDOMOptions: 'all',