Skip to content

ref(tracing): Implement changes to new browserTracingIntegration #10393

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Jan 29, 2024

Conversation

mydea
Copy link
Member

@mydea mydea commented Jan 29, 2024

This implements changes to the new integration, based on feedback from the team.

The main thing this addresses is the way we disable the default span creation. The original idea was to make this work with custom router instrumentations (e.g. for react router) that may be added as separate integrations. This required us to keep track of if another, non-default implementation has been added, to opt out of the defaults.

With this change, we do not do this anymore. Instead, the defaults should be configured by wrapping integrations. Some examples for how this should then work:

  1. Angular:
export function browserTracingIntegration(
  options?: Parameters<typeof originalBrowserTracingIntegration>[0],
): Integration {
  // do not use default navigation, as we provide our own
  // actual code for this is in the angular service
  options.instrumentNavigation = false;
  return originalBrowserTracingIntegration(options);
}
  1. Vue
export function browserTracingIntegration(
  options?: Parameters<typeof originalBrowserTracingIntegration>[0] & { router?: VueRouter },
): Integration {

  if (options.router) {
    options.instrumentNavigation = false;
    const integration = originalBrowserTracingIntegration(options);
    const originalSetupAfterAll = integration.setupAfterAll;
    integration.setupAfterAll = (client: Client) => {
      setupVueRoutingInstrumentation(client); // some method
      originalSetupAfterAll(client);
    }
  }

  return originalBrowserTracingIntegration(options);
}
  1. React
export function browserTracingIntegration(
  options?: Parameters<typeof originalBrowserTracingIntegration>[0] & { router?: ReactRouterInstrumentation },
): Integration {

  if (options.router) {
    options.instrumentNavigation = false;
    options.instrumentPageLoad = false;
    const integration = originalBrowserTracingIntegration(options);
    const originalSetupAfterAll = integration.setupAfterAll;
    integration.setupAfterAll = (client: Client) => {
      // setup custom routing instrumentation
      options.router(client); // or whatever API we want there
      originalSetupAfterAll(client);
    }
  }

  return originalBrowserTracingIntegration(options);
}

This implements changes to the new integration, based on feedback from the team.
@mydea mydea requested review from lforst, Lms24 and AbhiPrasad January 29, 2024 13:33
@mydea mydea self-assigned this Jan 29, 2024
Copy link
Contributor

@lforst lforst left a comment

Choose a reason for hiding this comment

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

Awesome. Thank you!

Copy link
Contributor

size-limit report 📦

Path Size
@sentry/browser (incl. Tracing, Replay, Feedback) - Webpack (gzipped) 78.14 KB (0%)
@sentry/browser (incl. Tracing, Replay) - Webpack (gzipped) 69.34 KB (0%)
@sentry/browser (incl. Tracing, Replay with Canvas) - Webpack (gzipped) 73.24 KB (0%)
@sentry/browser (incl. Tracing, Replay) - Webpack with treeshaking flags (gzipped) 62.97 KB (0%)
@sentry/browser (incl. Tracing) - Webpack (gzipped) 33.38 KB (0%)
@sentry/browser (incl. browserTracingIntegration) - Webpack (gzipped) 33.24 KB (-0.11% 🔽)
@sentry/browser (incl. Feedback) - Webpack (gzipped) 31.32 KB (0%)
@sentry/browser (incl. sendFeedback) - Webpack (gzipped) 31.33 KB (0%)
@sentry/browser - Webpack (gzipped) 22.6 KB (0%)
@sentry/browser (incl. Tracing, Replay, Feedback) - ES6 CDN Bundle (gzipped) 75.96 KB (0%)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (gzipped) 67.5 KB (0%)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (gzipped) 33.37 KB (0%)
@sentry/browser - ES6 CDN Bundle (gzipped) 24.52 KB (0%)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed) 212.55 KB (0%)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed) 100.56 KB (0%)
@sentry/browser - ES6 CDN Bundle (minified & uncompressed) 73.35 KB (0%)
@sentry/browser (incl. Tracing) - ES5 CDN Bundle (gzipped) 36.46 KB (0%)
@sentry/react (incl. Tracing, Replay) - Webpack (gzipped) 69.76 KB (0%)
@sentry/react - Webpack (gzipped) 22.63 KB (0%)
@sentry/nextjs Client (incl. Tracing, Replay) - Webpack (gzipped) 86.43 KB (0%)
@sentry/nextjs Client - Webpack (gzipped) 50.73 KB (0%)
@sentry-internal/feedback - Webpack (gzipped) 17.21 KB (0%)

Copy link
Member

@Lms24 Lms24 left a comment

Choose a reason for hiding this comment

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

Good change!

@mydea mydea merged commit 7dc9260 into develop Jan 29, 2024
@mydea mydea deleted the fn/browserTracing-adjustments branch January 29, 2024 16:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants