From 52209b4c3aa81027e42263791aab8f4071c89f56 Mon Sep 17 00:00:00 2001 From: KevinL10 Date: Tue, 6 Aug 2024 11:45:29 -0400 Subject: [PATCH 1/6] feat(tracing): make long animation frames opt-out --- packages/browser/src/tracing/browserTracingIntegration.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/browser/src/tracing/browserTracingIntegration.ts b/packages/browser/src/tracing/browserTracingIntegration.ts index d8f6796b5b1b..27158dafd22e 100644 --- a/packages/browser/src/tracing/browserTracingIntegration.ts +++ b/packages/browser/src/tracing/browserTracingIntegration.ts @@ -168,7 +168,7 @@ const DEFAULT_BROWSER_TRACING_OPTIONS: BrowserTracingOptions = { instrumentPageLoad: true, markBackgroundSpan: true, enableLongTask: true, - enableLongAnimationFrame: false, + enableLongAnimationFrame: true, enableInp: true, _experiments: {}, ...defaultRequestInstrumentationOptions, From 1e4dfdde8fd132d645e42473d197ce9c925a03df Mon Sep 17 00:00:00 2001 From: KevinL10 Date: Wed, 7 Aug 2024 10:20:04 -0400 Subject: [PATCH 2/6] guard undefined PerformanceObserver --- packages/browser/src/tracing/browserTracingIntegration.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/browser/src/tracing/browserTracingIntegration.ts b/packages/browser/src/tracing/browserTracingIntegration.ts index 27158dafd22e..adfdcd0293e4 100644 --- a/packages/browser/src/tracing/browserTracingIntegration.ts +++ b/packages/browser/src/tracing/browserTracingIntegration.ts @@ -213,7 +213,11 @@ export const browserTracingIntegration = ((_options: Partial Date: Wed, 7 Aug 2024 12:00:33 -0400 Subject: [PATCH 3/6] fix check --- packages/browser/src/tracing/browserTracingIntegration.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/browser/src/tracing/browserTracingIntegration.ts b/packages/browser/src/tracing/browserTracingIntegration.ts index adfdcd0293e4..63c6ce5d8374 100644 --- a/packages/browser/src/tracing/browserTracingIntegration.ts +++ b/packages/browser/src/tracing/browserTracingIntegration.ts @@ -215,7 +215,7 @@ export const browserTracingIntegration = ((_options: Partial Date: Wed, 7 Aug 2024 12:04:13 -0400 Subject: [PATCH 4/6] fix long-task tests --- .../browserTracingIntegration/long-tasks-enabled/init.js | 1 + packages/ember/tests/helpers/utils.ts | 8 ++++++-- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/long-tasks-enabled/init.js b/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/long-tasks-enabled/init.js index ad1d8832b228..319dfaadd4a8 100644 --- a/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/long-tasks-enabled/init.js +++ b/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/long-tasks-enabled/init.js @@ -7,6 +7,7 @@ Sentry.init({ integrations: [ Sentry.browserTracingIntegration({ idleTimeout: 9000, + enableLongAnimationFrame: false, }), ], tracesSampleRate: 1, diff --git a/packages/ember/tests/helpers/utils.ts b/packages/ember/tests/helpers/utils.ts index fb2736a43e13..eaeeae0114b6 100644 --- a/packages/ember/tests/helpers/utils.ts +++ b/packages/ember/tests/helpers/utils.ts @@ -64,11 +64,15 @@ export function assertSentryTransactions( // instead of checking the specific order of runloop spans (which is brittle), // we check (below) that _any_ runloop spans are added - // Also we ignore ui.long-task spans, as they are brittle and may or may not appear + // Also we ignore ui.long-task spans and ui.long-animation-frame, as they are brittle and may or may not appear const filteredSpans = spans .filter(span => { const op = span.op; - return !op?.startsWith('ui.ember.runloop.') && !op?.startsWith('ui.long-task'); + return ( + !op?.startsWith('ui.ember.runloop.') && + !op?.startsWith('ui.long-task') && + !op?.startsWith('ui.long-animation-frame') + ); }) .map(spanJson => { return `${spanJson.op} | ${spanJson.description}`; From b4fb4ae9f8e351ea46a798b945ecd08da5c7eb7f Mon Sep 17 00:00:00 2001 From: KevinL10 Date: Wed, 7 Aug 2024 13:20:42 -0400 Subject: [PATCH 5/6] fix tests --- .../interactions/test.ts | 17 ++++++++++------- .../long-tasks-disabled/init.js | 4 +++- .../src/tracing/browserTracingIntegration.ts | 3 ++- packages/utils/src/worldwide.ts | 1 + 4 files changed, 16 insertions(+), 9 deletions(-) diff --git a/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/interactions/test.ts b/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/interactions/test.ts index bb219eda38c7..e382faaa08d8 100644 --- a/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/interactions/test.ts +++ b/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/interactions/test.ts @@ -33,9 +33,11 @@ sentryTest('should capture interaction transaction. @firefox', async ({ browserN expect(eventData.contexts).toMatchObject({ trace: { op: 'ui.action.click' } }); expect(eventData.platform).toBe('javascript'); expect(eventData.type).toBe('transaction'); - expect(eventData.spans).toHaveLength(1); - const interactionSpan = eventData.spans![0]; + const spans = eventData.spans?.filter(span => !span.op?.startsWith('ui.long-animation-frame')); + expect(spans).toHaveLength(1); + + const interactionSpan = spans![0]; expect(interactionSpan.op).toBe('ui.interaction.click'); expect(interactionSpan.description).toBe('body > button.clicked'); expect(interactionSpan.timestamp).toBeDefined(); @@ -89,10 +91,10 @@ sentryTest( const envelopes = await envelopePromise; expect(envelopes).toHaveLength(1); const eventData = envelopes[0]; + const spans = eventData.spans?.filter(span => !span.op?.startsWith('ui.long-animation-frame')); + expect(spans).toHaveLength(1); - expect(eventData.spans).toHaveLength(1); - - const interactionSpan = eventData.spans![0]; + const interactionSpan = spans![0]; expect(interactionSpan.op).toBe('ui.interaction.click'); expect(interactionSpan.description).toBe('body > AnnotatedButton'); }, @@ -120,9 +122,10 @@ sentryTest( expect(envelopes).toHaveLength(1); const eventData = envelopes[0]; - expect(eventData.spans).toHaveLength(1); + const spans = eventData.spans?.filter(span => !span.op?.startsWith('ui.long-animation-frame')); + expect(spans).toHaveLength(1); - const interactionSpan = eventData.spans![0]; + const interactionSpan = spans![0]; expect(interactionSpan.op).toBe('ui.interaction.click'); expect(interactionSpan.description).toBe('body > StyledButton'); }, diff --git a/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/long-tasks-disabled/init.js b/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/long-tasks-disabled/init.js index bde12a1304ed..e1b3f6b13b01 100644 --- a/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/long-tasks-disabled/init.js +++ b/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/long-tasks-disabled/init.js @@ -4,6 +4,8 @@ window.Sentry = Sentry; Sentry.init({ dsn: 'https://public@dsn.ingest.sentry.io/1337', - integrations: [Sentry.browserTracingIntegration({ enableLongTask: false, idleTimeout: 9000 })], + integrations: [ + Sentry.browserTracingIntegration({ enableLongTask: false, enableLongAnimationFrame: false, idleTimeout: 9000 }), + ], tracesSampleRate: 1, }); diff --git a/packages/browser/src/tracing/browserTracingIntegration.ts b/packages/browser/src/tracing/browserTracingIntegration.ts index 63c6ce5d8374..491c7aaae88d 100644 --- a/packages/browser/src/tracing/browserTracingIntegration.ts +++ b/packages/browser/src/tracing/browserTracingIntegration.ts @@ -28,6 +28,7 @@ import { import type { Client, IntegrationFn, StartSpanOptions, TransactionSource } from '@sentry/types'; import type { Span } from '@sentry/types'; import { + GLOBAL_OBJ, browserPerformanceTimeOrigin, generatePropagationContext, getDomElement, @@ -215,7 +216,7 @@ export const browserTracingIntegration = ((_options: Partial Date: Wed, 7 Aug 2024 15:44:09 -0400 Subject: [PATCH 6/6] filter loaf in playwright tests --- .../tracing/browserTracingIntegration/interactions/test.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/interactions/test.ts b/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/interactions/test.ts index e382faaa08d8..4ebea3457af6 100644 --- a/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/interactions/test.ts +++ b/dev-packages/browser-integration-tests/suites/tracing/browserTracingIntegration/interactions/test.ts @@ -65,7 +65,8 @@ sentryTest( await page.waitForTimeout(1000); await page.locator('[data-test-id=interaction-button]').click(); const envelope = await envelopePromise; - expect(envelope[0].spans).toHaveLength(1); + const spans = envelope[0].spans?.filter(span => !span.op?.startsWith('ui.long-animation-frame')); + expect(spans).toHaveLength(1); } }, );