Remove @sentry/tracing from browser SDK onboarding instructions

src/platform-includes/getting-started-config/javascript.angular.mdx

@@ -4,7 +4,6 @@ Once this is done, Sentry's Angular SDK captures all unhandled exceptions and tr
 import { enableProdMode } from "@angular/core";
 import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";
 import * as Sentry from "@sentry/angular-ivy";
-import { BrowserTracing } from "@sentry/tracing";
 import { AppModule } from "./app/app.module";
 
 Sentry.init({
@@ -13,7 +12,7 @@ Sentry.init({
     // Registers and configures the Tracing integration,
     // which automatically instruments your application to monitor its
     // performance, including custom Angular routing instrumentation
-    new BrowserTracing({
+    new Sentry.BrowserTracing({
       tracePropagationTargets: ["localhost", "https://yourserver.io/api"],
       routingInstrumentation: Sentry.routingInstrumentation,
     }),
@@ -35,7 +34,6 @@ platformBrowserDynamic()
 import { enableProdMode } from "@angular/core";
 import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";
 import * as Sentry from "@sentry/angular";
-import { BrowserTracing } from "@sentry/tracing";
 import { AppModule } from "./app/app.module";
 
 Sentry.init({
@@ -44,7 +42,7 @@ Sentry.init({
     // Registers and configures the Tracing integration,
     // which automatically instruments your application to monitor its
     // performance, including custom Angular routing instrumentation
-    new BrowserTracing({
+    new Sentry.BrowserTracing({
       tracePropagationTargets: ["localhost", "https://yourserver.io/api"],
       routingInstrumentation: Sentry.routingInstrumentation,
     }),

src/platform-includes/getting-started-config/javascript.mdx

@@ -2,15 +2,14 @@ Once this is done, Sentry's JavaScript SDK captures all unhandled exceptions and
 
 ```javascript {tabTitle: ESM}
 import * as Sentry from "@sentry/browser";
-import { BrowserTracing } from "@sentry/tracing";
 
 Sentry.init({
   dsn: "___PUBLIC_DSN___",
 
   // Alternatively, use `process.env.npm_package_version` for a dynamic release version
   // if your build tool supports it.
   release: "[email protected]",
-  integrations: [new BrowserTracing()],
+  integrations: [new Sentry.BrowserTracing()],
 
   // Set tracesSampleRate to 1.0 to capture 100%
   // of transactions for performance monitoring.

src/platform-includes/getting-started-config/javascript.react.mdx

@@ -2,12 +2,11 @@
 import React from "react";
 import ReactDOM from "react-dom";
 import * as Sentry from "@sentry/react";
-import { BrowserTracing } from "@sentry/tracing";
 import App from "./App";
 
 Sentry.init({
   dsn: "___PUBLIC_DSN___",
-  integrations: [new BrowserTracing()],
+  integrations: [new Sentry.BrowserTracing()],
 
   // We recommend adjusting this value in production, or using tracesSampler
   // for finer control

src/platform-includes/getting-started-config/javascript.svelte.mdx

@@ -5,12 +5,11 @@ import "./app.css";
 import App from "./App.svelte";
 
 import * as Sentry from "@sentry/svelte";
-import { BrowserTracing } from "@sentry/tracing";
 
 // Initialize the Sentry SDK here
 Sentry.init({
   dsn: "___PUBLIC_DSN___",
-  integrations: [new BrowserTracing()],
+  integrations: [new Sentry.BrowserTracing()],
 
   // Set tracesSampleRate to 1.0 to capture 100%
   // of transactions for performance monitoring.
@@ -30,12 +29,11 @@ import "./app.css";
 import App from "./App.svelte";
 
 import * as Sentry from "@sentry/svelte";
-import { BrowserTracing } from "@sentry/tracing";
 
 // Initialize the Sentry SDK here
 Sentry.init({
   dsn: "___PUBLIC_DSN___",
-  integrations: [new BrowserTracing()],
+  integrations: [new Sentry.BrowserTracing()],
 
   // Set tracesSampleRate to 1.0 to capture 100%
   // of transactions for performance monitoring.

src/platform-includes/getting-started-config/javascript.vue.mdx

@@ -6,7 +6,6 @@ To initialize Sentry in your Vue application, add this to your `app.js`:
 import Vue from "vue";
 import Router from "vue-router";
 import * as Sentry from "@sentry/vue";
-import { BrowserTracing } from "@sentry/tracing";
 
 Vue.use(Router);
 
@@ -18,7 +17,7 @@ Sentry.init({
   Vue,
   dsn: "___PUBLIC_DSN___",
   integrations: [
-    new BrowserTracing({
+    new Sentry.BrowserTracing({
       routingInstrumentation: Sentry.vueRouterInstrumentation(router),
       tracePropagationTargets: ["localhost", "my-site-url.com", /^\//],
     }),
@@ -43,7 +42,6 @@ new Vue({
 import { createApp } from "vue";
 import { createRouter } from "vue-router";
 import * as Sentry from "@sentry/vue";
-import { BrowserTracing } from "@sentry/tracing";
 
 const app = createApp({
   // ...
@@ -56,7 +54,7 @@ Sentry.init({
   app,
   dsn: "___PUBLIC_DSN___",
   integrations: [
-    new BrowserTracing({
+    new Sentry.BrowserTracing({
       routingInstrumentation: Sentry.vueRouterInstrumentation(router),
       tracePropagationTargets: ["localhost", "my-site-url.com", /^\//],
     }),

src/platform-includes/getting-started-install/javascript.angular.mdx

@@ -1,17 +1,17 @@
 ```bash {tabTitle:npm}
 # Angular 12 and newer:
-npm install --save @sentry/angular-ivy @sentry/tracing
+npm install --save @sentry/angular-ivy
 
 # Angular 10 and 11:
-npm install --save @sentry/angular @sentry/tracing
+npm install --save @sentry/angular
 ```
 
 ```bash {tabTitle:Yarn}
 # Angular 12 and newer:
-yarn add @sentry/angular-ivy @sentry/tracing
+yarn add @sentry/angular-ivy
 
 # Angular 10 and 11:
-yarn add @sentry/angular @sentry/tracing
+yarn add @sentry/angular
 ```
 
 ### Angular Version Compatibility

src/platform-includes/getting-started-install/javascript.mdx

@@ -1,9 +1,9 @@
 ```bash {tabTitle: yarn}
-yarn add @sentry/browser @sentry/tracing
+yarn add @sentry/browser
 ```
 
 ```bash {tabTitle: npm}
-npm install --save @sentry/browser @sentry/tracing
+npm install --save @sentry/browser
 ```
 
 <Note>

src/platform-includes/getting-started-install/javascript.react.mdx

@@ -1,7 +1,7 @@
 ```bash {tabTitle: ESM}
 # Using npm
-npm install --save @sentry/react @sentry/tracing
+npm install --save @sentry/react
 
 # Using yarn
-yarn add @sentry/react @sentry/tracing
+yarn add @sentry/react
 ```

src/platform-includes/getting-started-install/javascript.svelte.mdx

@@ -1,7 +1,7 @@
 ```bash {tabTitle:npm}
-npm install --save @sentry/svelte @sentry/tracing
+npm install --save @sentry/svelte
 ```
 
 ```bash {tabTitle:yarn}
-yarn add @sentry/svelte @sentry/tracing
+yarn add @sentry/svelte
 ```

src/platform-includes/getting-started-install/javascript.vue.mdx

@@ -1,7 +1,7 @@
 ```bash {tabTitle:npm}
-npm install --save @sentry/vue @sentry/tracing
+npm install --save @sentry/vue
 ```
 
 ```bash {tabTitle:Yarn}
-yarn add @sentry/vue @sentry/tracing
+yarn add @sentry/vue
 ```

src/platform-includes/performance/automatic-instrumentation-intro/javascript.mdx

@@ -1 +1 @@
-The `@sentry/tracing` package provides a `BrowserTracing` integration to add automatic instrumentation for monitoring the performance of browser applications.
+The Sentry SDK package provides a `BrowserTracing` integration to add automatic instrumentation for monitoring the performance of browser applications.

src/platform-includes/performance/configure-sample-rate/javascript.mdx

@@ -4,17 +4,15 @@
 import * as Sentry from "@sentry/browser";
 
 // If taking advantage of automatic instrumentation (highly recommended)
-import { BrowserTracing } from "@sentry/tracing";
 // Or, if only manually tracing
-// import * as _ from "@sentry/tracing"
-// Note: You MUST import the package in some way for tracing to work
+// Sentry.addTracingExtensions();
 
 Sentry.init({
   dsn: "___PUBLIC_DSN___",
 
   // This enables automatic instrumentation (highly recommended), but is not
   // necessary for purely manual usage
-  integrations: [new BrowserTracing()],
+  integrations: [new Sentry.BrowserTracing()],
 
   // We recommend adjusting this value in production, or using tracesSampler
   // for finer control

src/platform-includes/performance/configure-sample-rate/javascript.react.mdx

@@ -1,18 +1,15 @@
 ```javascript
 import * as Sentry from "@sentry/react";
 
-// If taking advantage of automatic instrumentation (highly recommended)
-import { BrowserTracing } from "@sentry/tracing";
-// Or, if only manually tracing
-// import * as _ from "@sentry/tracing"
-// Note: You MUST import the package in some way for tracing to work
+// If only manually tracing (not using the `BrowserTracing` integration)
+// Sentry.addTracingExtensions();
 
 Sentry.init({
   dsn: "___PUBLIC_DSN___",
 
   // This enables automatic instrumentation (highly recommended), but is not
   // necessary for purely manual usage
-  integrations: [new BrowserTracing()],
+  integrations: [new Sentry.BrowserTracing()],
 
   // We recommend adjusting this value in production, or using tracesSampler
   // for finer control

src/platform-includes/performance/configure-sample-rate/javascript.vue.mdx

@@ -2,11 +2,8 @@
 import Vue from "vue";
 import * as Sentry from "@sentry/vue";
 
-// If taking advantage of automatic instrumentation (highly recommended)
-import { BrowserTracing } from "@sentry/tracing";
-// Or, if only manually tracing
-// import * as _ from "@sentry/tracing"
-// Note: You MUST import the package in some way for tracing to work
+// If only manually tracing (not using the `BrowserTracing` integration)
+// Sentry.addTracingExtensions();
 
 Sentry.init({
   // Passing in `Vue` is optional, if you do not pass it `window.Vue` must be present.
@@ -15,7 +12,7 @@ Sentry.init({
 
   // This enables automatic instrumentation (highly recommended), but is not
   // necessary for purely manual usage
-  integrations: [new BrowserTracing()],
+  integrations: [new Sentry.BrowserTracing()],
 
   // We recommend adjusting this value in production, or using tracesSampler
   // for finer control

src/platform-includes/performance/enable-automatic-instrumentation/javascript.mdx

@@ -1,18 +1,17 @@
-To enable tracing, include the `BrowserTracing` integration in your SDK configuration options. (Note that when using ESM modules, the main `@sentry/*` import must come before the `@sentry/tracing` import.)
+To enable tracing, include the `BrowserTracing` integration in your SDK configuration options.
 
 After configuration, you will see both `pageload` and `navigation` transactions in the Sentry UI.
 
 ```javascript {tabTitle: ESM}
 // If you're using one of our framework SDK packages, like `@sentry/angular`,
 // substitute its name for `@sentry/browser` here
 import * as Sentry from "@sentry/browser";
-import { BrowserTracing } from "@sentry/tracing"; // Must import second
 
 Sentry.init({
   dsn: "___PUBLIC_DSN___",
 
   integrations: [
-    new BrowserTracing({
+    new Sentry.BrowserTracing({
       tracePropagationTargets: ["localhost", "my-site-url.com", /^\//],
       // ... other options
     }),

src/platform-includes/performance/enable-automatic-instrumentation/javascript.react.mdx

@@ -1,21 +1,20 @@
-To enable tracing, include the `BrowserTracing` integration in your SDK configuration options. (Note that when using ESM modules, the main `@sentry/react` import must come before the `@sentry/tracing` import.)
+To enable tracing, include the `BrowserTracing` integration in your SDK configuration options.
 
 To use `react-router` integration, import and set a custom routing instrumentation using a custom history. Make sure you use a `Router` component combined with `createBrowserHistory` (or equivalent).
 
 ```javascript
-import { Router } from 'react-router-dom';
-import { createBrowserHistory } from 'history';
+import { Router } from "react-router-dom";
+import { createBrowserHistory } from "history";
 
 import * as Sentry from "@sentry/react";
-import { BrowserTracing } from "@sentry/tracing"; // Must import after @sentry/react
 
 const history = createBrowserHistory();
 
 Sentry.init({
   dsn: "___PUBLIC_DSN___",
 
   integrations: [
-    new BrowserTracing({
+    new Sentry.BrowserTracing({
       tracePropagationTargets: ["localhost", "my-site-url.com", /^\//],
 
       // Can also use reactRouterV3Instrumentation or reactRouterV4Instrumentation

src/platform-includes/performance/group-transaction-example/javascript.mdx

@@ -15,12 +15,11 @@ For browser JavaScript applications using the `BrowserTracing` integration, the
 
 ```javascript
 import * as Sentry from "@sentry/browser";
-import { BrowserTracing } from "@sentry/tracing";
 
 Sentry.init({
   // ...
   integrations: [
-    new BrowserTracing({
+    new Sentry.BrowserTracing({
       beforeNavigate: context => {
         return {
           ...context,

src/platforms/common/performance/index.mdx

@@ -131,7 +131,7 @@ Learn more about using and customizing the React Profiler in [React Component Tr
 
 ## React Router
 
-If you are using `react-router`, we provide <PlatformLink to="/configuration/integrations/react-router/">React Router instrumentation</PlatformLink> to use with our `@sentry/tracing` package.
+If you are using `react-router`, we provide <PlatformLink to="/configuration/integrations/react-router/">React Router instrumentation</PlatformLink> to use with our Performance Monitoring functionality.
 
 </PlatformSection>
 

src/platforms/javascript/common/configuration/tree-shaking/index.mdx

@@ -25,7 +25,7 @@ To make optional code eligible for tree shaking, you can replace various flags i
 
 : Replacing this flag with `false` will tree shake all code in the SDK that is related to performance monitoring.
 **Attention:** `__SENTRY_TRACING__` must not be replaced with `false` when you're directly using the `@sentry/tracing` package, or when you're using any performance monitoring related SDK features (e.g. `Sentry.startTransaction()`).
-This flag is intended to be used in combination with packages like `@sentry/next` where the `@sentry/tracing` package is used implicitly.
+This flag is intended to be used in combination with packages like `@sentry/nextjs` where the `@sentry/tracing` package is used implicitly.
 
 <PlatformSection notSupported={["javascript.nextjs"]}>
 

src/platforms/javascript/common/configuration/webworkers/index.mdx

@@ -85,7 +85,7 @@ self.onmessage = message => {
 
 ### Integrations
 
-Using non-default integrations such as [@sentry/tracing](/platforms/javascript/performance/) inside Web Workers may not work as expected. Non-default integrations enabled outside workers' scope are not affected by worker-level configurations and will still work as expected.
+Using non-default integrations such as [Sentry Performance Monitoring](/platforms/javascript/performance/) inside Web Workers may not work as expected. Non-default integrations enabled outside workers' scope are not affected by worker-level configurations and will still work as expected.
 
 ### Source Maps