Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -168,10 +168,14 @@ test('captures correct spans for navigation', async ({ page }) => {
});

const transitionSpans = spans.filter(span => span.op === 'ui.ember.transition');
const beforeModelSpans = spans.filter(span => span.op === 'ui.ember.route.before_model');
const modelSpans = spans.filter(span => span.op === 'ui.ember.route.model');
const afterModelSpans = spans.filter(span => span.op === 'ui.ember.route.after_model');
const renderSpans = spans.filter(span => span.op === 'ui.ember.runloop.render');
const beforeModelSpans = spans.filter(
span => span.op === 'function' && span.data?.['code.function.name'] === 'beforeModel',
);
const modelSpans = spans.filter(span => span.op === 'function' && span.data?.['code.function.name'] === 'model');
const afterModelSpans = spans.filter(
span => span.op === 'function' && span.data?.['code.function.name'] === 'afterModel',
);
const renderSpans = spans.filter(span => span.op === 'ui.task' && span.data?.['ember.runloop.queue'] === 'render');

expect(transitionSpans).toHaveLength(1);

Expand Down Expand Up @@ -202,12 +206,13 @@ test('captures correct spans for navigation', async ({ page }) => {
expect(beforeModelSpans).toEqual([
{
data: {
'sentry.op': 'ui.ember.route.before_model',
'code.function.name': 'beforeModel',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route',
op: 'ui.ember.route.before_model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -218,12 +223,13 @@ test('captures correct spans for navigation', async ({ page }) => {
},
{
data: {
'sentry.op': 'ui.ember.route.before_model',
'code.function.name': 'beforeModel',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route.index',
op: 'ui.ember.route.before_model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -237,12 +243,13 @@ test('captures correct spans for navigation', async ({ page }) => {
expect(modelSpans).toEqual([
{
data: {
'sentry.op': 'ui.ember.route.model',
'code.function.name': 'model',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route',
op: 'ui.ember.route.model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -253,12 +260,13 @@ test('captures correct spans for navigation', async ({ page }) => {
},
{
data: {
'sentry.op': 'ui.ember.route.model',
'code.function.name': 'model',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route.index',
op: 'ui.ember.route.model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -272,12 +280,13 @@ test('captures correct spans for navigation', async ({ page }) => {
expect(afterModelSpans).toEqual([
{
data: {
'sentry.op': 'ui.ember.route.after_model',
'code.function.name': 'afterModel',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route',
op: 'ui.ember.route.after_model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -288,12 +297,13 @@ test('captures correct spans for navigation', async ({ page }) => {
},
{
data: {
'sentry.op': 'ui.ember.route.after_model',
'code.function.name': 'afterModel',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route.index',
op: 'ui.ember.route.after_model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -306,11 +316,12 @@ test('captures correct spans for navigation', async ({ page }) => {

expect(renderSpans).toContainEqual({
data: {
'sentry.op': 'ui.ember.runloop.render',
'ember.runloop.queue': 'render',
'sentry.op': 'ui.task',
'sentry.origin': 'auto.ui.ember',
},
description: 'runloop',
op: 'ui.ember.runloop.render',
op: 'ui.task',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -168,10 +168,14 @@ test('captures correct spans for navigation', async ({ page }) => {
});

const transitionSpans = spans.filter(span => span.op === 'ui.ember.transition');
const beforeModelSpans = spans.filter(span => span.op === 'ui.ember.route.before_model');
const modelSpans = spans.filter(span => span.op === 'ui.ember.route.model');
const afterModelSpans = spans.filter(span => span.op === 'ui.ember.route.after_model');
const renderSpans = spans.filter(span => span.op === 'ui.ember.runloop.render');
const beforeModelSpans = spans.filter(
span => span.op === 'function' && span.data?.['code.function.name'] === 'beforeModel',
);
const modelSpans = spans.filter(span => span.op === 'function' && span.data?.['code.function.name'] === 'model');
const afterModelSpans = spans.filter(
span => span.op === 'function' && span.data?.['code.function.name'] === 'afterModel',
);
const renderSpans = spans.filter(span => span.op === 'ui.task' && span.data?.['ember.runloop.queue'] === 'render');

expect(transitionSpans).toHaveLength(1);

Expand Down Expand Up @@ -202,12 +206,13 @@ test('captures correct spans for navigation', async ({ page }) => {
expect(beforeModelSpans).toEqual([
{
data: {
'sentry.op': 'ui.ember.route.before_model',
'code.function.name': 'beforeModel',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route',
op: 'ui.ember.route.before_model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -218,12 +223,13 @@ test('captures correct spans for navigation', async ({ page }) => {
},
{
data: {
'sentry.op': 'ui.ember.route.before_model',
'code.function.name': 'beforeModel',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route.index',
op: 'ui.ember.route.before_model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -237,12 +243,13 @@ test('captures correct spans for navigation', async ({ page }) => {
expect(modelSpans).toEqual([
{
data: {
'sentry.op': 'ui.ember.route.model',
'code.function.name': 'model',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route',
op: 'ui.ember.route.model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -253,12 +260,13 @@ test('captures correct spans for navigation', async ({ page }) => {
},
{
data: {
'sentry.op': 'ui.ember.route.model',
'code.function.name': 'model',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route.index',
op: 'ui.ember.route.model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -272,12 +280,13 @@ test('captures correct spans for navigation', async ({ page }) => {
expect(afterModelSpans).toEqual([
{
data: {
'sentry.op': 'ui.ember.route.after_model',
'code.function.name': 'afterModel',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route',
op: 'ui.ember.route.after_model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -288,12 +297,13 @@ test('captures correct spans for navigation', async ({ page }) => {
},
{
data: {
'sentry.op': 'ui.ember.route.after_model',
'code.function.name': 'afterModel',
'sentry.op': 'function',
'sentry.origin': 'auto.ui.ember',
'sentry.source': 'custom',
},
description: 'slow-loading-route.index',
op: 'ui.ember.route.after_model',
op: 'function',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand All @@ -306,11 +316,12 @@ test('captures correct spans for navigation', async ({ page }) => {

expect(renderSpans).toContainEqual({
data: {
'sentry.op': 'ui.ember.runloop.render',
'ember.runloop.queue': 'render',
'sentry.op': 'ui.task',
'sentry.origin': 'auto.ui.ember',
},
description: 'runloop',
op: 'ui.ember.runloop.render',
op: 'ui.task',
origin: 'auto.ui.ember',
status: 'ok',
parent_span_id: spanId,
Expand Down
27 changes: 9 additions & 18 deletions packages/ember/addon/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@
import { assert } from '@ember/debug';
import type Route from '@ember/routing/route';
import { getOwnConfig } from '@embroider/macros';
import { CODE_FUNCTION_NAME, SENTRY_OP } from '@sentry/conventions/attributes';
import { GENERAL_FUNCTION_SPAN_OP } from '@sentry/conventions/op';
import type { BrowserOptions } from '@sentry/browser';
import { startSpan } from '@sentry/browser';
import * as Sentry from '@sentry/browser';
Expand Down Expand Up @@ -54,7 +56,7 @@ type RouteConstructor = new (...args: ConstructorParameters<typeof Route>) => Ro
export const instrumentRoutePerformance = <T extends RouteConstructor>(BaseRoute: T): T => {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const instrumentFunction = async <X extends (...args: unknown[]) => any>(
op: string,
hookName: string,
name: string,
fn: X,
args: Parameters<X>,
Expand All @@ -65,8 +67,9 @@ export const instrumentRoutePerformance = <T extends RouteConstructor>(BaseRoute
attributes: {
[SEMANTIC_ATTRIBUTE_SENTRY_SOURCE]: source,
[SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.ui.ember',
[SENTRY_OP]: GENERAL_FUNCTION_SPAN_OP,
[CODE_FUNCTION_NAME]: hookName,
},
op,
name,
onlyIfParent: true,
},
Expand All @@ -82,32 +85,20 @@ export const instrumentRoutePerformance = <T extends RouteConstructor>(BaseRoute
// @ts-expect-error TS2545 We do not need to redefine a constructor here
[routeName]: class extends BaseRoute {
public beforeModel(...args: unknown[]): void | Promise<unknown> {
return instrumentFunction(
'ui.ember.route.before_model',
this.fullRouteName,
super.beforeModel.bind(this),
args,
'custom',
);
return instrumentFunction('beforeModel', this.fullRouteName, super.beforeModel.bind(this), args, 'custom');
}

public async model(...args: unknown[]): Promise<unknown> {
return instrumentFunction('ui.ember.route.model', this.fullRouteName, super.model.bind(this), args, 'custom');
return instrumentFunction('model', this.fullRouteName, super.model.bind(this), args, 'custom');
}

public afterModel(...args: unknown[]): void | Promise<unknown> {
return instrumentFunction(
'ui.ember.route.after_model',
this.fullRouteName,
super.afterModel.bind(this),
args,
'custom',
);
return instrumentFunction('afterModel', this.fullRouteName, super.afterModel.bind(this), args, 'custom');
}

public setupController(...args: unknown[]): void | Promise<unknown> {
return instrumentFunction(
'ui.ember.route.setup_controller',
'setupController',
this.fullRouteName,
super.setupController.bind(this),
args,
Expand Down
19 changes: 13 additions & 6 deletions packages/ember/addon/utils/instrumentEmberGlobals.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
import { subscribe } from '@ember/instrumentation';
import { scheduleOnce } from '@ember/runloop';
import type { EmberRunQueues } from '@ember/runloop/-private/types';
import { SENTRY_OP, UI_COMPONENT_NAME } from '@sentry/conventions/attributes';
import { BROWSER_UI_RENDER_SPAN_OP, BROWSER_UI_TASK_SPAN_OP, GENERAL_FUNCTION_SPAN_OP } from '@sentry/conventions/op';
import { getActiveSpan, SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN, startInactiveSpan } from '@sentry/browser';
import type { Span } from '@sentry/core';
import { browserPerformanceTimeOrigin, timestampInSeconds } from '@sentry/core';
Expand Down Expand Up @@ -89,10 +91,11 @@ function _instrumentEmberRunloop(config: { minimumRunloopQueueDuration?: number
if ((now - currentQueueStart) * 1000 >= minQueueDuration) {
startInactiveSpan({
attributes: {
[SENTRY_OP]: BROWSER_UI_TASK_SPAN_OP,
[SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.ui.ember',
'ember.runloop.queue': queue,

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

m: does ember.runloop.queue also need to be added to @sentry/conventions?

@msonnb msonnb Jul 29, 2026

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure whether we want to add library-specific attributes to conventions (I don't think so). If yes we'll probably wanna add it to #18895.
cc @Lms24

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

does ember.runloop.queue also need to be added to @sentry/conventions

yes, all attributes sent from our SDKs should be in conventions

I'm not sure whether we want to add library-specific attributes to conventions

we should always use a more generic attribute if possible that isn't tied to a specific lib or framework. I'm not sure if there's a specific replacement for ember.runloop.queue. If there's none, we can add an ember-specific attribute. There's precedence for framework-specific attributes, for example, Remix.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i'm not really familiar with ember but from a quick search i couldn't find any fitting generic attribute and from this guide it looks like the run queue is a pretty specific/unique concept, so yes we should probably add this ember-specific attribute to conventions then.

},
name: 'runloop',
op: `ui.ember.runloop.${queue}`,
startTime: currentQueueStart,
onlyIfParent: true,
})?.end(now);
Expand Down Expand Up @@ -147,13 +150,16 @@ function processComponentRenderAfter(
const now = timestampInSeconds();
const componentRenderDuration = now - begin.now;

const name = payload.containerKey || payload.object;

if (componentRenderDuration * 1000 >= minComponentDuration) {
startInactiveSpan({
name: payload.containerKey || payload.object,
op,
name,
startTime: begin.now,
attributes: {
[SENTRY_OP]: op,
[SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.ui.ember',
[UI_COMPONENT_NAME]: name,

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

New attribute lacks test coverage

Low Severity

Newly added ui.component_name on Ember component spans is never asserted. Acceptance checks only match op | description, so a regression that drops the attribute would still pass. Per the testing conventions rule, newly added payload data needs thorough assertions.

Additional Locations (1)
Fix in Cursor Fix in Web

Triggered by project rule: PR Review Guidelines for Cursor Bot

Reviewed by Cursor Bugbot for commit 63b4326. Configure here.

},
onlyIfParent: true,
})?.end(now);
Expand All @@ -178,7 +184,7 @@ function _instrumentComponents(config: {
},

after(_name: string, _timestamp: number, payload: Payload, _beganIndex: number) {
processComponentRenderAfter(payload, beforeEntries, 'ui.ember.component.render', minComponentDuration);
processComponentRenderAfter(payload, beforeEntries, BROWSER_UI_RENDER_SPAN_OP, minComponentDuration);
},
});
if (enableComponentDefinitions) {
Expand All @@ -188,7 +194,7 @@ function _instrumentComponents(config: {
},

after(_name: string, _timestamp: number, payload: Payload, _beganIndex: number) {
processComponentRenderAfter(payload, beforeComponentDefinitionEntries, 'ui.ember.component.definition', 0);
processComponentRenderAfter(payload, beforeComponentDefinitionEntries, GENERAL_FUNCTION_SPAN_OP, 0);
},
});
}
Expand Down Expand Up @@ -230,9 +236,10 @@ function _instrumentInitialLoad(): void {
const endTime = startTime + measure.duration / 1000;

startInactiveSpan({
op: 'ui.ember.init',
name: 'init',
attributes: {
// TODO(v11): Replace with the `ui.mount` constant from `@sentry/conventions/op` once it is registered there.
[SENTRY_OP]: 'ui.mount',
[SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.ui.ember',
},
startTime,
Expand Down
Loading
Loading