Visitar URL original
feat(browser): Extract fetch request instrumentation into `fetchTraci… · getsentry/sentry-javascript@9df3ae2 · GitHub
Skip to content

Commit 9df3ae2

Browse files
logaretmlogaretm
committed
feat(browser): Extract fetch request instrumentation into fetchTracingIntegration
`browserTracingIntegration` registers it by default, so nothing changes for its users. `browserTracingCoreIntegration` users only bundle it when they add it.
1 parent 4fef45f commit 9df3ae2

4 files changed

Lines changed: 61 additions & 20 deletions

File tree

‎packages/browser/src/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,7 @@ export type { CachedRouteProvider, RouteProvider } from '@sentry/browser-utils';
5353
export { interactionsIntegration } from './integrations/interactions';
5454
export { linkedTracesIntegration } from './integrations/linkedTraces';
5555
export { longTasksIntegration } from './integrations/longTasks';
56+
export { fetchTracingIntegration } from './integrations/fetchTracing';
5657
export { xhrTracingIntegration } from './integrations/xhrTracing';
5758

5859
export type { RequestInstrumentationOptions } from './tracing/request';

‎packages/browser/src/integrations/fetchTracing.ts‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import type { IntegrationFn } from '@sentry/core';
2+
import { defineIntegration } from '@sentry/core';
3+
import type { RequestInstrumentationOptions } from '../tracing/request';
4+
import { instrumentFetchRequests } from '../tracing/request';
5+
6+
const INTEGRATION_NAME = 'FetchTracing';
7+
8+
type FetchTracingOptions = Partial<
9+
Pick<
10+
RequestInstrumentationOptions,
11+
'shouldCreateSpanForRequest' | 'enableHTTPTimings' | 'onRequestSpanStart' | 'onRequestSpanEnd'
12+
>
13+
>;
14+
15+
const _fetchTracingIntegration = ((options: FetchTracingOptions = {}) => {
16+
return {
17+
name: INTEGRATION_NAME,
18+
setup(client) {
19+
instrumentFetchRequests(client, {
20+
...options,
21+
tracePropagationTargets: client.getOptions().tracePropagationTargets,
22+
});
23+
},
24+
};
25+
}) satisfies IntegrationFn;
26+
27+
/**
28+
* Creates spans for outgoing fetch requests and attaches trace propagation headers to them.
29+
*/
30+
export const fetchTracingIntegration = defineIntegration(_fetchTracingIntegration);

‎packages/browser/src/tracing/browserTracingIntegration.ts‎

Lines changed: 14 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -48,8 +48,8 @@ import type { WebVitalsOptions } from '../integrations/webVitals';
4848
import { webVitalsIntegration } from '../integrations/webVitals';
4949
import { registerBackgroundTabDetection } from './backgroundtab';
5050
import { linkedTracesIntegration } from '../integrations/linkedTraces';
51+
import { fetchTracingIntegration } from '../integrations/fetchTracing';
5152
import { xhrTracingIntegration } from '../integrations/xhrTracing';
52-
import { defaultRequestInstrumentationOptions, instrumentFetchRequests } from './request';
5353
import {
5454
SENTRY_SEGMENT_NAME_SOURCE,
5555
SENTRY_OP,
@@ -292,7 +292,12 @@ export type BrowserTracingCoreOptions = Omit<
292292
| 'enableElementTiming'
293293
| 'enableLongTask'
294294
| 'enableLongAnimationFrame'
295+
| 'traceFetch'
295296
| 'traceXHR'
297+
| 'shouldCreateSpanForRequest'
298+
| 'enableHTTPTimings'
299+
| 'onRequestSpanStart'
300+
| 'onRequestSpanEnd'
296301
| 'linkPreviousTrace'
297302
| 'consistentTraceSampling'
298303
>;
@@ -306,7 +311,6 @@ const DEFAULT_BROWSER_TRACING_OPTIONS: BrowserTracingCoreOptions = {
306311
ignoreResourceSpans: [],
307312
detectRedirects: true,
308313
enableReportPageLoaded: false,
309-
...defaultRequestInstrumentationOptions,
310314
};
311315

312316
/**
@@ -334,6 +338,7 @@ export const browserTracingIntegration = ((options: Partial<BrowserTracingOption
334338
webVitals,
335339
enableLongTask = true,
336340
enableLongAnimationFrame = true,
341+
traceFetch = true,
337342
traceXHR = true,
338343
shouldCreateSpanForRequest,
339344
enableHTTPTimings,
@@ -361,10 +366,14 @@ export const browserTracingIntegration = ((options: Partial<BrowserTracingOption
361366
client.addIntegration(longTasksIntegration({ enableLongTask, enableLongAnimationFrame }));
362367
}
363368

369+
const requestOptions = { shouldCreateSpanForRequest, enableHTTPTimings, onRequestSpanStart, onRequestSpanEnd };
370+
371+
if (traceFetch) {
372+
client.addIntegration(fetchTracingIntegration(requestOptions));
373+
}
374+
364375
if (traceXHR) {
365-
client.addIntegration(
366-
xhrTracingIntegration({ shouldCreateSpanForRequest, enableHTTPTimings, onRequestSpanStart, onRequestSpanEnd }),
367-
);
376+
client.addIntegration(xhrTracingIntegration(requestOptions));
368377
}
369378

370379
if (linkPreviousTrace !== 'off') {
@@ -399,17 +408,12 @@ function _browserTracingIntegration(
399408
finalTimeout,
400409
childSpanTimeout,
401410
markBackgroundSpan,
402-
traceFetch,
403-
shouldCreateSpanForRequest,
404-
enableHTTPTimings,
405411
ignoreResourceSpans,
406412
instrumentPageLoad,
407413
instrumentNavigation,
408414
instrumentBfcacheRestore,
409415
detectRedirects,
410416
enableReportPageLoaded,
411-
onRequestSpanStart,
412-
onRequestSpanEnd,
413417
} = {
414418
...DEFAULT_BROWSER_TRACING_OPTIONS,
415419
...options,
@@ -781,16 +785,6 @@ function _browserTracingIntegration(
781785
if (markBackgroundSpan) {
782786
registerBackgroundTabDetection();
783787
}
784-
785-
if (traceFetch) {
786-
instrumentFetchRequests(client, {
787-
tracePropagationTargets: client.getOptions().tracePropagationTargets,
788-
shouldCreateSpanForRequest,
789-
enableHTTPTimings,
790-
onRequestSpanStart,
791-
onRequestSpanEnd,
792-
});
793-
}
794788
},
795789
} satisfies Integration;
796790
}

‎packages/browser/test/tracing/browserTracingIntegration.test.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -246,6 +246,22 @@ describe('browserTracingIntegration', () => {
246246
expect(!!client.getIntegrationByName('LongTasks')).toBe(registered);
247247
});
248248

249+
it.each([
250+
['registers fetchTracingIntegration by default', {}, true],
251+
['does not register fetchTracingIntegration when traceFetch is off', { traceFetch: false }, false],
252+
])('%s', (_name, options, registered) => {
253+
const client = new BrowserClient(
254+
getDefaultBrowserClientOptions({
255+
tracesSampleRate: 1,
256+
integrations: [browserTracingIntegration(options)],
257+
}),
258+
);
259+
setCurrentClient(client);
260+
client.init();
261+
262+
expect(!!client.getIntegrationByName('FetchTracing')).toBe(registered);
263+
});
264+
249265
it.each([
250266
['registers xhrTracingIntegration by default', {}, true],
251267
['does not register xhrTracingIntegration when traceXHR is off', { traceXHR: false }, false],

0 commit comments

Comments
 (0)