Skip to content

Commit 2c130d8

Browse files
committed
fix(browser): Ensure tracing without performance (TWP) works
This also forward-ports the tests from #11555, and adds some more tests.
1 parent f6a3e02 commit 2c130d8

File tree

24 files changed

+426
-37
lines changed

24 files changed

+426
-37
lines changed
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import * as Sentry from '@sentry/browser';
2+
3+
window.Sentry = Sentry;
4+
5+
Sentry.init({
6+
dsn: 'https://[email protected]/1337',
7+
tracePropagationTargets: ['http://example.com'],
8+
});
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
fetch('http://example.com/0').then(
2+
fetch('http://example.com/1', { headers: { 'X-Test-Header': 'existing-header' } }).then(
3+
fetch('http://example.com/2'),
4+
),
5+
);
Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import { expect } from '@playwright/test';
2+
3+
import { sentryTest } from '../../../../utils/fixtures';
4+
import { shouldSkipTracingTest } from '../../../../utils/helpers';
5+
6+
sentryTest(
7+
'should not attach `sentry-trace` header to fetch requests without tracing',
8+
async ({ getLocalTestPath, page }) => {
9+
if (shouldSkipTracingTest()) {
10+
sentryTest.skip();
11+
}
12+
13+
const url = await getLocalTestPath({ testDir: __dirname });
14+
15+
const requests = (
16+
await Promise.all([
17+
page.goto(url),
18+
Promise.all([0, 1, 2].map(idx => page.waitForRequest(`http://example.com/${idx}`))),
19+
])
20+
)[1];
21+
22+
expect(requests).toHaveLength(3);
23+
24+
for (const request of requests) {
25+
const requestHeaders = request.headers();
26+
expect(requestHeaders['sentry-trace']).toBeUndefined();
27+
expect(requestHeaders['baggage']).toBeUndefined();
28+
}
29+
},
30+
);
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import * as Sentry from '@sentry/browser';
2+
3+
window.Sentry = Sentry;
4+
5+
Sentry.init({
6+
dsn: 'https://[email protected]/1337',
7+
integrations: [Sentry.browserTracingIntegration()],
8+
tracePropagationTargets: ['http://example.com'],
9+
tracesSampleRate: 0,
10+
});
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
fetch('http://example.com/0').then(
2+
fetch('http://example.com/1', { headers: { 'X-Test-Header': 'existing-header' } }).then(
3+
fetch('http://example.com/2'),
4+
),
5+
);
Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import { expect } from '@playwright/test';
2+
3+
import { sentryTest } from '../../../../utils/fixtures';
4+
import { shouldSkipTracingTest } from '../../../../utils/helpers';
5+
6+
sentryTest('should attach `sentry-trace` header to unsampled fetch requests', async ({ getLocalTestPath, page }) => {
7+
if (shouldSkipTracingTest()) {
8+
sentryTest.skip();
9+
}
10+
11+
const url = await getLocalTestPath({ testDir: __dirname });
12+
13+
const requests = (
14+
await Promise.all([
15+
page.goto(url),
16+
Promise.all([0, 1, 2].map(idx => page.waitForRequest(`http://example.com/${idx}`))),
17+
])
18+
)[1];
19+
20+
expect(requests).toHaveLength(3);
21+
22+
const request1 = requests[0];
23+
const requestHeaders1 = request1.headers();
24+
expect(requestHeaders1).toMatchObject({
25+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})-0$/),
26+
baggage: expect.any(String),
27+
});
28+
29+
const request2 = requests[1];
30+
const requestHeaders2 = request2.headers();
31+
expect(requestHeaders2).toMatchObject({
32+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})-0$/),
33+
baggage: expect.any(String),
34+
'x-test-header': 'existing-header',
35+
});
36+
37+
const request3 = requests[2];
38+
const requestHeaders3 = request3.headers();
39+
expect(requestHeaders3).toMatchObject({
40+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})-0$/),
41+
baggage: expect.any(String),
42+
});
43+
});
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import * as Sentry from '@sentry/browser';
2+
3+
window.Sentry = Sentry;
4+
5+
Sentry.init({
6+
dsn: 'https://[email protected]/1337',
7+
integrations: [Sentry.browserTracingIntegration()],
8+
tracePropagationTargets: ['http://example.com'],
9+
// no tracesSampleRate defined means TWP mode
10+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
fetch('http://example.com/0').then(
2+
fetch('http://example.com/1', { headers: { 'X-Test-Header': 'existing-header' } }).then(
3+
fetch('http://example.com/2'),
4+
),
5+
);
Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
import { expect } from '@playwright/test';
2+
3+
import { sentryTest } from '../../../../utils/fixtures';
4+
import { shouldSkipTracingTest } from '../../../../utils/helpers';
5+
6+
sentryTest(
7+
'should attach `sentry-trace` header to tracing without performance (TWP) fetch requests',
8+
async ({ getLocalTestPath, page }) => {
9+
if (shouldSkipTracingTest()) {
10+
sentryTest.skip();
11+
}
12+
13+
const url = await getLocalTestPath({ testDir: __dirname });
14+
15+
const requests = (
16+
await Promise.all([
17+
page.goto(url),
18+
Promise.all([0, 1, 2].map(idx => page.waitForRequest(`http://example.com/${idx}`))),
19+
])
20+
)[1];
21+
22+
expect(requests).toHaveLength(3);
23+
24+
const request1 = requests[0];
25+
const requestHeaders1 = request1.headers();
26+
expect(requestHeaders1).toMatchObject({
27+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})$/),
28+
baggage: expect.any(String),
29+
});
30+
31+
const request2 = requests[1];
32+
const requestHeaders2 = request2.headers();
33+
expect(requestHeaders2).toMatchObject({
34+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})$/),
35+
baggage: expect.any(String),
36+
'x-test-header': 'existing-header',
37+
});
38+
39+
const request3 = requests[2];
40+
const requestHeaders3 = request3.headers();
41+
expect(requestHeaders3).toMatchObject({
42+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})$/),
43+
baggage: expect.any(String),
44+
});
45+
},
46+
);
Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,5 @@
1-
fetch('http://example.com/0').then(fetch('http://example.com/1').then(fetch('http://example.com/2')));
1+
fetch('http://example.com/0').then(
2+
fetch('http://example.com/1', { headers: { 'X-Test-Header': 'existing-header' } }).then(
3+
fetch('http://example.com/2'),
4+
),
5+
);

dev-packages/browser-integration-tests/suites/tracing/request/fetch/test.ts

Lines changed: 23 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import type { Event } from '@sentry/types';
44
import { sentryTest } from '../../../../utils/fixtures';
55
import { getMultipleSentryEnvelopeRequests, shouldSkipTracingTest } from '../../../../utils/helpers';
66

7-
sentryTest('should create spans for multiple fetch requests', async ({ getLocalTestPath, page }) => {
7+
sentryTest('should create spans for fetch requests', async ({ getLocalTestPath, page }) => {
88
if (shouldSkipTracingTest()) {
99
sentryTest.skip();
1010
}
@@ -40,7 +40,7 @@ sentryTest('should create spans for multiple fetch requests', async ({ getLocalT
4040
);
4141
});
4242

43-
sentryTest('should attach `sentry-trace` header to multiple fetch requests', async ({ getLocalTestPath, page }) => {
43+
sentryTest('should attach `sentry-trace` header to fetch requests', async ({ getLocalTestPath, page }) => {
4444
if (shouldSkipTracingTest()) {
4545
sentryTest.skip();
4646
}
@@ -56,10 +56,25 @@ sentryTest('should attach `sentry-trace` header to multiple fetch requests', asy
5656

5757
expect(requests).toHaveLength(3);
5858

59-
for (const request of requests) {
60-
const requestHeaders = request.headers();
61-
expect(requestHeaders).toMatchObject({
62-
'sentry-trace': expect.any(String),
63-
});
64-
}
59+
const request1 = requests[0];
60+
const requestHeaders1 = request1.headers();
61+
expect(requestHeaders1).toMatchObject({
62+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})-1$/),
63+
baggage: expect.any(String),
64+
});
65+
66+
const request2 = requests[1];
67+
const requestHeaders2 = request2.headers();
68+
expect(requestHeaders2).toMatchObject({
69+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})-1$/),
70+
baggage: expect.any(String),
71+
'x-test-header': 'existing-header',
72+
});
73+
74+
const request3 = requests[2];
75+
const requestHeaders3 = request3.headers();
76+
expect(requestHeaders3).toMatchObject({
77+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})-1$/),
78+
baggage: expect.any(String),
79+
});
6580
});
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import * as Sentry from '@sentry/browser';
2+
3+
window.Sentry = Sentry;
4+
5+
Sentry.init({
6+
dsn: 'https://[email protected]/1337',
7+
tracePropagationTargets: ['http://example.com'],
8+
});
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
const xhr_1 = new XMLHttpRequest();
2+
xhr_1.open('GET', 'http://example.com/0');
3+
xhr_1.send();
4+
5+
const xhr_2 = new XMLHttpRequest();
6+
xhr_2.open('GET', 'http://example.com/1');
7+
xhr_2.setRequestHeader('X-Test-Header', 'existing-header');
8+
xhr_2.send();
9+
10+
const xhr_3 = new XMLHttpRequest();
11+
xhr_3.open('GET', 'http://example.com/2');
12+
xhr_3.send();
Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import { expect } from '@playwright/test';
2+
3+
import { sentryTest } from '../../../../utils/fixtures';
4+
import { shouldSkipTracingTest } from '../../../../utils/helpers';
5+
6+
sentryTest(
7+
'should not attach `sentry-trace` header to fetch requests without tracing',
8+
async ({ getLocalTestPath, page }) => {
9+
if (shouldSkipTracingTest()) {
10+
sentryTest.skip();
11+
}
12+
13+
const url = await getLocalTestPath({ testDir: __dirname });
14+
15+
const requests = (
16+
await Promise.all([
17+
page.goto(url),
18+
Promise.all([0, 1, 2].map(idx => page.waitForRequest(`http://example.com/${idx}`))),
19+
])
20+
)[1];
21+
22+
expect(requests).toHaveLength(3);
23+
24+
for (const request of requests) {
25+
const requestHeaders = request.headers();
26+
expect(requestHeaders['sentry-trace']).toBeUndefined();
27+
expect(requestHeaders['baggage']).toBeUndefined();
28+
}
29+
},
30+
);
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import * as Sentry from '@sentry/browser';
2+
3+
window.Sentry = Sentry;
4+
5+
Sentry.init({
6+
dsn: 'https://[email protected]/1337',
7+
integrations: [Sentry.browserTracingIntegration()],
8+
tracePropagationTargets: ['http://example.com'],
9+
tracesSampleRate: 0,
10+
});
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
const xhr_1 = new XMLHttpRequest();
2+
xhr_1.open('GET', 'http://example.com/0');
3+
xhr_1.send();
4+
5+
const xhr_2 = new XMLHttpRequest();
6+
xhr_2.open('GET', 'http://example.com/1');
7+
xhr_2.setRequestHeader('X-Test-Header', 'existing-header');
8+
xhr_2.send();
9+
10+
const xhr_3 = new XMLHttpRequest();
11+
xhr_3.open('GET', 'http://example.com/2');
12+
xhr_3.send();
Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import { expect } from '@playwright/test';
2+
3+
import { sentryTest } from '../../../../utils/fixtures';
4+
import { shouldSkipTracingTest } from '../../../../utils/helpers';
5+
6+
sentryTest('should attach `sentry-trace` header to unsampled xhr requests', async ({ getLocalTestPath, page }) => {
7+
if (shouldSkipTracingTest()) {
8+
sentryTest.skip();
9+
}
10+
11+
const url = await getLocalTestPath({ testDir: __dirname });
12+
13+
const requests = (
14+
await Promise.all([
15+
page.goto(url),
16+
Promise.all([0, 1, 2].map(idx => page.waitForRequest(`http://example.com/${idx}`))),
17+
])
18+
)[1];
19+
20+
expect(requests).toHaveLength(3);
21+
22+
const request1 = requests[0];
23+
const requestHeaders1 = request1.headers();
24+
expect(requestHeaders1).toMatchObject({
25+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})-0$/),
26+
baggage: expect.any(String),
27+
});
28+
29+
const request2 = requests[1];
30+
const requestHeaders2 = request2.headers();
31+
expect(requestHeaders2).toMatchObject({
32+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})-0$/),
33+
baggage: expect.any(String),
34+
'x-test-header': 'existing-header',
35+
});
36+
37+
const request3 = requests[2];
38+
const requestHeaders3 = request3.headers();
39+
expect(requestHeaders3).toMatchObject({
40+
'sentry-trace': expect.stringMatching(/^([a-f0-9]{32})-([a-f0-9]{16})-0$/),
41+
baggage: expect.any(String),
42+
});
43+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import * as Sentry from '@sentry/browser';
2+
3+
window.Sentry = Sentry;
4+
5+
Sentry.init({
6+
dsn: 'https://[email protected]/1337',
7+
integrations: [Sentry.browserTracingIntegration()],
8+
tracePropagationTargets: ['http://example.com'],
9+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
const xhr_1 = new XMLHttpRequest();
2+
xhr_1.open('GET', 'http://example.com/0');
3+
xhr_1.send();
4+
5+
const xhr_2 = new XMLHttpRequest();
6+
xhr_2.open('GET', 'http://example.com/1');
7+
xhr_2.setRequestHeader('X-Test-Header', 'existing-header');
8+
xhr_2.send();
9+
10+
const xhr_3 = new XMLHttpRequest();
11+
xhr_3.open('GET', 'http://example.com/2');
12+
xhr_3.send();

0 commit comments

Comments
 (0)