1
+ import type { Page , Request } from '@playwright/test' ;
1
2
import { expect } from '@playwright/test' ;
2
3
import { SDK_VERSION } from '@sentry/browser' ;
3
- import type { Event } from '@sentry/types' ;
4
4
5
5
import { sentryTest } from '../../../utils/fixtures' ;
6
- import { getFirstSentryEnvelopeRequest } from '../../../utils/helpers' ;
6
+ import { envelopeRequestParser } from '../../../utils/helpers' ;
7
7
8
8
sentryTest ( 'captureReplay' , async ( { getLocalTestPath, page } ) => {
9
9
// Replay bundles are es6 only
10
10
if ( process . env . PW_BUNDLE && process . env . PW_BUNDLE . startsWith ( 'bundle_es5' ) ) {
11
11
sentryTest . skip ( ) ;
12
12
}
13
13
14
+ const reqPromise0 = waitForReplayRequest ( page , 0 ) ;
15
+ const reqPromise1 = waitForReplayRequest ( page , 1 ) ;
16
+ const reqPromise2 = waitForReplayRequest ( page , 2 ) ;
17
+
14
18
await page . route ( 'https://dsn.ingest.sentry.io/**/*' , route => {
15
19
return route . fulfill ( {
16
20
status : 200 ,
@@ -21,38 +25,65 @@ sentryTest('captureReplay', async ({ getLocalTestPath, page }) => {
21
25
22
26
const url = await getLocalTestPath ( { testDir : __dirname } ) ;
23
27
24
- const reqPromise = page . waitForRequest ( req => {
25
- const postData = req . postData ( ) ;
26
- if ( ! postData ) {
27
- return false ;
28
- }
29
- return postData . includes ( '{"type":"replay_event"}' ) ;
30
- } ) ;
31
-
32
28
await page . goto ( url ) ;
33
- await reqPromise ;
29
+ const req0 = await reqPromise0 ;
30
+ const replayEvent0 = envelopeRequestParser ( req0 ) ;
34
31
35
- const reqPromise2 = page . waitForRequest ( req => {
36
- const postData = req . postData ( ) ;
37
- if ( ! postData ) {
38
- return false ;
39
- }
40
- return postData . includes ( '{"type":"replay_event"}' ) ;
41
- } ) ;
32
+ await page . click ( 'button' ) ;
33
+ await reqPromise1 ;
42
34
43
35
await page . click ( 'button' ) ;
44
- await reqPromise2 ;
36
+ const req2 = await reqPromise2 ;
45
37
46
- const replayEvent = await getFirstSentryEnvelopeRequest < Event > ( page , url ) ;
38
+ const replayEvent2 = envelopeRequestParser ( req2 ) ;
47
39
48
- expect ( replayEvent ) . toBeDefined ( ) ;
49
- expect ( replayEvent ) . toEqual ( {
40
+ expect ( replayEvent0 ) . toBeDefined ( ) ;
41
+ expect ( replayEvent0 ) . toEqual ( {
50
42
type : 'replay_event' ,
51
43
timestamp : expect . any ( Number ) ,
52
44
error_ids : [ ] ,
53
45
trace_ids : [ ] ,
54
46
urls : [ expect . stringContaining ( '/dist/index.html' ) ] ,
55
47
replay_id : expect . stringMatching ( / \w { 32 } / ) ,
48
+ replay_start_timestamp : expect . any ( Number ) ,
49
+ segment_id : 0 ,
50
+ replay_type : 'session' ,
51
+ event_id : expect . stringMatching ( / \w { 32 } / ) ,
52
+ environment : 'production' ,
53
+ sdk : {
54
+ integrations : [
55
+ 'InboundFilters' ,
56
+ 'FunctionToString' ,
57
+ 'TryCatch' ,
58
+ 'Breadcrumbs' ,
59
+ 'GlobalHandlers' ,
60
+ 'LinkedErrors' ,
61
+ 'Dedupe' ,
62
+ 'HttpContext' ,
63
+ 'Replay' ,
64
+ ] ,
65
+ version : SDK_VERSION ,
66
+ name : 'sentry.javascript.browser' ,
67
+ } ,
68
+ sdkProcessingMetadata : { } ,
69
+ request : {
70
+ url : expect . stringContaining ( '/dist/index.html' ) ,
71
+ headers : {
72
+ 'User-Agent' : expect . stringContaining ( '' ) ,
73
+ } ,
74
+ } ,
75
+ platform : 'javascript' ,
76
+ tags : { sessionSampleRate : 1 , errorSampleRate : 0 } ,
77
+ } ) ;
78
+
79
+ expect ( replayEvent2 ) . toBeDefined ( ) ;
80
+ expect ( replayEvent2 ) . toEqual ( {
81
+ type : 'replay_event' ,
82
+ timestamp : expect . any ( Number ) ,
83
+ error_ids : [ ] ,
84
+ trace_ids : [ ] ,
85
+ urls : [ ] ,
86
+ replay_id : expect . stringMatching ( / \w { 32 } / ) ,
56
87
segment_id : 2 ,
57
88
replay_type : 'session' ,
58
89
event_id : expect . stringMatching ( / \w { 32 } / ) ,
@@ -83,3 +114,23 @@ sentryTest('captureReplay', async ({ getLocalTestPath, page }) => {
83
114
tags : { sessionSampleRate : 1 , errorSampleRate : 0 } ,
84
115
} ) ;
85
116
} ) ;
117
+
118
+ function waitForReplayRequest ( page : Page , segmentId ?: number ) : Promise < Request > {
119
+ return page . waitForRequest (
120
+ req => {
121
+ const postData = req . postData ( ) ;
122
+ if ( ! postData ) {
123
+ return false ;
124
+ }
125
+ console . log ( postData ) ;
126
+
127
+ const isReplayRequest = postData . includes ( '{"type":"replay_event"}' ) ;
128
+
129
+ if ( isReplayRequest && segmentId !== undefined ) {
130
+ return postData . includes ( `{"segment_id":${ segmentId } }` ) ;
131
+ }
132
+ return isReplayRequest ;
133
+ } ,
134
+ { timeout : 30_000 } ,
135
+ ) ;
136
+ }
0 commit comments