-
-
Notifications
You must be signed in to change notification settings - Fork 1.7k
test(replay): Add integration test for privacy #7055
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Merged
Merged
Changes from all commits
Commits
Show all changes
20 commits
Select commit
Hold shift + click to select a range
c988afa
feat(replay): Add integration test for privacy
billyvg 9e20f94
add imgs and remove whitespaces
billyvg 01de9df
undo unnecessary change
billyvg 2eadb32
Update packages/integration-tests/suites/replay/privacy/test.ts
billyvg 755df12
Merge branch 'develop' into feat-replay-add-privacy-test
billyvg f4cbc57
change types
billyvg 39543e5
lint
billyvg 4d6686a
Merge branch 'develop' into feat-replay-add-privacy-test
billyvg ed30d5a
Merge branch 'develop' into feat-replay-add-privacy-test
billyvg aaebc8b
add test for unblock
billyvg 2c2f550
Merge branch 'develop' into feat-replay-add-privacy-test
billyvg 26d37f1
add snapshots, test without img
billyvg 2c3927e
remove snapshot suffix
billyvg 8f1c6ca
remove svg
billyvg e88b81b
remove snapshot suffix, remove more html
billyvg 3ddb7b0
import replay from @sentry/replay
billyvg 6e8399c
undo template changes
billyvg 174531c
empty path
billyvg 57365da
remove snapshots for now
billyvg 57f21df
lint
billyvg File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
import * as Sentry from '@sentry/browser'; | ||
import { Replay } from '@sentry/replay'; | ||
|
||
window.Sentry = Sentry; | ||
window.Replay = new Replay({ | ||
flushMinDelay: 200, | ||
flushMaxDelay: 200, | ||
useCompression: false, | ||
}); | ||
|
||
Sentry.init({ | ||
dsn: 'https://[email protected]/1337', | ||
sampleRate: 0, | ||
replaysSessionSampleRate: 1.0, | ||
replaysOnErrorSampleRate: 0.0, | ||
|
||
integrations: [window.Replay], | ||
}); |
15 changes: 15 additions & 0 deletions
15
packages/integration-tests/suites/replay/privacy/template.html
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head><meta charset="utf-8" /></head> | ||
<body> | ||
<button aria-label="Click me" onclick="console.log('Test log')">Click me</button> | ||
<div>This should be masked by default</div> | ||
<div data-sentry-unmask>This should be unmasked due to data attribute</div> | ||
<input placeholder="Placeholder should be masked" /> | ||
<div title="Title should be masked">Title should be masked</div> | ||
<svg style="width:200px;height:200px" viewBox="0 0 80 80"><path d=""/></svg> | ||
<svg style="width:200px;height:200px" class="sentry-unblock" viewBox="0 0 80 80" data-sentry-unblock><path d=""/></svg> | ||
<img style="width:100px;height:100px" src="file:///none.png" /> | ||
<img data-sentry-unblock style="width:100px;height:100px" src="file:///none.png" /> | ||
</body> | ||
</html> |
268 changes: 268 additions & 0 deletions
268
packages/integration-tests/suites/replay/privacy/test.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,268 @@ | ||
import { expect } from '@playwright/test'; | ||
import { EventType } from '@sentry-internal/rrweb'; | ||
import type { RecordingEvent } from '@sentry/replay/build/npm/types/types'; | ||
|
||
import { sentryTest } from '../../../utils/fixtures'; | ||
import { envelopeRequestParser } from '../../../utils/helpers'; | ||
import { waitForReplayRequest } from '../../../utils/replayHelpers'; | ||
|
||
sentryTest('should have the correct default privacy settings', async ({ getLocalTestPath, page }) => { | ||
// Replay bundles are es6 only | ||
if (process.env.PW_BUNDLE && process.env.PW_BUNDLE.startsWith('bundle_es5')) { | ||
sentryTest.skip(); | ||
} | ||
|
||
const reqPromise0 = waitForReplayRequest(page, 0); | ||
|
||
await page.route('https://dsn.ingest.sentry.io/**/*', route => { | ||
return route.fulfill({ | ||
status: 200, | ||
contentType: 'application/json', | ||
body: JSON.stringify({ id: 'test-id' }), | ||
}); | ||
}); | ||
|
||
const url = await getLocalTestPath({ testDir: __dirname }); | ||
|
||
await page.goto(url); | ||
const replayPayload = envelopeRequestParser<RecordingEvent[]>(await reqPromise0, 5); | ||
const checkoutEvent = replayPayload.find(({ type }) => type === EventType.FullSnapshot); | ||
|
||
expect(checkoutEvent?.data).toEqual({ | ||
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: 2, | ||
tagName: 'meta', | ||
attributes: { | ||
charset: 'utf-8', | ||
}, | ||
childNodes: [], | ||
id: 5, | ||
}, | ||
], | ||
id: 4, | ||
}, | ||
{ | ||
type: 3, | ||
textContent: '\n ', | ||
id: 6, | ||
}, | ||
{ | ||
type: 2, | ||
tagName: 'body', | ||
attributes: {}, | ||
childNodes: [ | ||
{ | ||
type: 3, | ||
textContent: '\n ', | ||
id: 8, | ||
}, | ||
{ | ||
type: 2, | ||
tagName: 'button', | ||
attributes: { | ||
'aria-label': 'Click me', | ||
onclick: "console.log('Test log')", | ||
}, | ||
childNodes: [ | ||
{ | ||
type: 3, | ||
textContent: '***** **', | ||
id: 10, | ||
}, | ||
], | ||
id: 9, | ||
}, | ||
{ | ||
type: 3, | ||
textContent: '\n ', | ||
id: 11, | ||
}, | ||
{ | ||
type: 2, | ||
tagName: 'div', | ||
attributes: {}, | ||
childNodes: [ | ||
{ | ||
type: 3, | ||
textContent: '**** ****** ** ****** ** *******', | ||
id: 13, | ||
}, | ||
], | ||
id: 12, | ||
}, | ||
{ | ||
type: 3, | ||
textContent: '\n ', | ||
id: 14, | ||
}, | ||
{ | ||
type: 2, | ||
tagName: 'div', | ||
attributes: { | ||
'data-sentry-unmask': '', | ||
}, | ||
childNodes: [ | ||
{ | ||
type: 3, | ||
textContent: 'This should be unmasked due to data attribute', | ||
id: 16, | ||
}, | ||
], | ||
id: 15, | ||
}, | ||
{ | ||
type: 3, | ||
textContent: '\n ', | ||
id: 17, | ||
}, | ||
{ | ||
type: 2, | ||
tagName: 'input', | ||
attributes: { | ||
placeholder: 'Placeholder should be masked', | ||
}, | ||
childNodes: [], | ||
id: 18, | ||
}, | ||
{ | ||
type: 3, | ||
textContent: '\n ', | ||
id: 19, | ||
}, | ||
{ | ||
type: 2, | ||
tagName: 'div', | ||
attributes: { | ||
title: 'Title should be masked', | ||
}, | ||
childNodes: [ | ||
{ | ||
type: 3, | ||
textContent: '***** ****** ** ******', | ||
id: 21, | ||
}, | ||
], | ||
id: 20, | ||
}, | ||
{ | ||
type: 3, | ||
textContent: '\n ', | ||
id: 22, | ||
}, | ||
{ | ||
type: 2, | ||
tagName: 'svg', | ||
attributes: { | ||
rr_width: '200px', | ||
rr_height: '200px', | ||
}, | ||
childNodes: [], | ||
isSVG: true, | ||
id: 23, | ||
}, | ||
{ | ||
type: 3, | ||
textContent: '\n ', | ||
id: 24, | ||
}, | ||
{ | ||
type: 2, | ||
tagName: 'svg', | ||
attributes: { | ||
style: 'width:200px;height:200px', | ||
class: 'sentry-unblock', | ||
viewBox: '0 0 80 80', | ||
'data-sentry-unblock': '', | ||
}, | ||
childNodes: [ | ||
{ | ||
type: 2, | ||
tagName: 'path', | ||
attributes: { | ||
rr_width: '0px', | ||
rr_height: '0px', | ||
}, | ||
childNodes: [], | ||
isSVG: true, | ||
id: 26, | ||
}, | ||
], | ||
isSVG: true, | ||
id: 25, | ||
}, | ||
{ | ||
type: 3, | ||
textContent: '\n ', | ||
id: 27, | ||
}, | ||
{ | ||
type: 2, | ||
tagName: 'img', | ||
attributes: { | ||
rr_width: '100px', | ||
rr_height: '100px', | ||
}, | ||
childNodes: [], | ||
id: 28, | ||
}, | ||
{ | ||
type: 3, | ||
textContent: '\n ', | ||
id: 29, | ||
}, | ||
{ | ||
type: 2, | ||
tagName: 'img', | ||
attributes: { | ||
'data-sentry-unblock': '', | ||
style: 'width:100px;height:100px', | ||
src: 'file:///none.png', | ||
}, | ||
childNodes: [], | ||
id: 30, | ||
}, | ||
{ | ||
type: 3, | ||
textContent: '\n ', | ||
id: 31, | ||
}, | ||
{ | ||
type: 3, | ||
textContent: '\n\n', | ||
id: 32, | ||
}, | ||
], | ||
id: 7, | ||
}, | ||
], | ||
id: 3, | ||
}, | ||
], | ||
id: 1, | ||
}, | ||
initialOffset: { | ||
left: 0, | ||
top: 0, | ||
}, | ||
}); | ||
}); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Huh, so these tests were breaking from es6 bundles when I did not use
Replay
from@sentry/replay
(e.g. I was usinSentry.Replay
). Any ideas @Lms24?There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yup, this was how we currently still differ between injecting the addon replay CDN bundle in addition to the CDN bundle (w/o replay) vs. testing the NPM @sentry/browser export.
I'm trying to get #7096 merged today which will get rid of relying on imports here. Going forward, we'll drop testing the addon bundle but instead additionally test against the two bundle variants that include Replay directly.