9
9
spanToJSON ,
10
10
} from '@sentry/core' ;
11
11
import type { Span } from '@sentry/core' ;
12
- import type { ResourceEntry } from '../../src/metrics/browserMetrics' ;
13
12
import { _addMeasureSpans , _addResourceSpans } from '../../src/metrics/browserMetrics' ;
14
13
import { WINDOW } from '../../src/types' ;
15
14
import { TestClient , getDefaultClientOptions } from '../utils/TestClient' ;
@@ -31,6 +30,17 @@ const originalLocation = WINDOW.location;
31
30
32
31
const resourceEntryName = 'https://example.com/assets/to/css' ;
33
32
33
+ interface AdditionalPerformanceResourceTiming {
34
+ renderBlockingStatus ?: 'non-blocking' | 'blocking' | '' ;
35
+ deliveryType ?: 'cache' | 'navigational-prefetch' | '' ;
36
+ }
37
+
38
+ function mockPerformanceResourceTiming (
39
+ data : Partial < PerformanceResourceTiming > & AdditionalPerformanceResourceTiming ,
40
+ ) : PerformanceResourceTiming & AdditionalPerformanceResourceTiming {
41
+ return data as PerformanceResourceTiming & AdditionalPerformanceResourceTiming ;
42
+ }
43
+
34
44
describe ( '_addMeasureSpans' , ( ) => {
35
45
const span = new SentrySpan ( { op : 'pageload' , name : '/' , sampled : true } ) ;
36
46
@@ -54,13 +64,12 @@ describe('_addMeasureSpans', () => {
54
64
spans . push ( span ) ;
55
65
} ) ;
56
66
57
- const entry : Omit < PerformanceMeasure , 'toJSON' > = {
67
+ const entry = {
58
68
entryType : 'measure' ,
59
69
name : 'measure-1' ,
60
70
duration : 10 ,
61
71
startTime : 12 ,
62
- detail : undefined ,
63
- } ;
72
+ } as PerformanceEntry ;
64
73
65
74
const timeOrigin = 100 ;
66
75
const startTime = 23 ;
@@ -116,13 +125,13 @@ describe('_addResourceSpans', () => {
116
125
spans . push ( span ) ;
117
126
} ) ;
118
127
119
- const entry : ResourceEntry = {
128
+ const entry = mockPerformanceResourceTiming ( {
120
129
initiatorType : 'xmlhttprequest' ,
121
130
transferSize : 256 ,
122
131
encodedBodySize : 256 ,
123
132
decodedBodySize : 256 ,
124
133
renderBlockingStatus : 'non-blocking' ,
125
- } ;
134
+ } ) ;
126
135
_addResourceSpans ( span , entry , resourceEntryName , 123 , 456 , 100 ) ;
127
136
128
137
expect ( spans ) . toHaveLength ( 0 ) ;
@@ -135,13 +144,13 @@ describe('_addResourceSpans', () => {
135
144
spans . push ( span ) ;
136
145
} ) ;
137
146
138
- const entry : ResourceEntry = {
147
+ const entry = mockPerformanceResourceTiming ( {
139
148
initiatorType : 'fetch' ,
140
149
transferSize : 256 ,
141
150
encodedBodySize : 256 ,
142
151
decodedBodySize : 256 ,
143
152
renderBlockingStatus : 'non-blocking' ,
144
- } ;
153
+ } ) ;
145
154
_addResourceSpans ( span , entry , 'https://example.com/assets/to/me' , 123 , 456 , 100 ) ;
146
155
147
156
expect ( spans ) . toHaveLength ( 0 ) ;
@@ -154,13 +163,13 @@ describe('_addResourceSpans', () => {
154
163
spans . push ( span ) ;
155
164
} ) ;
156
165
157
- const entry : ResourceEntry = {
166
+ const entry = mockPerformanceResourceTiming ( {
158
167
initiatorType : 'css' ,
159
168
transferSize : 256 ,
160
169
encodedBodySize : 456 ,
161
170
decodedBodySize : 593 ,
162
171
renderBlockingStatus : 'non-blocking' ,
163
- } ;
172
+ } ) ;
164
173
165
174
const timeOrigin = 100 ;
166
175
const startTime = 23 ;
@@ -222,9 +231,9 @@ describe('_addResourceSpans', () => {
222
231
] ;
223
232
for ( let i = 0 ; i < table . length ; i ++ ) {
224
233
const { initiatorType, op } = table [ i ] ! ;
225
- const entry : ResourceEntry = {
234
+ const entry = mockPerformanceResourceTiming ( {
226
235
initiatorType,
227
- } ;
236
+ } ) ;
228
237
_addResourceSpans ( span , entry , 'https://example.com/assets/to/me' , 123 , 234 , 465 ) ;
229
238
230
239
expect ( spans ) . toHaveLength ( i + 1 ) ;
@@ -239,13 +248,13 @@ describe('_addResourceSpans', () => {
239
248
spans . push ( span ) ;
240
249
} ) ;
241
250
242
- const entry : ResourceEntry = {
251
+ const entry = mockPerformanceResourceTiming ( {
243
252
initiatorType : 'css' ,
244
253
transferSize : 0 ,
245
254
encodedBodySize : 0 ,
246
255
decodedBodySize : 0 ,
247
256
renderBlockingStatus : 'non-blocking' ,
248
- } ;
257
+ } ) ;
249
258
250
259
_addResourceSpans ( span , entry , resourceEntryName , 100 , 23 , 345 ) ;
251
260
@@ -274,12 +283,12 @@ describe('_addResourceSpans', () => {
274
283
spans . push ( span ) ;
275
284
} ) ;
276
285
277
- const entry : ResourceEntry = {
286
+ const entry = mockPerformanceResourceTiming ( {
278
287
initiatorType : 'css' ,
279
288
transferSize : 2147483647 ,
280
289
encodedBodySize : 2147483647 ,
281
290
decodedBodySize : 2147483647 ,
282
- } ;
291
+ } ) ;
283
292
284
293
_addResourceSpans ( span , entry , resourceEntryName , 100 , 23 , 345 ) ;
285
294
@@ -316,7 +325,7 @@ describe('_addResourceSpans', () => {
316
325
transferSize : null ,
317
326
encodedBodySize : null ,
318
327
decodedBodySize : null ,
319
- } as unknown as ResourceEntry ;
328
+ } as unknown as PerformanceResourceTiming ;
320
329
321
330
_addResourceSpans ( span , entry , resourceEntryName , 100 , 23 , 345 ) ;
322
331
@@ -341,7 +350,7 @@ describe('_addResourceSpans', () => {
341
350
342
351
// resource delivery types: https://developer.mozilla.org/en-US/docs/Web/API/PerformanceResourceTiming/deliveryType
343
352
// i.e. better but not yet widely supported way to check for browser cache hit
344
- it . each ( [ 'cache' , 'navigational-prefetch' , '' ] ) (
353
+ it . each ( [ 'cache' , 'navigational-prefetch' , '' ] as const ) (
345
354
'attaches delivery type ("%s") to resource spans if available' ,
346
355
deliveryType => {
347
356
const spans : Span [ ] = [ ] ;
@@ -350,13 +359,13 @@ describe('_addResourceSpans', () => {
350
359
spans . push ( span ) ;
351
360
} ) ;
352
361
353
- const entry : ResourceEntry = {
362
+ const entry = mockPerformanceResourceTiming ( {
354
363
initiatorType : 'css' ,
355
364
transferSize : 0 ,
356
365
encodedBodySize : 0 ,
357
366
decodedBodySize : 0 ,
358
367
deliveryType,
359
- } ;
368
+ } ) ;
360
369
361
370
_addResourceSpans ( span , entry , resourceEntryName , 100 , 23 , 345 ) ;
362
371
0 commit comments