Skip to content

Commit 8ef54e9

Browse files
billyvgbillyvg
committed
test(replay): Add integration tests for input masking on change
This adds integration tests for input masking specifically when `maskAllInputs = false`.
1 parent eedd811 commit 8ef54e9

File tree

15 files changed

+2468
-14
lines changed

15 files changed

+2468
-14
lines changed

‎packages/integration-tests/suites/replay/privacyInput/init.js

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import * as Sentry from '@sentry/browser';
2+
import { Replay } from '@sentry/replay';
3+
4+
window.Sentry = Sentry;
5+
window.Replay = new Replay({
6+
flushMinDelay: 200,
7+
flushMaxDelay: 200,
8+
useCompression: false,
9+
maskAllInputs: false,
10+
});
11+
12+
Sentry.init({
13+
dsn: 'https://[email protected]/1337',
14+
sampleRate: 0,
15+
replaysSessionSampleRate: 1.0,
16+
replaysOnErrorSampleRate: 0.0,
17+
18+
integrations: [window.Replay],
19+
});

‎packages/integration-tests/suites/replay/privacyInput/template.html

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
</head>
6+
<body>
7+
<input id="input" />
8+
<input id="input-masked" data-sentry-mask />
9+
<input id="input-ignore" data-sentry-ignore />
10+
11+
<textarea id="textarea"></textarea>
12+
<textarea id="textarea-masked" data-sentry-mask></textarea>
13+
<textarea id="textarea-ignore" data-sentry-ignore></textarea>
14+
</body>
15+
</html>

‎packages/integration-tests/suites/replay/privacyInput/test.ts

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
import { expect } from '@playwright/test';
2+
import { IncrementalSource } from '@sentry-internal/rrweb';
3+
import type { incrementalData, inputData} from '@sentry-internal/rrweb/typings/types';
4+
5+
import { sentryTest } from '../../../utils/fixtures';
6+
import {
7+
getIncrementalRecordingSnapshots,
8+
shouldSkipReplayTest,
9+
waitForReplayRequest,
10+
} from '../../../utils/replayHelpers';
11+
12+
function isInputMutation(snap: incrementalData): snap is inputData {
13+
return snap.source == IncrementalSource.Input;
14+
}
15+
16+
sentryTest('should mask input initial value and its changes', async ({ getLocalTestPath, page }) => {
17+
if (shouldSkipReplayTest()) {
18+
sentryTest.skip();
19+
}
20+
21+
const reqPromise0 = waitForReplayRequest(page, 0);
22+
const reqPromise1 = waitForReplayRequest(page, 1);
23+
const reqPromise2 = waitForReplayRequest(page, 2);
24+
const reqPromise3 = waitForReplayRequest(page, 3);
25+
26+
await page.route('https://dsn.ingest.sentry.io/**/*', route => {
27+
return route.fulfill({
28+
status: 200,
29+
contentType: 'application/json',
30+
body: JSON.stringify({ id: 'test-id' }),
31+
});
32+
});
33+
34+
const url = await getLocalTestPath({ testDir: __dirname });
35+
36+
await page.goto(url);
37+
38+
await reqPromise0;
39+
40+
const text = 'this is test text';
41+
42+
await page.locator('#input').type(text)
43+
const snapshots = getIncrementalRecordingSnapshots(await reqPromise1).filter(isInputMutation);
44+
const lastSnapshot = snapshots[snapshots.length-1];
45+
expect(lastSnapshot.text).toBe(text);
46+
47+
await page.locator('#input-masked').type(text)
48+
const snapshots2 = getIncrementalRecordingSnapshots(await reqPromise2).filter(isInputMutation);
49+
const lastSnapshot2 = snapshots2[snapshots2.length-1];
50+
expect(lastSnapshot2.text).toBe('*'.repeat(text.length));
51+
52+
await page.locator('#input-ignore').type(text)
53+
const snapshots3 = getIncrementalRecordingSnapshots(await reqPromise3).filter(isInputMutation);
54+
expect(snapshots3.length).toBe(0);
55+
});
56+
57+
sentryTest('should mask textarea initial value and its changes', async ({ getLocalTestPath, page }) => {
58+
if (shouldSkipReplayTest()) {
59+
sentryTest.skip();
60+
}
61+
62+
const reqPromise0 = waitForReplayRequest(page, 0);
63+
const reqPromise1 = waitForReplayRequest(page, 1);
64+
const reqPromise2 = waitForReplayRequest(page, 2);
65+
const reqPromise3 = waitForReplayRequest(page, 3);
66+
67+
await page.route('https://dsn.ingest.sentry.io/**/*', route => {
68+
return route.fulfill({
69+
status: 200,
70+
contentType: 'application/json',
71+
body: JSON.stringify({ id: 'test-id' }),
72+
});
73+
});
74+
75+
const url = await getLocalTestPath({ testDir: __dirname });
76+
77+
await page.goto(url);
78+
79+
await reqPromise0;
80+
81+
const text = 'this is test text';
82+
await page.locator('#textarea').type(text)
83+
const snapshots = getIncrementalRecordingSnapshots(await reqPromise1).filter(isInputMutation);
84+
const lastSnapshot = snapshots[snapshots.length-1];
85+
expect(lastSnapshot.text).toBe(text);
86+
87+
await page.locator('#textarea-masked').type(text)
88+
const snapshots2 = getIncrementalRecordingSnapshots(await reqPromise2).filter(isInputMutation);
89+
const lastSnapshot2 = snapshots2[snapshots2.length-1];
90+
expect(lastSnapshot2.text).toBe('*'.repeat(text.length));
91+
92+
await page.locator('#textarea-ignore').type(text)
93+
const snapshots3 = getIncrementalRecordingSnapshots(await reqPromise3).filter(isInputMutation);
94+
expect(snapshots3.length).toBe(0);
95+
});

0 commit comments

Comments
 (0)