move stuff around and fix it

Author: mydea

packages/ember/addon/index.ts

@@ -119,3 +119,8 @@ export const instrumentRoutePerformance = <T extends RouteConstructor>(BaseRoute
 };
 
 export * from '@sentry/browser';
+
+/**
+ *  Ember-specific browser tracing integration
+ */
+export { browserTracingIntegration } from './utils/browserTracingIntegration';

packages/ember/addon/instance-initializers/sentry-performance.ts

@@ -1,6 +1,6 @@
 /* eslint-disable max-lines */
 import type ApplicationInstance from '@ember/application/instance';
-import { getOwnConfig, isTesting, macroCondition } from '@embroider/macros';
+import { getOwnConfig } from '@embroider/macros';
 import { GLOBAL_OBJ } from '@sentry/core';
 import type { EmberSentryConfig, GlobalConfig, OwnConfig } from '../types';
 import { instrumentForPerformance } from '../utils/performance';
@@ -30,7 +30,6 @@ export function initialize(appInstance: ApplicationInstance): void {
     return;
   }
   instrumentForPerformance(appInstance);
-
 }
 
 export default {

packages/ember/addon/utils/browserTracingIntegration.ts

@@ -5,12 +5,22 @@ import {
 } from '@sentry/browser';
 import type { Integration } from '@sentry/core';
 import type ApplicationInstance from '@ember/application/instance';
-import { instrumentEmberAppInstanceForPerformance } from './performance';
+import { instrumentEmberAppInstanceForPerformance } from './instrumentEmberAppInstanceForPerformance';
+import { instrumentGlobalsForPerformance } from './instrumentEmberGlobals';
+import { isTesting, macroCondition } from '@embroider/macros';
 
 type EmberBrowserTracingIntegrationOptions = Parameters<typeof originalBrowserTracingIntegration>[0] & {
   appInstance: ApplicationInstance;
+  disableRunloopPerformance?: boolean;
+  minimumRunloopQueueDuration?: number;
+  disableInstrumentComponents?: boolean;
+  minimumComponentRenderDuration?: number;
+  enableComponentDefinitions?: boolean;
+  disableInitialLoadInstrumentation?: boolean;
 };
 
+let _initialized = false;
+
 export function browserTracingIntegration(options: EmberBrowserTracingIntegrationOptions): Integration {
   const { appInstance } = options;
 
@@ -23,10 +33,19 @@ export function browserTracingIntegration(options: EmberBrowserTracingIntegratio
     instrumentPageLoad: false,
   });
 
-  const config = {
-    disableRunloopPerformance: false,
+  const appInstancePerformanceConfig = {
+    disableRunloopPerformance: options.disableRunloopPerformance ?? false,
     instrumentPageLoad,
-    instrumentNavigation
+    instrumentNavigation,
+  };
+
+  const globalsPerformanceConfig = {
+    disableRunloopPerformance: options.disableRunloopPerformance ?? false,
+    minimumRunloopQueueDuration: options.minimumRunloopQueueDuration ?? 0,
+    disableInstrumentComponents: options.disableInstrumentComponents ?? false,
+    minimumComponentRenderDuration: options.minimumComponentRenderDuration ?? 0,
+    enableComponentDefinitions: options.enableComponentDefinitions ?? false,
+    disableInitialLoadInstrumentation: options.disableInitialLoadInstrumentation ?? false,
   };
 
   return {
@@ -36,10 +55,20 @@ export function browserTracingIntegration(options: EmberBrowserTracingIntegratio
 
       instrumentEmberAppInstanceForPerformance(
         appInstance,
-        config,
+        appInstancePerformanceConfig,
         startBrowserTracingPageLoadSpan,
         startBrowserTracingNavigationSpan,
       );
+
+      // We only want to run this once in tests!
+      if (macroCondition(isTesting())) {
+        if (_initialized) {
+          return;
+        }
+      }
+
+      instrumentGlobalsForPerformance(globalsPerformanceConfig);
+      _initialized = true;
     },
   };
 }

packages/ember/addon/utils/instrumentEmberAppInstanceForPerformance.ts

@@ -0,0 +1,184 @@
+import type ApplicationInstance from '@ember/application/instance';
+import type Transition from '@ember/routing/-private/transition';
+import type RouterService from '@ember/routing/router-service';
+import type {
+  BrowserClient,
+  startBrowserTracingNavigationSpan as startBrowserTracingNavigationSpanType,
+  startBrowserTracingPageLoadSpan as startBrowserTracingPageLoadSpanType,
+} from '@sentry/browser';
+import {
+  getClient,
+  SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN,
+  SEMANTIC_ATTRIBUTE_SENTRY_SOURCE,
+  startInactiveSpan,
+} from '@sentry/browser';
+import type { Span } from '@sentry/core';
+import type { EmberRouterMain } from '../types';
+import { getBackburner } from './performance';
+
+export function instrumentEmberAppInstanceForPerformance(
+  appInstance: ApplicationInstance,
+  config: { disableRunloopPerformance?: boolean; instrumentPageLoad?: boolean; instrumentNavigation?: boolean },
+  startBrowserTracingPageLoadSpan: typeof startBrowserTracingPageLoadSpanType,
+  startBrowserTracingNavigationSpan: typeof startBrowserTracingNavigationSpanType,
+): void {
+  // eslint-disable-next-line ember/no-private-routing-service
+  const routerMain = appInstance.lookup('router:main') as EmberRouterMain;
+  let routerService = appInstance.lookup('service:router') as RouterService & {
+    externalRouter?: RouterService;
+    _hasMountedSentryPerformanceRouting?: boolean;
+  };
+
+  if (routerService.externalRouter) {
+    // Using ember-engines-router-service in an engine.
+    routerService = routerService.externalRouter;
+  }
+  if (routerService._hasMountedSentryPerformanceRouting) {
+    // Routing listens to route changes on the main router, and should not be initialized multiple times per page.
+    return;
+  }
+  if (!routerService.recognize) {
+    // Router is missing critical functionality to limit cardinality of the transaction names.
+    return;
+  }
+
+  routerService._hasMountedSentryPerformanceRouting = true;
+  _instrumentEmberRouter(
+    routerService,
+    routerMain,
+    config,
+    startBrowserTracingPageLoadSpan,
+    startBrowserTracingNavigationSpan,
+  );
+}
+
+function getTransitionInformation(
+  transition: Transition | undefined,
+  router: RouterService,
+): { fromRoute?: string; toRoute?: string } {
+  const fromRoute = transition?.from?.name;
+  const toRoute = transition?.to?.name || router.currentRouteName;
+  return {
+    fromRoute,
+    toRoute,
+  };
+}
+
+// Only exported for testing
+export function _getLocationURL(location: EmberRouterMain['location']): string {
+  if (!location?.getURL || !location?.formatURL) {
+    return '';
+  }
+  const url = location.formatURL(location.getURL());
+
+  // `implementation` is optional in Ember's predefined location types, so we also check if the URL starts with '#'.
+  if (location.implementation === 'hash' || url.startsWith('#')) {
+    return `${location.rootURL}${url}`;
+  }
+  return url;
+}
+
+function _instrumentEmberRouter(
+  routerService: RouterService,
+  routerMain: EmberRouterMain,
+  config: { disableRunloopPerformance?: boolean; instrumentPageLoad?: boolean; instrumentNavigation?: boolean },
+  startBrowserTracingPageLoadSpan: typeof startBrowserTracingPageLoadSpanType,
+  startBrowserTracingNavigationSpan: typeof startBrowserTracingNavigationSpanType,
+): void {
+  const { disableRunloopPerformance, instrumentPageLoad, instrumentNavigation } = config;
+  const location = routerMain.location;
+  let activeRootSpan: Span | undefined;
+  let transitionSpan: Span | undefined;
+
+  const url = _getLocationURL(location);
+
+  const client = getClient<BrowserClient>();
+
+  if (!client) {
+    return;
+  }
+
+  if (url && instrumentPageLoad !== false) {
+    const routeInfo = routerService.recognize(url);
+    activeRootSpan = startBrowserTracingPageLoadSpan(client, {
+      name: `route:${routeInfo.name}`,
+      attributes: {
+        [SEMANTIC_ATTRIBUTE_SENTRY_SOURCE]: 'route',
+        [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.pageload.ember',
+        url,
+        toRoute: routeInfo.name,
+      },
+    });
+  }
+
+  const finishActiveTransaction = (_: unknown, nextInstance: unknown): void => {
+    if (nextInstance) {
+      return;
+    }
+    activeRootSpan?.end();
+    getBackburner().off('end', finishActiveTransaction);
+  };
+
+  if (instrumentNavigation === false) {
+    return;
+  }
+
+  routerService.on('routeWillChange', (transition: Transition) => {
+    const { fromRoute, toRoute } = getTransitionInformation(transition, routerService);
+
+    // We want to ignore loading && error routes
+    if (transitionIsIntermediate(transition)) {
+      return;
+    }
+
+    activeRootSpan?.end();
+
+    activeRootSpan = startBrowserTracingNavigationSpan(client, {
+      name: `route:${toRoute}`,
+      attributes: {
+        [SEMANTIC_ATTRIBUTE_SENTRY_SOURCE]: 'route',
+        [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.navigation.ember',
+        fromRoute,
+        toRoute,
+      },
+    });
+
+    transitionSpan = startInactiveSpan({
+      attributes: {
+        [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.ui.ember',
+      },
+      op: 'ui.ember.transition',
+      name: `route:${fromRoute} -> route:${toRoute}`,
+      onlyIfParent: true,
+    });
+  });
+
+  routerService.on('routeDidChange', transition => {
+    if (!transitionSpan || !activeRootSpan || transitionIsIntermediate(transition)) {
+      return;
+    }
+    transitionSpan.end();
+
+    if (disableRunloopPerformance) {
+      activeRootSpan.end();
+      return;
+    }
+
+    getBackburner().on('end', finishActiveTransaction);
+  });
+}
+
+function transitionIsIntermediate(transition: Transition): boolean {
+  //  We want to use ignore, as this may actually be defined on new versions
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-ignore This actually exists on newer versions
+  const isIntermediate: boolean | undefined = transition.isIntermediate;
+
+  if (typeof isIntermediate === 'boolean') {
+    return isIntermediate;
+  }
+
+  // For versions without this, we look if the route is a `.loading` or `.error` route
+  // This is not perfect and may false-positive in some cases, but it's the best we can do
+  return transition.to?.localName === 'loading' || transition.to?.localName === 'error';
+}