Skip to content

Commit 0329858

Browse files
chargomechargome
committed
tests
1 parent cd56c6d commit 0329858

8 files changed

Lines changed: 189 additions & 0 deletions

File tree

‎dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/spotlight-interaction-filter-streamed/init.js‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import * as Sentry from '@sentry/browser';
2+
3+
window.Sentry = Sentry;
4+
5+
Sentry.init({
6+
dsn: 'https://[email protected]/1337',
7+
integrations: [
8+
Sentry.browserTracingIntegration({
9+
enableLongTask: false,
10+
_experiments: {
11+
enableInteractions: true,
12+
},
13+
}),
14+
Sentry.spanStreamingIntegration(),
15+
Sentry.spotlightBrowserIntegration(),
16+
],
17+
tracesSampleRate: 1,
18+
});

‎dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/spotlight-interaction-filter-streamed/subject.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
// Block the main thread for 70ms so the PerformanceObserver registers
2+
// a click event entry, which triggers `ui.interaction.click` child spans.
3+
const simulateSlowClick = e => {
4+
const startTime = Date.now();
5+
while (Date.now() - startTime < 70) {
6+
//
7+
}
8+
e.target.classList.add('clicked');
9+
};
10+
11+
document.querySelector('[data-test-id=spotlight-button]').addEventListener('click', simulateSlowClick);
12+
document.querySelector('[data-test-id=regular-button]').addEventListener('click', simulateSlowClick);

‎dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/spotlight-interaction-filter-streamed/template.html‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
</head>
6+
<body>
7+
<div id="sentry-spotlight">
8+
<button data-test-id="spotlight-button">Spotlight Button</button>
9+
</div>
10+
<button data-test-id="regular-button">Regular Button</button>
11+
</body>
12+
</html>

‎dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/spotlight-interaction-filter-streamed/test.ts‎

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import { expect } from '@playwright/test';
2+
import { sentryTest } from '../../../../utils/fixtures';
3+
import { shouldSkipTracingTest } from '../../../../utils/helpers';
4+
import { getSpanOp, observeStreamedSpan, waitForStreamedSpan, waitForStreamedSpans } from '../../../../utils/spanUtils';
5+
6+
sentryTest(
7+
'filters ui.interaction.click spans for spotlight elements via ignoreSpans in streaming mode',
8+
async ({ getLocalTestUrl, page }) => {
9+
if (shouldSkipTracingTest()) {
10+
sentryTest.skip();
11+
}
12+
13+
const url = await getLocalTestUrl({ testDir: __dirname });
14+
15+
// Set up an observer that fails if a spotlight interaction span is ever sent
16+
let sawSpotlightInteractionSpan = false;
17+
await observeStreamedSpan(page, span => {
18+
if (getSpanOp(span) === 'ui.interaction.click' && span.name?.includes('#sentry-spotlight')) {
19+
sawSpotlightInteractionSpan = true;
20+
return true;
21+
}
22+
return false;
23+
});
24+
25+
await page.goto(url);
26+
27+
// Wait for pageload to finish before clicking
28+
await waitForStreamedSpan(page, span => getSpanOp(span) === 'pageload');
29+
30+
// Click on the spotlight element — its ui.interaction.click child should be filtered
31+
await page.locator('[data-test-id=spotlight-button]').click();
32+
await page.locator('.clicked[data-test-id=spotlight-button]').isVisible();
33+
34+
// Wait for the spotlight click's segment span to arrive
35+
await waitForStreamedSpans(page, spans =>
36+
spans.some(span => span.is_segment && getSpanOp(span) === 'ui.action.click'),
37+
);
38+
39+
// Click on the regular button — its ui.interaction.click child should be kept
40+
const regularInteractionSpansPromise = waitForStreamedSpans(page, spans =>
41+
spans.some(span => getSpanOp(span) === 'ui.interaction.click' && !span.name?.includes('#sentry-spotlight')),
42+
);
43+
44+
await page.locator('[data-test-id=regular-button]').click();
45+
await page.locator('.clicked[data-test-id=regular-button]').isVisible();
46+
47+
const regularSpans = await regularInteractionSpansPromise;
48+
const regularInteractionSpan = regularSpans.find(
49+
span => getSpanOp(span) === 'ui.interaction.click' && !span.name?.includes('#sentry-spotlight'),
50+
);
51+
expect(regularInteractionSpan).toBeDefined();
52+
expect(regularInteractionSpan!.name).toContain('button');
53+
54+
// Verify no spotlight interaction span was ever sent
55+
expect(sawSpotlightInteractionSpan).toBe(false);
56+
},
57+
);

‎dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/spotlight-interaction-filter/init.js‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import * as Sentry from '@sentry/browser';
2+
3+
window.Sentry = Sentry;
4+
5+
Sentry.init({
6+
dsn: 'https://[email protected]/1337',
7+
integrations: [
8+
Sentry.browserTracingIntegration({
9+
enableLongTask: false,
10+
_experiments: {
11+
enableInteractions: true,
12+
},
13+
}),
14+
Sentry.spotlightBrowserIntegration(),
15+
],
16+
tracesSampleRate: 1,
17+
});

‎dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/spotlight-interaction-filter/subject.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
// Block the main thread for 70ms so the PerformanceObserver registers
2+
// a click event entry, which triggers `ui.interaction.click` child spans.
3+
const simulateSlowClick = e => {
4+
const startTime = Date.now();
5+
while (Date.now() - startTime < 70) {
6+
//
7+
}
8+
e.target.classList.add('clicked');
9+
};
10+
11+
document.querySelector('[data-test-id=spotlight-button]').addEventListener('click', simulateSlowClick);
12+
document.querySelector('[data-test-id=regular-button]').addEventListener('click', simulateSlowClick);

‎dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/spotlight-interaction-filter/template.html‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
</head>
6+
<body>
7+
<div id="sentry-spotlight">
8+
<button data-test-id="spotlight-button">Spotlight Button</button>
9+
</div>
10+
<button data-test-id="regular-button">Regular Button</button>
11+
</body>
12+
</html>

‎dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/spotlight-interaction-filter/test.ts‎

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
import { expect } from '@playwright/test';
2+
import type { Event as SentryEvent } from '@sentry/core';
3+
import { sentryTest } from '../../../../utils/fixtures';
4+
import {
5+
getFirstSentryEnvelopeRequest,
6+
getMultipleSentryEnvelopeRequests,
7+
shouldSkipTracingTest,
8+
} from '../../../../utils/helpers';
9+
10+
sentryTest(
11+
'filters ui.interaction.click spans for spotlight elements via ignoreSpans',
12+
async ({ getLocalTestUrl, page }) => {
13+
if (shouldSkipTracingTest()) {
14+
sentryTest.skip();
15+
}
16+
17+
const url = await getLocalTestUrl({ testDir: __dirname });
18+
await page.goto(url);
19+
20+
// Wait for the pageload transaction to complete
21+
await getFirstSentryEnvelopeRequest<SentryEvent>(page);
22+
23+
// Click on the spotlight element — interaction span should be filtered
24+
const spotlightEnvelopePromise = getMultipleSentryEnvelopeRequests<SentryEvent>(page, 1);
25+
await page.locator('[data-test-id=spotlight-button]').click();
26+
await page.locator('.clicked[data-test-id=spotlight-button]').isVisible();
27+
const [spotlightTransaction] = await spotlightEnvelopePromise;
28+
29+
expect(spotlightTransaction.type).toBe('transaction');
30+
expect(spotlightTransaction.contexts?.trace?.op).toBe('ui.action.click');
31+
32+
const spotlightInteractionSpans = spotlightTransaction.spans?.filter(span => span.op === 'ui.interaction.click');
33+
expect(spotlightInteractionSpans).toHaveLength(0);
34+
35+
// Click on the regular button — interaction span should be kept
36+
const regularEnvelopePromise = getMultipleSentryEnvelopeRequests<SentryEvent>(page, 1);
37+
await page.locator('[data-test-id=regular-button]').click();
38+
await page.locator('.clicked[data-test-id=regular-button]').isVisible();
39+
const [regularTransaction] = await regularEnvelopePromise;
40+
41+
expect(regularTransaction.type).toBe('transaction');
42+
expect(regularTransaction.contexts?.trace?.op).toBe('ui.action.click');
43+
44+
const regularInteractionSpans = regularTransaction.spans?.filter(span => span.op === 'ui.interaction.click');
45+
expect(regularInteractionSpans?.length).toBeGreaterThanOrEqual(1);
46+
expect(regularInteractionSpans![0]!.description).toContain('button');
47+
expect(regularInteractionSpans![0]!.description).not.toContain('#sentry-spotlight');
48+
},
49+
);

0 commit comments

Comments
 (0)