From 34de27d1dc64b0c7b3a07b432ffed693f75ef281 Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Fri, 11 Feb 2022 12:06:15 +0000
Subject: [PATCH 01/19] feat(test): Run Playwright tests using bundles.

---
 .github/workflows/build.yml                   | 13 ++++-
 packages/integration-tests/package.json       | 10 +++-
 .../integration-tests/utils/generatePage.ts   | 56 +++++++++++++++++--
 packages/integration-tests/webpack.config.ts  |  2 +-
 4 files changed, 72 insertions(+), 9 deletions(-)

diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index 4c009ac08166..b125807e2cbe 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -276,9 +276,18 @@ jobs:
             ${{ github.workspace }}/packages/serverless/dist-awslambda-layer/*.zip
 
   job_browser_playwright_tests:
-    name: Browser Playwright Tests
+    name: Browser Playwright Tests (Bundle ${{ matrix.bundle }})
     needs: job_build
     runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        bundle:
+          - esm
+          - dist
+          - bundle
+          - bundle_min
+          - bundle_es6
+          - bundle_es6_min
     steps:
       - name: Check out current commit (${{ github.sha }})
         uses: actions/checkout@v2
@@ -297,6 +306,8 @@ jobs:
           path: ${{ env.CACHED_BUILD_PATHS }}
           key: ${{ env.BUILD_CACHE_KEY }}
       - name: Run Playwright tests
+        env:
+          PW_BUNDLE: ${{ matrix.bundle }}
         run: |
           cd packages/integration-tests
           yarn run playwright install-deps webkit
diff --git a/packages/integration-tests/package.json b/packages/integration-tests/package.json
index 04dc43de5f51..8414879752dc 100644
--- a/packages/integration-tests/package.json
+++ b/packages/integration-tests/package.json
@@ -13,10 +13,16 @@
     "lint": "run-s lint:prettier lint:eslint",
     "lint:eslint": "eslint . --cache --cache-location '../../eslintcache/' --format stylish",
     "lint:prettier": "prettier --check \"{suites,utils}/**/*.ts\"",
-    "test:ci": "playwright test ./suites --browser='all' --reporter='line'",
     "type-check": "tsc",
     "pretest": "yarn clean && yarn type-check",
-    "test": "playwright test ./suites"
+    "test": "playwright test ./suites",
+    "test:bundle": "PW_BUNDLE=bundle yarn test",
+    "test:bundle:min": "PW_BUNDLE=bundle_min yarn test",
+    "test:bundle:es6": "PW_BUNDLE=bundle_es6 yarn test",
+    "test:bundle:es6:min": "PW_BUNDLE=bundle_es6_min yarn test",
+    "test:dist": "PW_BUNDLE=dist yarn test",
+    "test:esm": "PW_BUNDLE=esm yarn test",
+    "test:ci": "playwright test ./suites --browser='all' --reporter='line'"
   },
   "dependencies": {
     "@babel/preset-typescript": "^7.16.7",
diff --git a/packages/integration-tests/utils/generatePage.ts b/packages/integration-tests/utils/generatePage.ts
index 63ddcc3f4ced..7e58981cdaac 100644
--- a/packages/integration-tests/utils/generatePage.ts
+++ b/packages/integration-tests/utils/generatePage.ts
@@ -1,3 +1,4 @@
+/* eslint-disable no-console */
 import { Package } from '@sentry/types';
 import { existsSync, mkdirSync, promises } from 'fs';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
@@ -8,6 +9,29 @@ import webpackConfig from '../webpack.config';
 
 const PACKAGE_PATH = '../../packages';
 
+const bundleKey = process.env.PW_BUNDLE || '';
+const useCompiledModule = (bundleKey && bundleKey === 'esm') || bundleKey === 'dist';
+const useBundle = bundleKey && !useCompiledModule;
+
+const TEST_PATHS: Record<string, Record<string, string>> = {
+  browser: {
+    dist: 'dist/index.js',
+    esm: 'esm/index.js',
+    bundle: 'build/bundle.js',
+    bundle_min: 'build/bundle.min.js',
+    bundle_es6: 'build/bundle.es6.js',
+    bundle_es6_min: 'build/bundle.es6.min.js',
+  },
+  tracing: {
+    dist: 'dist/index.js',
+    esm: 'esm/index.js',
+    bundle: 'build/bundle.tracing.js',
+    bundle_min: 'build/bundle.tracing.min.js',
+    bundle_es6: 'build/bundle.tracing.js',
+    bundle_es6_min: 'build/bundle.tracing.min.js',
+  },
+};
+
 /**
  * Generate webpack aliases based on packages in monorepo
  * Example of an alias: '@sentry/serverless': 'path/to/sentry-javascript/packages/serverless',
@@ -19,11 +43,26 @@ async function generateSentryAlias(): Promise<Record<string, string>> {
 
   return Object.fromEntries(
     await Promise.all(
-      dirents.map(async d => {
+      dirents.map(async packageName => {
         const packageJSON: Package = JSON.parse(
-          (await promises.readFile(path.resolve(PACKAGE_PATH, d, 'package.json'), { encoding: 'utf-8' })).toString(),
+          (
+            await promises.readFile(path.resolve(PACKAGE_PATH, packageName, 'package.json'), { encoding: 'utf-8' })
+          ).toString(),
         );
-        return [packageJSON['name'], path.resolve(PACKAGE_PATH, d)];
+
+        const packagePath = path.resolve(PACKAGE_PATH, packageName);
+
+        if (useCompiledModule && TEST_PATHS[packageName]) {
+          const bundlePath = path.resolve(packagePath, TEST_PATHS[packageName][bundleKey]);
+
+          if (!existsSync(bundlePath)) {
+            console.warn(`${bundlePath} is not found. Try building the package before running tests.`);
+          }
+
+          return [packageJSON['name'], bundlePath];
+        }
+
+        return [packageJSON['name'], packagePath];
       }),
     ),
   );
@@ -44,6 +83,14 @@ export async function generatePage(
     mkdirSync(localPath, { recursive: true });
   }
 
+  const bundlesToInject = useBundle
+    ? ['browser', 'tracing'].map(sentryPackage =>
+        path.resolve(PACKAGE_PATH, sentryPackage, TEST_PATHS[sentryPackage][bundleKey]),
+      )
+    : [];
+
+  const initializationEntry = bundlesToInject.concat(initializationPath);
+
   if (!existsSync(bundlePath)) {
     await new Promise<void>((resolve, reject) => {
       const compiler = webpack(
@@ -52,7 +99,7 @@ export async function generatePage(
             alias,
           },
           entry: {
-            initialization: initializationPath,
+            initialization: initializationEntry,
             subject: subjectPath,
           },
           output: {
@@ -65,7 +112,6 @@ export async function generatePage(
               template: templatePath,
               initialization: 'initialization.bundle.js',
               subject: `subject.bundle.js`,
-              inject: false,
             }),
           ],
         }),
diff --git a/packages/integration-tests/webpack.config.ts b/packages/integration-tests/webpack.config.ts
index 44f62e029ba9..b74f04fd8226 100644
--- a/packages/integration-tests/webpack.config.ts
+++ b/packages/integration-tests/webpack.config.ts
@@ -1,6 +1,6 @@
 import { Configuration } from 'webpack';
 
-const config = function(userConfig: Record<string, unknown>): Configuration {
+const config = function (userConfig: Record<string, unknown>): Configuration {
   return {
     ...userConfig,
     mode: 'none',

From 6389f7d50d7181f55e32b9ee26a113696a267f9e Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Fri, 11 Feb 2022 13:15:47 +0000
Subject: [PATCH 02/19] Simplify generation logic.

---
 .../integration-tests/utils/generatePage.ts   | 39 ++++++++-----------
 1 file changed, 17 insertions(+), 22 deletions(-)

diff --git a/packages/integration-tests/utils/generatePage.ts b/packages/integration-tests/utils/generatePage.ts
index 7e58981cdaac..1c39a6f72341 100644
--- a/packages/integration-tests/utils/generatePage.ts
+++ b/packages/integration-tests/utils/generatePage.ts
@@ -1,4 +1,3 @@
-/* eslint-disable no-console */
 import { Package } from '@sentry/types';
 import { existsSync, mkdirSync, promises } from 'fs';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
@@ -9,11 +8,11 @@ import webpackConfig from '../webpack.config';
 
 const PACKAGE_PATH = '../../packages';
 
-const bundleKey = process.env.PW_BUNDLE || '';
-const useCompiledModule = (bundleKey && bundleKey === 'esm') || bundleKey === 'dist';
+const bundleKey = process.env.PW_BUNDLE;
+const useCompiledModule = bundleKey && (bundleKey === 'esm' || bundleKey === 'dist');
 const useBundle = bundleKey && !useCompiledModule;
 
-const TEST_PATHS: Record<string, Record<string, string>> = {
+const BUNDLE_PATHS: Record<string, Record<string, string>> = {
   browser: {
     dist: 'dist/index.js',
     esm: 'esm/index.js',
@@ -43,26 +42,20 @@ async function generateSentryAlias(): Promise<Record<string, string>> {
 
   return Object.fromEntries(
     await Promise.all(
-      dirents.map(async packageName => {
+      dirents.map(async d => {
         const packageJSON: Package = JSON.parse(
-          (
-            await promises.readFile(path.resolve(PACKAGE_PATH, packageName, 'package.json'), { encoding: 'utf-8' })
-          ).toString(),
+          (await promises.readFile(path.resolve(PACKAGE_PATH, d, 'package.json'), { encoding: 'utf-8' })).toString(),
         );
 
-        const packagePath = path.resolve(PACKAGE_PATH, packageName);
+        const modulePath = path.resolve(PACKAGE_PATH, d);
 
-        if (useCompiledModule && TEST_PATHS[packageName]) {
-          const bundlePath = path.resolve(packagePath, TEST_PATHS[packageName][bundleKey]);
-
-          if (!existsSync(bundlePath)) {
-            console.warn(`${bundlePath} is not found. Try building the package before running tests.`);
-          }
+        if (useCompiledModule && bundleKey && BUNDLE_PATHS[d][bundleKey]) {
+          const bundlePath = path.resolve(modulePath, BUNDLE_PATHS[d][bundleKey]);
 
           return [packageJSON['name'], bundlePath];
         }
 
-        return [packageJSON['name'], packagePath];
+        return [packageJSON['name'], modulePath];
       }),
     ),
   );
@@ -83,11 +76,12 @@ export async function generatePage(
     mkdirSync(localPath, { recursive: true });
   }
 
-  const bundlesToInject = useBundle
-    ? ['browser', 'tracing'].map(sentryPackage =>
-        path.resolve(PACKAGE_PATH, sentryPackage, TEST_PATHS[sentryPackage][bundleKey]),
-      )
-    : [];
+  const bundlesToInject =
+    useBundle && bundleKey
+      ? ['browser', 'tracing'].map(sentryPackage =>
+          path.resolve(PACKAGE_PATH, sentryPackage, BUNDLE_PATHS[sentryPackage][bundleKey]),
+        )
+      : [];
 
   const initializationEntry = bundlesToInject.concat(initializationPath);
 
@@ -111,7 +105,8 @@ export async function generatePage(
               filename: 'index.html',
               template: templatePath,
               initialization: 'initialization.bundle.js',
-              subject: `subject.bundle.js`,
+              subject: 'subject.bundle.js',
+              inject: false,
             }),
           ],
         }),

From 8aa54dbcf2db29a6b3c06f777567317c7a1ed0aa Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Fri, 11 Feb 2022 13:32:44 +0000
Subject: [PATCH 03/19] Fix unsafe lookup.

---
 packages/integration-tests/utils/generatePage.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/integration-tests/utils/generatePage.ts b/packages/integration-tests/utils/generatePage.ts
index 1c39a6f72341..8a92bd954ac6 100644
--- a/packages/integration-tests/utils/generatePage.ts
+++ b/packages/integration-tests/utils/generatePage.ts
@@ -49,7 +49,7 @@ async function generateSentryAlias(): Promise<Record<string, string>> {
 
         const modulePath = path.resolve(PACKAGE_PATH, d);
 
-        if (useCompiledModule && bundleKey && BUNDLE_PATHS[d][bundleKey]) {
+        if (useCompiledModule && bundleKey && BUNDLE_PATHS[d]?.[bundleKey]) {
           const bundlePath = path.resolve(modulePath, BUNDLE_PATHS[d][bundleKey]);
 
           return [packageJSON['name'], bundlePath];

From 3586b49040699c864fd594218e3a5f71859356a4 Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Fri, 11 Feb 2022 13:40:26 +0000
Subject: [PATCH 04/19] Document code, update README.

---
 packages/integration-tests/README.md             | 3 +++
 packages/integration-tests/utils/generatePage.ts | 5 +++++
 2 files changed, 8 insertions(+)

diff --git a/packages/integration-tests/README.md b/packages/integration-tests/README.md
index 98555b642fd0..92045d366b6f 100644
--- a/packages/integration-tests/README.md
+++ b/packages/integration-tests/README.md
@@ -56,6 +56,9 @@ To filter tests by their title:
 
 You can refer to [Playwright documentation](https://playwright.dev/docs/test-cli) for other CLI options.
 
+You can set env variable `PW_BUNDLE` to set specific `browser` and `tracing` build or bundle to test against.
+Available options: `esm`, `dist`, `bundle`, `bundle_min`, `bundle_es6`, `bundle_es6_min`
+
 ### Troubleshooting
 
 Apart from [Playwright-specific issues](https://playwright.dev/docs/troubleshooting), below are common issues that might occur while writing tests for Sentry Browser SDK.
diff --git a/packages/integration-tests/utils/generatePage.ts b/packages/integration-tests/utils/generatePage.ts
index 8a92bd954ac6..ae5f77bacabd 100644
--- a/packages/integration-tests/utils/generatePage.ts
+++ b/packages/integration-tests/utils/generatePage.ts
@@ -9,7 +9,11 @@ import webpackConfig from '../webpack.config';
 const PACKAGE_PATH = '../../packages';
 
 const bundleKey = process.env.PW_BUNDLE;
+
+// `esm` and `dist` builds are modules that can be imported / aliased by webpack
 const useCompiledModule = bundleKey && (bundleKey === 'esm' || bundleKey === 'dist');
+
+// bundles need to be injected into HTML before Sentry initialization.
 const useBundle = bundleKey && !useCompiledModule;
 
 const BUNDLE_PATHS: Record<string, Record<string, string>> = {
@@ -26,6 +30,7 @@ const BUNDLE_PATHS: Record<string, Record<string, string>> = {
     esm: 'esm/index.js',
     bundle: 'build/bundle.tracing.js',
     bundle_min: 'build/bundle.tracing.min.js',
+    // `tracing` doesn't have an es6 build
     bundle_es6: 'build/bundle.tracing.js',
     bundle_es6_min: 'build/bundle.tracing.min.js',
   },

From ea4044f126139ad39b84f80526beadddc769315b Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Fri, 11 Feb 2022 13:41:39 +0000
Subject: [PATCH 05/19] Remove unnecessary `Bundle` prefix.

---
 .github/workflows/build.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index b125807e2cbe..8dfc1e68897a 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -276,7 +276,7 @@ jobs:
             ${{ github.workspace }}/packages/serverless/dist-awslambda-layer/*.zip
 
   job_browser_playwright_tests:
-    name: Browser Playwright Tests (Bundle ${{ matrix.bundle }})
+    name: Browser Playwright Tests (${{ matrix.bundle }})
     needs: job_build
     runs-on: ubuntu-latest
     strategy:

From 05692e27d77b83c24b8566bdbbf1e8c2a276fd17 Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Fri, 11 Feb 2022 19:15:54 +0000
Subject: [PATCH 06/19] Move bundle injections to their own HTML scripts.

---
 .../public-api/addBreadcrumb/template.hbs     | 10 +++---
 .../public-api/captureException/template.hbs  | 10 +++---
 .../public-api/captureMessage/template.hbs    | 10 +++---
 .../public-api/configureScope/template.hbs    | 10 +++---
 .../suites/public-api/setContext/template.hbs | 10 +++---
 .../suites/public-api/setExtra/template.hbs   | 10 +++---
 .../suites/public-api/setExtras/template.hbs  | 10 +++---
 .../suites/public-api/setTag/template.hbs     | 10 +++---
 .../suites/public-api/setTags/template.hbs    | 10 +++---
 .../suites/public-api/setUser/template.hbs    | 10 +++---
 .../public-api/showReportDialog/template.hbs  | 10 +++---
 .../public-api/startTransaction/template.hbs  | 10 +++---
 .../suites/public-api/withScope/template.hbs  | 10 +++---
 .../sessions/start-session/template.hbs       |  5 +--
 .../sessions/update-session/template.hbs      |  3 ++
 .../backgroundtab-custom/template.hbs         | 12 ++++---
 .../backgroundtab-pageload/template.hbs       |  3 ++
 .../tracing/browsertracing/meta/template.hbs  | 10 +++---
 .../tracing/browsertracing/template.hbs       | 10 +++---
 .../metrics/connection-rtt/template.hbs       |  8 ++---
 .../pageload-resource-spans/template.hbs      | 14 ++++-----
 .../suites/tracing/metrics/template.hbs       | 10 +++---
 .../metrics/web-vitals-cls/template.hbs       | 12 +++----
 .../metrics/web-vitals-fid/template.hbs       | 10 +++---
 .../metrics/web-vitals-fp-fcp/template.hbs    |  8 ++---
 .../metrics/web-vitals-lcp/template.hbs       | 14 ++++-----
 .../metrics/web-vitals-ttfb/template.hbs      |  8 ++---
 .../suites/tracing/request/template.hbs       | 10 +++---
 .../integration-tests/utils/generatePage.ts   | 31 ++++++++++++-------
 29 files changed, 173 insertions(+), 125 deletions(-)

diff --git a/packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs b/packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs
+++ b/packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/captureException/template.hbs b/packages/integration-tests/suites/public-api/captureException/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/captureException/template.hbs
+++ b/packages/integration-tests/suites/public-api/captureException/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/captureMessage/template.hbs b/packages/integration-tests/suites/public-api/captureMessage/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/captureMessage/template.hbs
+++ b/packages/integration-tests/suites/public-api/captureMessage/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/configureScope/template.hbs b/packages/integration-tests/suites/public-api/configureScope/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/configureScope/template.hbs
+++ b/packages/integration-tests/suites/public-api/configureScope/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/setContext/template.hbs b/packages/integration-tests/suites/public-api/setContext/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/setContext/template.hbs
+++ b/packages/integration-tests/suites/public-api/setContext/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/setExtra/template.hbs b/packages/integration-tests/suites/public-api/setExtra/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/setExtra/template.hbs
+++ b/packages/integration-tests/suites/public-api/setExtra/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/setExtras/template.hbs b/packages/integration-tests/suites/public-api/setExtras/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/setExtras/template.hbs
+++ b/packages/integration-tests/suites/public-api/setExtras/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/setTag/template.hbs b/packages/integration-tests/suites/public-api/setTag/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/setTag/template.hbs
+++ b/packages/integration-tests/suites/public-api/setTag/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/setTags/template.hbs b/packages/integration-tests/suites/public-api/setTags/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/setTags/template.hbs
+++ b/packages/integration-tests/suites/public-api/setTags/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/setUser/template.hbs b/packages/integration-tests/suites/public-api/setUser/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/setUser/template.hbs
+++ b/packages/integration-tests/suites/public-api/setUser/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/showReportDialog/template.hbs b/packages/integration-tests/suites/public-api/showReportDialog/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/showReportDialog/template.hbs
+++ b/packages/integration-tests/suites/public-api/showReportDialog/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/startTransaction/template.hbs b/packages/integration-tests/suites/public-api/startTransaction/template.hbs
index a28a09b7b485..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/startTransaction/template.hbs
+++ b/packages/integration-tests/suites/public-api/startTransaction/template.hbs
@@ -1,11 +1,11 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
-    <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/public-api/withScope/template.hbs b/packages/integration-tests/suites/public-api/withScope/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/public-api/withScope/template.hbs
+++ b/packages/integration-tests/suites/public-api/withScope/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/sessions/start-session/template.hbs b/packages/integration-tests/suites/sessions/start-session/template.hbs
index 49ff0beab214..fe17ad6486f8 100644
--- a/packages/integration-tests/suites/sessions/start-session/template.hbs
+++ b/packages/integration-tests/suites/sessions/start-session/template.hbs
@@ -1,7 +1,8 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
     <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
diff --git a/packages/integration-tests/suites/sessions/update-session/template.hbs b/packages/integration-tests/suites/sessions/update-session/template.hbs
index 114ce1f75f83..41778999213b 100644
--- a/packages/integration-tests/suites/sessions/update-session/template.hbs
+++ b/packages/integration-tests/suites/sessions/update-session/template.hbs
@@ -2,6 +2,9 @@
   <head>
     <meta charset='utf-8' />
     <title></title>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
     <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
diff --git a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.hbs b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.hbs
index 4dbbc15044dc..e03b8e9a498f 100644
--- a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.hbs
+++ b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <button id="start-transaction">Start Transaction</button>
-    <button id="go-background">New Tab</button>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <button id='start-transaction'>Start Transaction</button>
+    <button id='go-background'>New Tab</button>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs
index 1171fc0676c3..82a07a740839 100644
--- a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs
+++ b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs
@@ -1,5 +1,8 @@
 <html>
   <head>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
     <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
diff --git a/packages/integration-tests/suites/tracing/browsertracing/meta/template.hbs b/packages/integration-tests/suites/tracing/browsertracing/meta/template.hbs
index d04e3bf11602..e18095698cc9 100644
--- a/packages/integration-tests/suites/tracing/browsertracing/meta/template.hbs
+++ b/packages/integration-tests/suites/tracing/browsertracing/meta/template.hbs
@@ -1,10 +1,12 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta name="sentry-trace" content="12312012123120121231201212312012-1121201211212012-1" />
-    <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    <meta name='sentry-trace' content='12312012123120121231201212312012-1121201211212012-1' />
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/tracing/browsertracing/template.hbs b/packages/integration-tests/suites/tracing/browsertracing/template.hbs
index d91677daaab5..a6296fe41bac 100644
--- a/packages/integration-tests/suites/tracing/browsertracing/template.hbs
+++ b/packages/integration-tests/suites/tracing/browsertracing/template.hbs
@@ -1,11 +1,11 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
-    <title></title>
-    <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/tracing/metrics/connection-rtt/template.hbs b/packages/integration-tests/suites/tracing/metrics/connection-rtt/template.hbs
index c798102c2014..d4155a96ad59 100644
--- a/packages/integration-tests/suites/tracing/metrics/connection-rtt/template.hbs
+++ b/packages/integration-tests/suites/tracing/metrics/connection-rtt/template.hbs
@@ -1,9 +1,9 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
-    <title></title>
-    <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
     <div>Rendered</div>
diff --git a/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs b/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs
index 4f0f2567a2f7..96ad786789fb 100644
--- a/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs
+++ b/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs
@@ -1,14 +1,14 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
-    <title></title>
-    <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
   </head>
   <body>
-    <img src="https://example.com/path/to/image.svg">
-    <script src="https://example.com/path/to/script.js"></script>
-    <link href="https://example.com/path/to/style.css" type="text/css" rel="stylesheet">
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
+    <img src='https://example.com/path/to/image.svg' />
+    <script src='https://example.com/path/to/script.js'></script>
+    <link href='https://example.com/path/to/style.css' type='text/css' rel='stylesheet' />
     <span>Rendered</span>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/tracing/metrics/template.hbs b/packages/integration-tests/suites/tracing/metrics/template.hbs
index 17beca810fbd..dead770cd92e 100644
--- a/packages/integration-tests/suites/tracing/metrics/template.hbs
+++ b/packages/integration-tests/suites/tracing/metrics/template.hbs
@@ -1,12 +1,12 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
-    <title></title>
-    <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
     <span>Rendered</span>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.hbs b/packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.hbs
index faa6f236b9a4..0723a6c18621 100644
--- a/packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.hbs
+++ b/packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.hbs
@@ -1,12 +1,12 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
-    <title></title>
-    <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <div id="content"></div>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <div id='content'></div>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs b/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs
index 40c850ddb608..2fb8f956f7ca 100644
--- a/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs
+++ b/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-    <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <button id="fid-btn" onclick="console.log('foo')">BTN</button>
+    <button id='fid-btn' onclick="console.log('foo')">BTN</button>
   </body>
 </html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.hbs b/packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.hbs
index c798102c2014..d4155a96ad59 100644
--- a/packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.hbs
+++ b/packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.hbs
@@ -1,9 +1,9 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
-    <title></title>
-    <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
     <div>Rendered</div>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.hbs b/packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.hbs
index d37c2df3da81..0daa19ebdd61 100644
--- a/packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.hbs
+++ b/packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.hbs
@@ -1,13 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
-    <title></title>
-    <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <div id="content"></div>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
-    <img src="https://example.com/path/to/image.png">
+    <div id='content'></div>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
+    <img src='https://example.com/path/to/image.png' />
   </body>
 </html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.hbs b/packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.hbs
index c798102c2014..d4155a96ad59 100644
--- a/packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.hbs
+++ b/packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.hbs
@@ -1,9 +1,9 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
-    <title></title>
-    <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
     <div>Rendered</div>
diff --git a/packages/integration-tests/suites/tracing/request/template.hbs b/packages/integration-tests/suites/tracing/request/template.hbs
index a28a09b7b485..9c5d6bd436c0 100644
--- a/packages/integration-tests/suites/tracing/request/template.hbs
+++ b/packages/integration-tests/suites/tracing/request/template.hbs
@@ -1,11 +1,13 @@
-<!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset='utf-8' />
     <title></title>
-  <script src="{{htmlWebpackPlugin.options.initialization}}"></script>
+    {{#each htmlWebpackPlugin.options.sentry_bundles}}
+      <script src='{{this}}'></script>
+    {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src="{{htmlWebpackPlugin.options.subject}}"></script>
+    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>
 </html>
diff --git a/packages/integration-tests/utils/generatePage.ts b/packages/integration-tests/utils/generatePage.ts
index ae5f77bacabd..4e7b9ff53f93 100644
--- a/packages/integration-tests/utils/generatePage.ts
+++ b/packages/integration-tests/utils/generatePage.ts
@@ -60,6 +60,11 @@ async function generateSentryAlias(): Promise<Record<string, string>> {
           return [packageJSON['name'], bundlePath];
         }
 
+        if (useBundle && bundleKey && BUNDLE_PATHS[d]?.[bundleKey]) {
+          // If we're injecting a bundle, ignore the webpack import.
+          return [packageJSON['name'], false];
+        }
+
         return [packageJSON['name'], modulePath];
       }),
     ),
@@ -81,15 +86,6 @@ export async function generatePage(
     mkdirSync(localPath, { recursive: true });
   }
 
-  const bundlesToInject =
-    useBundle && bundleKey
-      ? ['browser', 'tracing'].map(sentryPackage =>
-          path.resolve(PACKAGE_PATH, sentryPackage, BUNDLE_PATHS[sentryPackage][bundleKey]),
-        )
-      : [];
-
-  const initializationEntry = bundlesToInject.concat(initializationPath);
-
   if (!existsSync(bundlePath)) {
     await new Promise<void>((resolve, reject) => {
       const compiler = webpack(
@@ -98,9 +94,16 @@ export async function generatePage(
             alias,
           },
           entry: {
-            initialization: initializationEntry,
+            initialization: initializationPath,
             subject: subjectPath,
           },
+          externals: useBundle
+            ? {
+                '@sentry/browser': 'var Sentry',
+                '@sentry/tracing': 'var Sentry',
+                Integrations: 'var Sentry.Integrations',
+              }
+            : {},
           output: {
             path: localPath,
             filename: '[name].bundle.js',
@@ -109,11 +112,17 @@ export async function generatePage(
             new HtmlWebpackPlugin({
               filename: 'index.html',
               template: templatePath,
+              sentry_bundles:
+                useBundle && bundleKey
+                  ? ['browser', 'tracing'].map(sentryPackage =>
+                      path.resolve(PACKAGE_PATH, sentryPackage, BUNDLE_PATHS[sentryPackage][bundleKey]),
+                    )
+                  : [],
               initialization: 'initialization.bundle.js',
               subject: 'subject.bundle.js',
               inject: false,
             }),
-          ],
+          ].filter(Boolean),
         }),
       );
 

From de4e070f63693ccf95b4e16c5a0b98ad227c6e1b Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Fri, 11 Feb 2022 19:33:13 +0000
Subject: [PATCH 07/19] Remove unused filter.

---
 packages/integration-tests/utils/generatePage.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/integration-tests/utils/generatePage.ts b/packages/integration-tests/utils/generatePage.ts
index 4e7b9ff53f93..6fe49688a4af 100644
--- a/packages/integration-tests/utils/generatePage.ts
+++ b/packages/integration-tests/utils/generatePage.ts
@@ -99,6 +99,7 @@ export async function generatePage(
           },
           externals: useBundle
             ? {
+                // To prevent import declarations to override browser bundles.
                 '@sentry/browser': 'var Sentry',
                 '@sentry/tracing': 'var Sentry',
                 Integrations: 'var Sentry.Integrations',
@@ -122,7 +123,7 @@ export async function generatePage(
               subject: 'subject.bundle.js',
               inject: false,
             }),
-          ].filter(Boolean),
+          ],
         }),
       );
 

From b90bd61b0f9d3d434550abad552a3a779579783f Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Fri, 11 Feb 2022 19:35:22 +0000
Subject: [PATCH 08/19] Remove empty `meta` and `title` elements from
 templates.

---
 .../suites/public-api/addBreadcrumb/template.hbs                | 2 --
 .../suites/public-api/captureException/template.hbs             | 2 --
 .../suites/public-api/captureMessage/template.hbs               | 2 --
 .../suites/public-api/configureScope/template.hbs               | 2 --
 .../integration-tests/suites/public-api/setContext/template.hbs | 2 --
 .../integration-tests/suites/public-api/setExtra/template.hbs   | 2 --
 .../integration-tests/suites/public-api/setExtras/template.hbs  | 2 --
 .../integration-tests/suites/public-api/setTag/template.hbs     | 2 --
 .../integration-tests/suites/public-api/setTags/template.hbs    | 2 --
 .../integration-tests/suites/public-api/setUser/template.hbs    | 2 --
 .../suites/public-api/showReportDialog/template.hbs             | 2 --
 .../integration-tests/suites/public-api/withScope/template.hbs  | 2 --
 .../suites/sessions/update-session/template.hbs                 | 2 --
 .../suites/tracing/metrics/web-vitals-fid/template.hbs          | 2 --
 packages/integration-tests/suites/tracing/request/template.hbs  | 2 --
 15 files changed, 30 deletions(-)

diff --git a/packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs b/packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs
+++ b/packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/public-api/captureException/template.hbs b/packages/integration-tests/suites/public-api/captureException/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/captureException/template.hbs
+++ b/packages/integration-tests/suites/public-api/captureException/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/public-api/captureMessage/template.hbs b/packages/integration-tests/suites/public-api/captureMessage/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/captureMessage/template.hbs
+++ b/packages/integration-tests/suites/public-api/captureMessage/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/public-api/configureScope/template.hbs b/packages/integration-tests/suites/public-api/configureScope/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/configureScope/template.hbs
+++ b/packages/integration-tests/suites/public-api/configureScope/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/public-api/setContext/template.hbs b/packages/integration-tests/suites/public-api/setContext/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/setContext/template.hbs
+++ b/packages/integration-tests/suites/public-api/setContext/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/public-api/setExtra/template.hbs b/packages/integration-tests/suites/public-api/setExtra/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/setExtra/template.hbs
+++ b/packages/integration-tests/suites/public-api/setExtra/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/public-api/setExtras/template.hbs b/packages/integration-tests/suites/public-api/setExtras/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/setExtras/template.hbs
+++ b/packages/integration-tests/suites/public-api/setExtras/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/public-api/setTag/template.hbs b/packages/integration-tests/suites/public-api/setTag/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/setTag/template.hbs
+++ b/packages/integration-tests/suites/public-api/setTag/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/public-api/setTags/template.hbs b/packages/integration-tests/suites/public-api/setTags/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/setTags/template.hbs
+++ b/packages/integration-tests/suites/public-api/setTags/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/public-api/setUser/template.hbs b/packages/integration-tests/suites/public-api/setUser/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/setUser/template.hbs
+++ b/packages/integration-tests/suites/public-api/setUser/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/public-api/showReportDialog/template.hbs b/packages/integration-tests/suites/public-api/showReportDialog/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/showReportDialog/template.hbs
+++ b/packages/integration-tests/suites/public-api/showReportDialog/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/public-api/withScope/template.hbs b/packages/integration-tests/suites/public-api/withScope/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/public-api/withScope/template.hbs
+++ b/packages/integration-tests/suites/public-api/withScope/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/sessions/update-session/template.hbs b/packages/integration-tests/suites/sessions/update-session/template.hbs
index 41778999213b..723bb824a906 100644
--- a/packages/integration-tests/suites/sessions/update-session/template.hbs
+++ b/packages/integration-tests/suites/sessions/update-session/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs b/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs
index 2fb8f956f7ca..54e0a4dd730f 100644
--- a/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs
+++ b/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
diff --git a/packages/integration-tests/suites/tracing/request/template.hbs b/packages/integration-tests/suites/tracing/request/template.hbs
index 9c5d6bd436c0..a6296fe41bac 100644
--- a/packages/integration-tests/suites/tracing/request/template.hbs
+++ b/packages/integration-tests/suites/tracing/request/template.hbs
@@ -1,7 +1,5 @@
 <html>
   <head>
-    <meta charset='utf-8' />
-    <title></title>
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}

From ad1918ddce143a9002b3b76dcebf8462ae9c51eb Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Fri, 11 Feb 2022 19:57:59 +0000
Subject: [PATCH 09/19] Move misplaced script.

---
 .../suites/tracing/metrics/pageload-resource-spans/template.hbs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs b/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs
index 96ad786789fb..c7768b0fb220 100644
--- a/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs
+++ b/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs
@@ -3,9 +3,9 @@
     {{#each htmlWebpackPlugin.options.sentry_bundles}}
       <script src='{{this}}'></script>
     {{/each}}
+    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
     <img src='https://example.com/path/to/image.svg' />
     <script src='https://example.com/path/to/script.js'></script>
     <link href='https://example.com/path/to/style.css' type='text/css' rel='stylesheet' />

From 2897b84d58027e0612d528fcd0a16e878596380e Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Mon, 14 Feb 2022 10:31:24 +0000
Subject: [PATCH 10/19] Update comments.

Co-authored-by: Katie Byers <lobsterkatie@gmail.com>
---
 packages/integration-tests/README.md             | 2 +-
 packages/integration-tests/utils/generatePage.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/integration-tests/README.md b/packages/integration-tests/README.md
index 92045d366b6f..5a3cad128d9a 100644
--- a/packages/integration-tests/README.md
+++ b/packages/integration-tests/README.md
@@ -56,7 +56,7 @@ To filter tests by their title:
 
 You can refer to [Playwright documentation](https://playwright.dev/docs/test-cli) for other CLI options.
 
-You can set env variable `PW_BUNDLE` to set specific `browser` and `tracing` build or bundle to test against.
+You can set env variable `PW_BUNDLE` to set specific build or bundle to test against.
 Available options: `esm`, `dist`, `bundle`, `bundle_min`, `bundle_es6`, `bundle_es6_min`
 
 ### Troubleshooting
diff --git a/packages/integration-tests/utils/generatePage.ts b/packages/integration-tests/utils/generatePage.ts
index 6fe49688a4af..cdd14e0002c4 100644
--- a/packages/integration-tests/utils/generatePage.ts
+++ b/packages/integration-tests/utils/generatePage.ts
@@ -99,7 +99,7 @@ export async function generatePage(
           },
           externals: useBundle
             ? {
-                // To prevent import declarations to override browser bundles.
+                // To help Webpack resolve Sentry modules in `import` statements in cases where they're provided in bundles rather than in `node_modules`
                 '@sentry/browser': 'var Sentry',
                 '@sentry/tracing': 'var Sentry',
                 Integrations: 'var Sentry.Integrations',

From 627de515bfbae997a0ad4e7fb44ab5d58b05b565 Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Mon, 14 Feb 2022 10:44:04 +0000
Subject: [PATCH 11/19] Remove default external types and `Integration`
 external.

---
 packages/integration-tests/utils/generatePage.ts | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/packages/integration-tests/utils/generatePage.ts b/packages/integration-tests/utils/generatePage.ts
index cdd14e0002c4..ae12f1b8bd6f 100644
--- a/packages/integration-tests/utils/generatePage.ts
+++ b/packages/integration-tests/utils/generatePage.ts
@@ -100,9 +100,8 @@ export async function generatePage(
           externals: useBundle
             ? {
                 // To help Webpack resolve Sentry modules in `import` statements in cases where they're provided in bundles rather than in `node_modules`
-                '@sentry/browser': 'var Sentry',
-                '@sentry/tracing': 'var Sentry',
-                Integrations: 'var Sentry.Integrations',
+                '@sentry/browser': 'Sentry',
+                '@sentry/tracing': 'Sentry',
               }
             : {},
           output: {

From a7bc9de318eb397747140c5b09fec2eb8f2c63b2 Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Mon, 14 Feb 2022 11:05:14 +0000
Subject: [PATCH 12/19] Rename `dist`s to `cjs`.

---
 .github/workflows/build.yml                      | 2 +-
 packages/integration-tests/package.json          | 2 +-
 packages/integration-tests/utils/generatePage.ts | 8 ++++----
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index 8dfc1e68897a..f97ab957408b 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -283,7 +283,7 @@ jobs:
       matrix:
         bundle:
           - esm
-          - dist
+          - cjs
           - bundle
           - bundle_min
           - bundle_es6
diff --git a/packages/integration-tests/package.json b/packages/integration-tests/package.json
index 8414879752dc..0ecebf93b887 100644
--- a/packages/integration-tests/package.json
+++ b/packages/integration-tests/package.json
@@ -20,7 +20,7 @@
     "test:bundle:min": "PW_BUNDLE=bundle_min yarn test",
     "test:bundle:es6": "PW_BUNDLE=bundle_es6 yarn test",
     "test:bundle:es6:min": "PW_BUNDLE=bundle_es6_min yarn test",
-    "test:dist": "PW_BUNDLE=dist yarn test",
+    "test:cjs": "PW_BUNDLE=cjs yarn test",
     "test:esm": "PW_BUNDLE=esm yarn test",
     "test:ci": "playwright test ./suites --browser='all' --reporter='line'"
   },
diff --git a/packages/integration-tests/utils/generatePage.ts b/packages/integration-tests/utils/generatePage.ts
index ae12f1b8bd6f..6adaa0fc8b4b 100644
--- a/packages/integration-tests/utils/generatePage.ts
+++ b/packages/integration-tests/utils/generatePage.ts
@@ -10,15 +10,15 @@ const PACKAGE_PATH = '../../packages';
 
 const bundleKey = process.env.PW_BUNDLE;
 
-// `esm` and `dist` builds are modules that can be imported / aliased by webpack
-const useCompiledModule = bundleKey && (bundleKey === 'esm' || bundleKey === 'dist');
+// `esm` and `cjs` builds are modules that can be imported / aliased by webpack
+const useCompiledModule = bundleKey && (bundleKey === 'esm' || bundleKey === 'cjs');
 
 // bundles need to be injected into HTML before Sentry initialization.
 const useBundle = bundleKey && !useCompiledModule;
 
 const BUNDLE_PATHS: Record<string, Record<string, string>> = {
   browser: {
-    dist: 'dist/index.js',
+    cjs: 'dist/index.js',
     esm: 'esm/index.js',
     bundle: 'build/bundle.js',
     bundle_min: 'build/bundle.min.js',
@@ -26,7 +26,7 @@ const BUNDLE_PATHS: Record<string, Record<string, string>> = {
     bundle_es6_min: 'build/bundle.es6.min.js',
   },
   tracing: {
-    dist: 'dist/index.js',
+    cjs: 'dist/index.js',
     esm: 'esm/index.js',
     bundle: 'build/bundle.tracing.js',
     bundle_min: 'build/bundle.tracing.min.js',

From 14cbf6ac5667e517ebe451ed133eeb70fcf29922 Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Mon, 14 Feb 2022 12:52:47 +0000
Subject: [PATCH 13/19] Remove unnecessary check.

---
 packages/integration-tests/utils/generatePage.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/integration-tests/utils/generatePage.ts b/packages/integration-tests/utils/generatePage.ts
index 6adaa0fc8b4b..456cf66ec600 100644
--- a/packages/integration-tests/utils/generatePage.ts
+++ b/packages/integration-tests/utils/generatePage.ts
@@ -11,7 +11,7 @@ const PACKAGE_PATH = '../../packages';
 const bundleKey = process.env.PW_BUNDLE;
 
 // `esm` and `cjs` builds are modules that can be imported / aliased by webpack
-const useCompiledModule = bundleKey && (bundleKey === 'esm' || bundleKey === 'cjs');
+const useCompiledModule = bundleKey === 'esm' || bundleKey === 'cjs';
 
 // bundles need to be injected into HTML before Sentry initialization.
 const useBundle = bundleKey && !useCompiledModule;

From efe3cedece8df57b0a43612b3dabe03404cf78fc Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Mon, 14 Feb 2022 13:18:06 +0000
Subject: [PATCH 14/19] Remove typo.

---
 .../tracing/browsertracing/backgroundtab-pageload/template.hbs   | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs
index 82a07a740839..76b2b4bc8baf 100644
--- a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs
+++ b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs
@@ -6,7 +6,6 @@
     <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
   </head>
   <body>
-    ]
     <button id='go-background'>New Tab</button>
     <script src='{{htmlWebpackPlugin.options.subject}}'></script>
   </body>

From 3687d0cb7fca7e8d4ba0fb780178f0579b54097a Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Sat, 19 Feb 2022 16:28:01 +0000
Subject: [PATCH 15/19] Use a custom webpack plugin to generate scenarios.

---
 packages/integration-tests/package.json       |   1 -
 .../public-api/addBreadcrumb/template.hbs     |  11 --
 .../public-api/captureException/template.hbs  |  11 --
 .../public-api/captureMessage/template.hbs    |  11 --
 .../public-api/configureScope/template.hbs    |  11 --
 .../suites/public-api/setContext/template.hbs |  11 --
 .../suites/public-api/setExtra/template.hbs   |  11 --
 .../suites/public-api/setExtras/template.hbs  |  11 --
 .../suites/public-api/setTag/template.hbs     |  11 --
 .../suites/public-api/setTags/template.hbs    |  11 --
 .../suites/public-api/setUser/template.hbs    |  11 --
 .../public-api/showReportDialog/template.hbs  |  11 --
 .../public-api/startTransaction/template.hbs  |  11 --
 .../suites/public-api/withScope/template.hbs  |  11 --
 .../sessions/start-session/template.hbs       |  12 --
 .../sessions/start-session/template.html      |   8 ++
 .../sessions/update-session/template.hbs      |  13 --
 .../sessions/update-session/template.html     |   9 ++
 .../backgroundtab-custom/template.hbs         |  13 --
 .../backgroundtab-custom/template.html        |   9 ++
 .../backgroundtab-pageload/template.hbs       |  12 --
 .../backgroundtab-pageload/template.html      |   8 ++
 .../tracing/browsertracing/meta/template.hbs  |  12 --
 .../tracing/browsertracing/meta/template.html |   6 +
 .../tracing/browsertracing/template.hbs       |  11 --
 .../metrics/connection-rtt/template.hbs       |  11 --
 .../metrics/connection-rtt/template.html      |   8 ++
 .../pageload-resource-spans/template.hbs      |  14 ---
 .../pageload-resource-spans/template.html     |  11 ++
 .../suites/tracing/metrics/template.hbs       |  12 --
 .../metrics/web-vitals-cls/template.hbs       |  12 --
 .../metrics/web-vitals-cls/template.html      |   8 ++
 .../metrics/web-vitals-fid/template.hbs       |  11 --
 .../metrics/web-vitals-fid/template.html      |   8 ++
 .../metrics/web-vitals-fp-fcp/template.hbs    |  11 --
 .../metrics/web-vitals-fp-fcp/template.html   |   8 ++
 .../metrics/web-vitals-lcp/template.hbs       |  13 --
 .../metrics/web-vitals-lcp/template.html      |   9 ++
 .../metrics/web-vitals-ttfb/template.hbs      |  11 --
 .../metrics/web-vitals-ttfb/template.html     |   8 ++
 .../suites/tracing/request/template.hbs       |  11 --
 .../integration-tests/utils/defaults/init.js  |   0
 .../utils/defaults/subject.js                 |   0
 .../utils/defaults/template.html              |   6 +
 packages/integration-tests/utils/fixtures.ts  |  10 +-
 .../integration-tests/utils/generatePage.ts   |  93 +-------------
 .../integration-tests/utils/generatePlugin.ts | 115 ++++++++++++++++++
 packages/integration-tests/webpack.config.ts  |   5 -
 yarn.lock                                     |  33 +----
 49 files changed, 235 insertions(+), 450 deletions(-)
 delete mode 100644 packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/captureException/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/captureMessage/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/configureScope/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/setContext/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/setExtra/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/setExtras/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/setTag/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/setTags/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/setUser/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/showReportDialog/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/startTransaction/template.hbs
 delete mode 100644 packages/integration-tests/suites/public-api/withScope/template.hbs
 delete mode 100644 packages/integration-tests/suites/sessions/start-session/template.hbs
 create mode 100644 packages/integration-tests/suites/sessions/start-session/template.html
 delete mode 100644 packages/integration-tests/suites/sessions/update-session/template.hbs
 create mode 100644 packages/integration-tests/suites/sessions/update-session/template.html
 delete mode 100644 packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.hbs
 create mode 100644 packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.html
 delete mode 100644 packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs
 create mode 100644 packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.html
 delete mode 100644 packages/integration-tests/suites/tracing/browsertracing/meta/template.hbs
 create mode 100644 packages/integration-tests/suites/tracing/browsertracing/meta/template.html
 delete mode 100644 packages/integration-tests/suites/tracing/browsertracing/template.hbs
 delete mode 100644 packages/integration-tests/suites/tracing/metrics/connection-rtt/template.hbs
 create mode 100644 packages/integration-tests/suites/tracing/metrics/connection-rtt/template.html
 delete mode 100644 packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs
 create mode 100644 packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.html
 delete mode 100644 packages/integration-tests/suites/tracing/metrics/template.hbs
 delete mode 100644 packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.hbs
 create mode 100644 packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.html
 delete mode 100644 packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs
 create mode 100644 packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.html
 delete mode 100644 packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.hbs
 create mode 100644 packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.html
 delete mode 100644 packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.hbs
 create mode 100644 packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.html
 delete mode 100644 packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.hbs
 create mode 100644 packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.html
 delete mode 100644 packages/integration-tests/suites/tracing/request/template.hbs
 create mode 100644 packages/integration-tests/utils/defaults/init.js
 create mode 100644 packages/integration-tests/utils/defaults/subject.js
 create mode 100644 packages/integration-tests/utils/defaults/template.html
 create mode 100644 packages/integration-tests/utils/generatePlugin.ts

diff --git a/packages/integration-tests/package.json b/packages/integration-tests/package.json
index 832019ec5560..cefc8ae2354c 100644
--- a/packages/integration-tests/package.json
+++ b/packages/integration-tests/package.json
@@ -28,7 +28,6 @@
     "@babel/preset-typescript": "^7.16.7",
     "@playwright/test": "^1.17.0",
     "babel-loader": "^8.2.2",
-    "handlebars-loader": "^1.7.1",
     "html-webpack-plugin": "^5.5.0",
     "playwright": "^1.17.1",
     "typescript": "^4.5.2",
diff --git a/packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs b/packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/addBreadcrumb/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/captureException/template.hbs b/packages/integration-tests/suites/public-api/captureException/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/captureException/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/captureMessage/template.hbs b/packages/integration-tests/suites/public-api/captureMessage/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/captureMessage/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/configureScope/template.hbs b/packages/integration-tests/suites/public-api/configureScope/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/configureScope/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/setContext/template.hbs b/packages/integration-tests/suites/public-api/setContext/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/setContext/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/setExtra/template.hbs b/packages/integration-tests/suites/public-api/setExtra/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/setExtra/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/setExtras/template.hbs b/packages/integration-tests/suites/public-api/setExtras/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/setExtras/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/setTag/template.hbs b/packages/integration-tests/suites/public-api/setTag/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/setTag/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/setTags/template.hbs b/packages/integration-tests/suites/public-api/setTags/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/setTags/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/setUser/template.hbs b/packages/integration-tests/suites/public-api/setUser/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/setUser/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/showReportDialog/template.hbs b/packages/integration-tests/suites/public-api/showReportDialog/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/showReportDialog/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/startTransaction/template.hbs b/packages/integration-tests/suites/public-api/startTransaction/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/startTransaction/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/public-api/withScope/template.hbs b/packages/integration-tests/suites/public-api/withScope/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/public-api/withScope/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/sessions/start-session/template.hbs b/packages/integration-tests/suites/sessions/start-session/template.hbs
deleted file mode 100644
index fe17ad6486f8..000000000000
--- a/packages/integration-tests/suites/sessions/start-session/template.hbs
+++ /dev/null
@@ -1,12 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <a id='navigate' href="foo">Navigate</button>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/sessions/start-session/template.html b/packages/integration-tests/suites/sessions/start-session/template.html
new file mode 100644
index 000000000000..56f0ebd79a95
--- /dev/null
+++ b/packages/integration-tests/suites/sessions/start-session/template.html
@@ -0,0 +1,8 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <a id='navigate' href="foo">Navigate</button>
+  </body>
+</html>
diff --git a/packages/integration-tests/suites/sessions/update-session/template.hbs b/packages/integration-tests/suites/sessions/update-session/template.hbs
deleted file mode 100644
index 723bb824a906..000000000000
--- a/packages/integration-tests/suites/sessions/update-session/template.hbs
+++ /dev/null
@@ -1,13 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <button id='throw-error'>Throw Error</button>
-    <button id='capture-exception'>Capture Exception</button>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/sessions/update-session/template.html b/packages/integration-tests/suites/sessions/update-session/template.html
new file mode 100644
index 000000000000..9c47c4b43402
--- /dev/null
+++ b/packages/integration-tests/suites/sessions/update-session/template.html
@@ -0,0 +1,9 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <button id="throw-error">Throw Error</button>
+    <button id="capture-exception">Capture Exception</button>
+  </body>
+</html>
diff --git a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.hbs b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.hbs
deleted file mode 100644
index e03b8e9a498f..000000000000
--- a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.hbs
+++ /dev/null
@@ -1,13 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <button id='start-transaction'>Start Transaction</button>
-    <button id='go-background'>New Tab</button>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.html b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.html
new file mode 100644
index 000000000000..01d89ea55e60
--- /dev/null
+++ b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-custom/template.html
@@ -0,0 +1,9 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <button id="start-transaction">Start Transaction</button>
+    <button id="go-background">New Tab</button>
+  </body>
+</html>
diff --git a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs
deleted file mode 100644
index 76b2b4bc8baf..000000000000
--- a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.hbs
+++ /dev/null
@@ -1,12 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <button id='go-background'>New Tab</button>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.html b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.html
new file mode 100644
index 000000000000..b92533a08f01
--- /dev/null
+++ b/packages/integration-tests/suites/tracing/browsertracing/backgroundtab-pageload/template.html
@@ -0,0 +1,8 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <button id="go-background">New Tab</button>
+  </body>
+</html>
diff --git a/packages/integration-tests/suites/tracing/browsertracing/meta/template.hbs b/packages/integration-tests/suites/tracing/browsertracing/meta/template.hbs
deleted file mode 100644
index e18095698cc9..000000000000
--- a/packages/integration-tests/suites/tracing/browsertracing/meta/template.hbs
+++ /dev/null
@@ -1,12 +0,0 @@
-<html>
-  <head>
-    <meta name='sentry-trace' content='12312012123120121231201212312012-1121201211212012-1' />
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/browsertracing/meta/template.html b/packages/integration-tests/suites/tracing/browsertracing/meta/template.html
new file mode 100644
index 000000000000..0afff8864522
--- /dev/null
+++ b/packages/integration-tests/suites/tracing/browsertracing/meta/template.html
@@ -0,0 +1,6 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta name="sentry-trace" content="12312012123120121231201212312012-1121201211212012-1" />
+  </head>
+</html>
diff --git a/packages/integration-tests/suites/tracing/browsertracing/template.hbs b/packages/integration-tests/suites/tracing/browsertracing/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/tracing/browsertracing/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/connection-rtt/template.hbs b/packages/integration-tests/suites/tracing/metrics/connection-rtt/template.hbs
deleted file mode 100644
index d4155a96ad59..000000000000
--- a/packages/integration-tests/suites/tracing/metrics/connection-rtt/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <div>Rendered</div>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/connection-rtt/template.html b/packages/integration-tests/suites/tracing/metrics/connection-rtt/template.html
new file mode 100644
index 000000000000..ae6d3eaf7b5c
--- /dev/null
+++ b/packages/integration-tests/suites/tracing/metrics/connection-rtt/template.html
@@ -0,0 +1,8 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <div>Rendered</div>
+  </body>
+</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs b/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs
deleted file mode 100644
index c7768b0fb220..000000000000
--- a/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.hbs
+++ /dev/null
@@ -1,14 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <img src='https://example.com/path/to/image.svg' />
-    <script src='https://example.com/path/to/script.js'></script>
-    <link href='https://example.com/path/to/style.css' type='text/css' rel='stylesheet' />
-    <span>Rendered</span>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.html b/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.html
new file mode 100644
index 000000000000..7f1041910665
--- /dev/null
+++ b/packages/integration-tests/suites/tracing/metrics/pageload-resource-spans/template.html
@@ -0,0 +1,11 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <img src="https://example.com/path/to/image.svg" />
+    <script src="https://example.com/path/to/script.js"></script>
+    <link href="https://example.com/path/to/style.css" type="text/css" rel="stylesheet" />
+    <span>Rendered</span>
+  </body>
+</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/template.hbs b/packages/integration-tests/suites/tracing/metrics/template.hbs
deleted file mode 100644
index dead770cd92e..000000000000
--- a/packages/integration-tests/suites/tracing/metrics/template.hbs
+++ /dev/null
@@ -1,12 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-    <span>Rendered</span>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.hbs b/packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.hbs
deleted file mode 100644
index 0723a6c18621..000000000000
--- a/packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.hbs
+++ /dev/null
@@ -1,12 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <div id='content'></div>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.html b/packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.html
new file mode 100644
index 000000000000..f778ca4d3726
--- /dev/null
+++ b/packages/integration-tests/suites/tracing/metrics/web-vitals-cls/template.html
@@ -0,0 +1,8 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <div id="content"></div>
+  </body>
+</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs b/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs
deleted file mode 100644
index 54e0a4dd730f..000000000000
--- a/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <button id='fid-btn' onclick="console.log('foo')">BTN</button>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.html b/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.html
new file mode 100644
index 000000000000..424014a6e194
--- /dev/null
+++ b/packages/integration-tests/suites/tracing/metrics/web-vitals-fid/template.html
@@ -0,0 +1,8 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <button id="fid-btn" onclick="console.log('foo')">BTN</button>
+  </body>
+</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.hbs b/packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.hbs
deleted file mode 100644
index d4155a96ad59..000000000000
--- a/packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <div>Rendered</div>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.html b/packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.html
new file mode 100644
index 000000000000..ae6d3eaf7b5c
--- /dev/null
+++ b/packages/integration-tests/suites/tracing/metrics/web-vitals-fp-fcp/template.html
@@ -0,0 +1,8 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <div>Rendered</div>
+  </body>
+</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.hbs b/packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.hbs
deleted file mode 100644
index 0daa19ebdd61..000000000000
--- a/packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.hbs
+++ /dev/null
@@ -1,13 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <div id='content'></div>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-    <img src='https://example.com/path/to/image.png' />
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.html b/packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.html
new file mode 100644
index 000000000000..2605d0a2595e
--- /dev/null
+++ b/packages/integration-tests/suites/tracing/metrics/web-vitals-lcp/template.html
@@ -0,0 +1,9 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <div id="content"></div>
+    <img src="https://example.com/path/to/image.png" />
+  </body>
+</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.hbs b/packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.hbs
deleted file mode 100644
index d4155a96ad59..000000000000
--- a/packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <div>Rendered</div>
-  </body>
-</html>
diff --git a/packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.html b/packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.html
new file mode 100644
index 000000000000..ae6d3eaf7b5c
--- /dev/null
+++ b/packages/integration-tests/suites/tracing/metrics/web-vitals-ttfb/template.html
@@ -0,0 +1,8 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <div>Rendered</div>
+  </body>
+</html>
diff --git a/packages/integration-tests/suites/tracing/request/template.hbs b/packages/integration-tests/suites/tracing/request/template.hbs
deleted file mode 100644
index a6296fe41bac..000000000000
--- a/packages/integration-tests/suites/tracing/request/template.hbs
+++ /dev/null
@@ -1,11 +0,0 @@
-<html>
-  <head>
-    {{#each htmlWebpackPlugin.options.sentry_bundles}}
-      <script src='{{this}}'></script>
-    {{/each}}
-    <script src='{{htmlWebpackPlugin.options.initialization}}'></script>
-  </head>
-  <body>
-    <script src='{{htmlWebpackPlugin.options.subject}}'></script>
-  </body>
-</html>
diff --git a/packages/integration-tests/utils/defaults/init.js b/packages/integration-tests/utils/defaults/init.js
new file mode 100644
index 000000000000..e69de29bb2d1
diff --git a/packages/integration-tests/utils/defaults/subject.js b/packages/integration-tests/utils/defaults/subject.js
new file mode 100644
index 000000000000..e69de29bb2d1
diff --git a/packages/integration-tests/utils/defaults/template.html b/packages/integration-tests/utils/defaults/template.html
new file mode 100644
index 000000000000..132155c6a181
--- /dev/null
+++ b/packages/integration-tests/utils/defaults/template.html
@@ -0,0 +1,6 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body></body>
+</html>
diff --git a/packages/integration-tests/utils/fixtures.ts b/packages/integration-tests/utils/fixtures.ts
index 327bfa540252..91bdb75f738f 100644
--- a/packages/integration-tests/utils/fixtures.ts
+++ b/packages/integration-tests/utils/fixtures.ts
@@ -11,7 +11,13 @@ const getAsset = (assetDir: string, asset: string): string => {
     return assetPath;
   }
 
-  return `${path.dirname(assetDir)}/${asset}`;
+  const upperDirAssetPath = `${path.dirname(assetDir)}/${asset}`;
+
+  if (fs.existsSync(upperDirAssetPath)) {
+    return upperDirAssetPath;
+  }
+
+  return `utils/defaults/${asset}`;
 };
 
 export type TestOptions = {
@@ -33,7 +39,7 @@ const sentryTest = base.extend<TestFixtures>({
       if (!fs.existsSync(pagePath)) {
         const testDir = path.dirname(testInfo.file);
         const subject = getAsset(testDir, 'subject.js');
-        const template = getAsset(testDir, 'template.hbs');
+        const template = getAsset(testDir, 'template.html');
         const init = getAsset(testDir, 'init.js');
 
         await generatePage(init, subject, template, testDir);
diff --git a/packages/integration-tests/utils/generatePage.ts b/packages/integration-tests/utils/generatePage.ts
index 456cf66ec600..fea623129e93 100644
--- a/packages/integration-tests/utils/generatePage.ts
+++ b/packages/integration-tests/utils/generatePage.ts
@@ -1,75 +1,9 @@
-import { Package } from '@sentry/types';
-import { existsSync, mkdirSync, promises } from 'fs';
+import { existsSync, mkdirSync } from 'fs';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
-import path from 'path';
 import webpack from 'webpack';
 
 import webpackConfig from '../webpack.config';
-
-const PACKAGE_PATH = '../../packages';
-
-const bundleKey = process.env.PW_BUNDLE;
-
-// `esm` and `cjs` builds are modules that can be imported / aliased by webpack
-const useCompiledModule = bundleKey === 'esm' || bundleKey === 'cjs';
-
-// bundles need to be injected into HTML before Sentry initialization.
-const useBundle = bundleKey && !useCompiledModule;
-
-const BUNDLE_PATHS: Record<string, Record<string, string>> = {
-  browser: {
-    cjs: 'dist/index.js',
-    esm: 'esm/index.js',
-    bundle: 'build/bundle.js',
-    bundle_min: 'build/bundle.min.js',
-    bundle_es6: 'build/bundle.es6.js',
-    bundle_es6_min: 'build/bundle.es6.min.js',
-  },
-  tracing: {
-    cjs: 'dist/index.js',
-    esm: 'esm/index.js',
-    bundle: 'build/bundle.tracing.js',
-    bundle_min: 'build/bundle.tracing.min.js',
-    // `tracing` doesn't have an es6 build
-    bundle_es6: 'build/bundle.tracing.js',
-    bundle_es6_min: 'build/bundle.tracing.min.js',
-  },
-};
-
-/**
- * Generate webpack aliases based on packages in monorepo
- * Example of an alias: '@sentry/serverless': 'path/to/sentry-javascript/packages/serverless',
- */
-async function generateSentryAlias(): Promise<Record<string, string>> {
-  const dirents = (await promises.readdir(PACKAGE_PATH, { withFileTypes: true }))
-    .filter(dirent => dirent.isDirectory())
-    .map(dir => dir.name);
-
-  return Object.fromEntries(
-    await Promise.all(
-      dirents.map(async d => {
-        const packageJSON: Package = JSON.parse(
-          (await promises.readFile(path.resolve(PACKAGE_PATH, d, 'package.json'), { encoding: 'utf-8' })).toString(),
-        );
-
-        const modulePath = path.resolve(PACKAGE_PATH, d);
-
-        if (useCompiledModule && bundleKey && BUNDLE_PATHS[d]?.[bundleKey]) {
-          const bundlePath = path.resolve(modulePath, BUNDLE_PATHS[d][bundleKey]);
-
-          return [packageJSON['name'], bundlePath];
-        }
-
-        if (useBundle && bundleKey && BUNDLE_PATHS[d]?.[bundleKey]) {
-          // If we're injecting a bundle, ignore the webpack import.
-          return [packageJSON['name'], false];
-        }
-
-        return [packageJSON['name'], modulePath];
-      }),
-    ),
-  );
-}
+import SentryScenarioGenerationPlugin from './generatePlugin';
 
 export async function generatePage(
   initializationPath: string,
@@ -80,8 +14,6 @@ export async function generatePage(
   const localPath = `${outPath}/dist`;
   const bundlePath = `${localPath}/index.html`;
 
-  const alias = await generateSentryAlias();
-
   if (!existsSync(localPath)) {
     mkdirSync(localPath, { recursive: true });
   }
@@ -90,37 +22,20 @@ export async function generatePage(
     await new Promise<void>((resolve, reject) => {
       const compiler = webpack(
         webpackConfig({
-          resolve: {
-            alias,
-          },
           entry: {
             initialization: initializationPath,
             subject: subjectPath,
           },
-          externals: useBundle
-            ? {
-                // To help Webpack resolve Sentry modules in `import` statements in cases where they're provided in bundles rather than in `node_modules`
-                '@sentry/browser': 'Sentry',
-                '@sentry/tracing': 'Sentry',
-              }
-            : {},
           output: {
             path: localPath,
             filename: '[name].bundle.js',
           },
           plugins: [
+            new SentryScenarioGenerationPlugin(),
             new HtmlWebpackPlugin({
               filename: 'index.html',
               template: templatePath,
-              sentry_bundles:
-                useBundle && bundleKey
-                  ? ['browser', 'tracing'].map(sentryPackage =>
-                      path.resolve(PACKAGE_PATH, sentryPackage, BUNDLE_PATHS[sentryPackage][bundleKey]),
-                    )
-                  : [],
-              initialization: 'initialization.bundle.js',
-              subject: 'subject.bundle.js',
-              inject: false,
+              inject: 'body',
             }),
           ],
         }),
diff --git a/packages/integration-tests/utils/generatePlugin.ts b/packages/integration-tests/utils/generatePlugin.ts
new file mode 100644
index 000000000000..ee379654b42e
--- /dev/null
+++ b/packages/integration-tests/utils/generatePlugin.ts
@@ -0,0 +1,115 @@
+import { Package } from '@sentry/types';
+import { readdirSync, readFileSync } from 'fs';
+import HtmlWebpackPlugin, { createHtmlTagObject } from 'html-webpack-plugin';
+import path from 'path';
+import { Compiler } from 'webpack';
+
+const PACKAGE_PATH = '../../packages';
+
+const bundleKey = process.env.PW_BUNDLE;
+
+// `esm` and `cjs` builds are modules that can be imported / aliased by webpack
+const useCompiledModule = bundleKey === 'esm' || bundleKey === 'cjs';
+
+// Bundles need to be injected into HTML before Sentry initialization.
+const useBundle = bundleKey && !useCompiledModule;
+
+const BUNDLE_PATHS: Record<string, Record<string, string>> = {
+  browser: {
+    cjs: 'dist/index.js',
+    esm: 'esm/index.js',
+    bundle: 'build/bundle.js',
+    bundle_min: 'build/bundle.min.js',
+    bundle_es6: 'build/bundle.es6.js',
+    bundle_es6_min: 'build/bundle.es6.min.js',
+  },
+  tracing: {
+    cjs: 'dist/index.js',
+    esm: 'esm/index.js',
+    bundle: 'build/bundle.tracing.js',
+    bundle_min: 'build/bundle.tracing.min.js',
+    // `tracing` doesn't have an es6 build
+    bundle_es6: 'build/bundle.tracing.js',
+    bundle_es6_min: 'build/bundle.tracing.min.js',
+  },
+};
+
+/**
+ * Generate webpack aliases based on packages in monorepo
+ * Example of an alias: '@sentry/serverless': 'path/to/sentry-javascript/packages/serverless',
+ */
+function generateSentryAlias(): Record<string, string> {
+  const dirents = readdirSync(PACKAGE_PATH, { withFileTypes: true })
+    .filter(dirent => dirent.isDirectory())
+    .map(dir => dir.name);
+
+  return Object.fromEntries(
+    dirents.map(d => {
+      const packageJSON: Package = JSON.parse(
+        readFileSync(path.resolve(PACKAGE_PATH, d, 'package.json'), { encoding: 'utf-8' }).toString(),
+      );
+
+      const modulePath = path.resolve(PACKAGE_PATH, d);
+
+      if (useCompiledModule && bundleKey && BUNDLE_PATHS[d]?.[bundleKey]) {
+        const bundlePath = path.resolve(modulePath, BUNDLE_PATHS[d][bundleKey]);
+
+        return [packageJSON['name'], bundlePath];
+      }
+
+      if (useBundle && bundleKey && BUNDLE_PATHS[d]?.[bundleKey]) {
+        // If we're injecting a bundle, ignore the webpack import.
+        return [packageJSON['name'], false];
+      }
+
+      return [packageJSON['name'], modulePath];
+    }),
+  );
+}
+
+class SentryScenarioGenerationPlugin {
+  public requiresTracing: boolean = false;
+
+  private _name: string = 'SentryScenarioGenerationPlugin';
+
+  public apply(compiler: Compiler): void {
+    compiler.options.resolve.alias = generateSentryAlias();
+    compiler.options.externals =
+      useBundle && bundleKey
+        ? {
+            // To help Webpack resolve Sentry modules in `import` statements in cases where they're provided in bundles rather than in `node_modules`
+            '@sentry/browser': 'Sentry',
+            '@sentry/tracing': 'Sentry',
+          }
+        : {};
+
+    // Checking if the current scenario has imported `@sentry/tracing`.
+    compiler.hooks.normalModuleFactory.tap(this._name, factory => {
+      factory.hooks.parser.for('javascript/auto').tap(this._name, parser => {
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+        parser.hooks.import.tap(this._name, (_statement: unknown, source: string) => {
+          if (source === '@sentry/tracing') {
+            this.requiresTracing = true;
+          }
+        });
+      });
+    });
+
+    compiler.hooks.compilation.tap(this._name, compilation => {
+      HtmlWebpackPlugin.getHooks(compilation).alterAssetTags.tapAsync(this._name, (data, cb) => {
+        if (useBundle && bundleKey) {
+          const bundleName = this.requiresTracing ? 'tracing' : 'browser';
+          const bundleObject = createHtmlTagObject('script', {
+            src: path.resolve(PACKAGE_PATH, bundleName, BUNDLE_PATHS[bundleName][bundleKey]),
+          });
+
+          data.assetTags.scripts.unshift(bundleObject);
+        }
+
+        cb(null, data);
+      });
+    });
+  }
+}
+
+export default SentryScenarioGenerationPlugin;
diff --git a/packages/integration-tests/webpack.config.ts b/packages/integration-tests/webpack.config.ts
index b74f04fd8226..ff065a044208 100644
--- a/packages/integration-tests/webpack.config.ts
+++ b/packages/integration-tests/webpack.config.ts
@@ -12,11 +12,6 @@ const config = function (userConfig: Record<string, unknown>): Configuration {
           loader: 'babel-loader',
           options: { presets: [['@babel/preset-typescript', { allowNamespaces: true }]] },
         },
-        {
-          test: /\.hbs$/,
-          exclude: /node_modules/,
-          loader: 'handlebars-loader',
-        },
       ],
     },
     stats: 'errors-only',
diff --git a/yarn.lock b/yarn.lock
index 41816a01776f..621091edc1a2 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5013,7 +5013,7 @@ async@^3.0.1:
   resolved "https://registry.yarnpkg.com/async/-/async-3.2.0.tgz#b3a2685c5ebb641d3de02d161002c60fc9f85720"
   integrity sha512-TR2mEZFVOj2pLStYxLht7TyfuRzaydfpxr3k9RpHIzMgw7A64dzsdqCxH1WJyQdoe8T10nDXd9wnEigmiuHIZw==
 
-async@~0.2.10, async@~0.2.9:
+async@~0.2.9:
   version "0.2.10"
   resolved "https://registry.yarnpkg.com/async/-/async-0.2.10.tgz#b6bbe0b0674b9d719708ca38de8c237cb526c3d1"
   integrity sha1-trvgsGdLnXGXCMo43owjfLUmw9E=
@@ -5894,11 +5894,6 @@ better-assert@~1.0.0:
   dependencies:
     callsite "1.0.0"
 
-big.js@^3.1.3:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/big.js/-/big.js-3.2.0.tgz#a5fc298b81b9e0dca2e458824784b65c52ba588e"
-  integrity sha512-+hN/Zh2D08Mx65pZ/4g5bsmNiZUuChDiQfTUQ7qJr4/kuopCr88xZsAXv6mBoZEsUI4OuGHlX59qE94K2mMW8Q==
-
 big.js@^5.2.2:
   version "5.2.2"
   resolved "https://registry.yarnpkg.com/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328"
@@ -10624,11 +10619,6 @@ fast-text-encoding@^1.0.0, fast-text-encoding@^1.0.3:
   resolved "https://registry.yarnpkg.com/fast-text-encoding/-/fast-text-encoding-1.0.3.tgz#ec02ac8e01ab8a319af182dae2681213cfe9ce53"
   integrity sha512-dtm4QZH9nZtcDt8qJiOH9fcQd1NAgi+K1O2DbE6GG1PPCK/BWfOH3idCTRQ4ImXRUOyopDEgDEnVEE7Y/2Wrig==
 
-fastparse@^1.0.0:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/fastparse/-/fastparse-1.1.2.tgz#91728c5a5942eced8531283c79441ee4122c35a9"
-  integrity sha512-483XLLxTVIwWK3QTrMGRqUfUpoOs/0hbQrl2oz4J0pAcm3A3bu84wxTFqGqkJzewCLdME38xJLJAxBABfQT8sQ==
-
 fastq@^1.6.0:
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.11.0.tgz#bb9fb955a07130a918eb63c1f5161cc32a5d0858"
@@ -11838,16 +11828,6 @@ gzip-size@^6.0.0:
   dependencies:
     duplexer "^0.1.2"
 
-handlebars-loader@^1.7.1:
-  version "1.7.1"
-  resolved "https://registry.yarnpkg.com/handlebars-loader/-/handlebars-loader-1.7.1.tgz#07088f09d8a559344908f7c88c68c0ffdacc555d"
-  integrity sha512-Q+Z/hDPQzU8ZTlVnAe/0T1LHABlyhL7opNcSKcQDhmUXK2ByGTqib1Z2Tfv4Ic50WqDcLFWQcOb3mhjcBRbscQ==
-  dependencies:
-    async "~0.2.10"
-    fastparse "^1.0.0"
-    loader-utils "1.0.x"
-    object-assign "^4.1.0"
-
 handlebars@^4.0.1, handlebars@^4.0.4, handlebars@^4.3.1, handlebars@^4.7.3, handlebars@^4.7.6:
   version "4.7.7"
   resolved "https://registry.yarnpkg.com/handlebars/-/handlebars-4.7.7.tgz#9ce33416aad02dbd6c8fafa8240d5d98004945a1"
@@ -14020,7 +14000,7 @@ json5@2.x, json5@^2.1.2:
   dependencies:
     minimist "^1.2.5"
 
-json5@^0.5.0, json5@^0.5.1:
+json5@^0.5.1:
   version "0.5.1"
   resolved "https://registry.yarnpkg.com/json5/-/json5-0.5.1.tgz#1eade7acc012034ad84e2396767ead9fa5495821"
   integrity sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE=
@@ -14523,15 +14503,6 @@ loader-runner@^4.2.0:
   resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-4.2.0.tgz#d7022380d66d14c5fb1d496b89864ebcfd478384"
   integrity sha512-92+huvxMvYlMzMt0iIOukcwYBFpkYJdpl2xsZ7LrlayO7E8SOv+JJUEK17B/dJIHAOLMfh2dZZ/Y18WgmGtYNw==
 
-loader-utils@1.0.x:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.0.4.tgz#13f56197f1523a305891248b4c7244540848426c"
-  integrity sha1-E/Vhl/FSOjBYkSSLTHJEVAhIQmw=
-  dependencies:
-    big.js "^3.1.3"
-    emojis-list "^2.0.0"
-    json5 "^0.5.0"
-
 loader-utils@1.2.3:
   version "1.2.3"
   resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.2.3.tgz#1ff5dc6911c9f0a062531a4c04b609406108c2c7"

From f69b8a9f175e7d4424c4c81a89b7f79381238cb1 Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Mon, 21 Feb 2022 09:46:04 +0000
Subject: [PATCH 16/19] Run tracing-only bundle tests.

---
 .github/workflows/build.yml                        | 11 ++++++++++-
 packages/integration-tests/utils/generatePlugin.ts |  3 ++-
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index f97ab957408b..1f4f195cf3bc 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -276,7 +276,7 @@ jobs:
             ${{ github.workspace }}/packages/serverless/dist-awslambda-layer/*.zip
 
   job_browser_playwright_tests:
-    name: Browser Playwright Tests (${{ matrix.bundle }})
+    name: Browser Playwright Tests (${{ matrix.bundle }} - tracing_only = ${{ matrix.tracing_only }})
     needs: job_build
     runs-on: ubuntu-latest
     strategy:
@@ -288,6 +288,14 @@ jobs:
           - bundle_min
           - bundle_es6
           - bundle_es6_min
+        tracing_only:
+          - true
+          - false
+        exclude:
+          - bundle: esm
+            tracing_only: true
+          - bundle: cjs
+            tracing_only: true
     steps:
       - name: Check out current commit (${{ github.sha }})
         uses: actions/checkout@v2
@@ -308,6 +316,7 @@ jobs:
       - name: Run Playwright tests
         env:
           PW_BUNDLE: ${{ matrix.bundle }}
+          PW_TRACING_ONLY: ${{ matrix.tracing_only }}
         run: |
           cd packages/integration-tests
           yarn run playwright install-deps webkit
diff --git a/packages/integration-tests/utils/generatePlugin.ts b/packages/integration-tests/utils/generatePlugin.ts
index ee379654b42e..5b6d1f3d0ecd 100644
--- a/packages/integration-tests/utils/generatePlugin.ts
+++ b/packages/integration-tests/utils/generatePlugin.ts
@@ -6,6 +6,7 @@ import { Compiler } from 'webpack';
 
 const PACKAGE_PATH = '../../packages';
 
+const tracingOnly = process.env.PW_TRACING_ONLY === 'true';
 const bundleKey = process.env.PW_BUNDLE;
 
 // `esm` and `cjs` builds are modules that can be imported / aliased by webpack
@@ -98,7 +99,7 @@ class SentryScenarioGenerationPlugin {
     compiler.hooks.compilation.tap(this._name, compilation => {
       HtmlWebpackPlugin.getHooks(compilation).alterAssetTags.tapAsync(this._name, (data, cb) => {
         if (useBundle && bundleKey) {
-          const bundleName = this.requiresTracing ? 'tracing' : 'browser';
+          const bundleName = tracingOnly || this.requiresTracing ? 'tracing' : 'browser';
           const bundleObject = createHtmlTagObject('script', {
             src: path.resolve(PACKAGE_PATH, bundleName, BUNDLE_PATHS[bundleName][bundleKey]),
           });

From 69ae75af9bbfcb806183563ab4958b68436ed15e Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Thu, 24 Feb 2022 21:46:34 +0000
Subject: [PATCH 17/19] Address review comments.

---
 .github/workflows/build.yml                   |  4 +-
 packages/integration-tests/README.md          |  2 +-
 packages/integration-tests/package.json       |  4 +-
 packages/integration-tests/utils/fixtures.ts  |  6 +--
 .../integration-tests/utils/generatePlugin.ts | 44 +++++++++++--------
 5 files changed, 34 insertions(+), 26 deletions(-)

diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index 1f4f195cf3bc..d35d83396317 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -284,8 +284,8 @@ jobs:
         bundle:
           - esm
           - cjs
-          - bundle
-          - bundle_min
+          - bundle_es5
+          - bundle_es5_min
           - bundle_es6
           - bundle_es6_min
         tracing_only:
diff --git a/packages/integration-tests/README.md b/packages/integration-tests/README.md
index 5a3cad128d9a..47aa171cec21 100644
--- a/packages/integration-tests/README.md
+++ b/packages/integration-tests/README.md
@@ -57,7 +57,7 @@ To filter tests by their title:
 You can refer to [Playwright documentation](https://playwright.dev/docs/test-cli) for other CLI options.
 
 You can set env variable `PW_BUNDLE` to set specific build or bundle to test against.
-Available options: `esm`, `dist`, `bundle`, `bundle_min`, `bundle_es6`, `bundle_es6_min`
+Available options: `esm`, `cjs`, `bundle_es5`, `bundle_es5_min`, `bundle_es6`, `bundle_es6_min`
 
 ### Troubleshooting
 
diff --git a/packages/integration-tests/package.json b/packages/integration-tests/package.json
index 836e374a2a48..daaace6ea9b8 100644
--- a/packages/integration-tests/package.json
+++ b/packages/integration-tests/package.json
@@ -16,8 +16,8 @@
     "type-check": "tsc",
     "pretest": "yarn clean && yarn type-check",
     "test": "playwright test ./suites",
-    "test:bundle": "PW_BUNDLE=bundle yarn test",
-    "test:bundle:min": "PW_BUNDLE=bundle_min yarn test",
+    "test:bundle:es5": "PW_BUNDLE=bundle_es5 yarn test",
+    "test:bundle:es5:min": "PW_BUNDLE=bundle_es5_min yarn test",
     "test:bundle:es6": "PW_BUNDLE=bundle_es6 yarn test",
     "test:bundle:es6:min": "PW_BUNDLE=bundle_es6_min yarn test",
     "test:cjs": "PW_BUNDLE=cjs yarn test",
diff --git a/packages/integration-tests/utils/fixtures.ts b/packages/integration-tests/utils/fixtures.ts
index 91bdb75f738f..845a7637b177 100644
--- a/packages/integration-tests/utils/fixtures.ts
+++ b/packages/integration-tests/utils/fixtures.ts
@@ -11,10 +11,10 @@ const getAsset = (assetDir: string, asset: string): string => {
     return assetPath;
   }
 
-  const upperDirAssetPath = `${path.dirname(assetDir)}/${asset}`;
+  const parentDirAssetPath = `${path.dirname(assetDir)}/${asset}`;
 
-  if (fs.existsSync(upperDirAssetPath)) {
-    return upperDirAssetPath;
+  if (fs.existsSync(parentDirAssetPath)) {
+    return parentDirAssetPath;
   }
 
   return `utils/defaults/${asset}`;
diff --git a/packages/integration-tests/utils/generatePlugin.ts b/packages/integration-tests/utils/generatePlugin.ts
index 5b6d1f3d0ecd..e2eb4484e071 100644
--- a/packages/integration-tests/utils/generatePlugin.ts
+++ b/packages/integration-tests/utils/generatePlugin.ts
@@ -4,7 +4,7 @@ import HtmlWebpackPlugin, { createHtmlTagObject } from 'html-webpack-plugin';
 import path from 'path';
 import { Compiler } from 'webpack';
 
-const PACKAGE_PATH = '../../packages';
+const PACKAGES_DIR = '../../packages';
 
 const tracingOnly = process.env.PW_TRACING_ONLY === 'true';
 const bundleKey = process.env.PW_BUNDLE;
@@ -19,47 +19,54 @@ const BUNDLE_PATHS: Record<string, Record<string, string>> = {
   browser: {
     cjs: 'dist/index.js',
     esm: 'esm/index.js',
-    bundle: 'build/bundle.js',
-    bundle_min: 'build/bundle.min.js',
+    bundle_es5: 'build/bundle.js',
+    bundle_es5_min: 'build/bundle.min.js',
     bundle_es6: 'build/bundle.es6.js',
     bundle_es6_min: 'build/bundle.es6.min.js',
   },
   tracing: {
     cjs: 'dist/index.js',
     esm: 'esm/index.js',
-    bundle: 'build/bundle.tracing.js',
-    bundle_min: 'build/bundle.tracing.min.js',
-    // `tracing` doesn't have an es6 build
+    bundle_es5: 'build/bundle.tracing.js',
+    bundle_es5_min: 'build/bundle.tracing.min.js',
+    // `tracing` doesn't have an es6 build yet
     bundle_es6: 'build/bundle.tracing.js',
     bundle_es6_min: 'build/bundle.tracing.min.js',
   },
 };
 
-/**
+/*
  * Generate webpack aliases based on packages in monorepo
- * Example of an alias: '@sentry/serverless': 'path/to/sentry-javascript/packages/serverless',
+ *
+ * When using compiled versions of the tracing and browser packages, their aliases look for example like
+ *     '@sentry/browser': 'path/to/sentry-javascript/packages/browser/esm/index.js'
+ * When using bundled versions of the tracing and browser packages, their aliases look for example like
+ *     '@sentry/browser': false
+ * so that the compiled versions aren't included
+ * All other packages are aliased for example like
+ *     '@sentry/serverless': 'path/to/sentry-javascript/packages/serverless'
  */
 function generateSentryAlias(): Record<string, string> {
-  const dirents = readdirSync(PACKAGE_PATH, { withFileTypes: true })
+  const packageNames = readdirSync(PACKAGES_DIR, { withFileTypes: true })
     .filter(dirent => dirent.isDirectory())
     .map(dir => dir.name);
 
   return Object.fromEntries(
-    dirents.map(d => {
+    packageNames.map(packageName => {
       const packageJSON: Package = JSON.parse(
-        readFileSync(path.resolve(PACKAGE_PATH, d, 'package.json'), { encoding: 'utf-8' }).toString(),
+        readFileSync(path.resolve(PACKAGES_DIR, packageName, 'package.json'), { encoding: 'utf-8' }).toString(),
       );
 
-      const modulePath = path.resolve(PACKAGE_PATH, d);
+      const modulePath = path.resolve(PACKAGES_DIR, packageName);
 
-      if (useCompiledModule && bundleKey && BUNDLE_PATHS[d]?.[bundleKey]) {
-        const bundlePath = path.resolve(modulePath, BUNDLE_PATHS[d][bundleKey]);
+      if (useCompiledModule && bundleKey && BUNDLE_PATHS[packageName]?.[bundleKey]) {
+        const bundlePath = path.resolve(modulePath, BUNDLE_PATHS[packageName][bundleKey]);
 
         return [packageJSON['name'], bundlePath];
       }
 
-      if (useBundle && bundleKey && BUNDLE_PATHS[d]?.[bundleKey]) {
-        // If we're injecting a bundle, ignore the webpack import.
+      if (useBundle && bundleKey) {
+        // If we're injecting a bundle, ignore the webpack imports.
         return [packageJSON['name'], false];
       }
 
@@ -99,9 +106,10 @@ class SentryScenarioGenerationPlugin {
     compiler.hooks.compilation.tap(this._name, compilation => {
       HtmlWebpackPlugin.getHooks(compilation).alterAssetTags.tapAsync(this._name, (data, cb) => {
         if (useBundle && bundleKey) {
-          const bundleName = tracingOnly || this.requiresTracing ? 'tracing' : 'browser';
+          const useTracingBundle = tracingOnly || this.requiresTracing;
+          const bundleName = useTracingBundle ? 'tracing' : 'browser';
           const bundleObject = createHtmlTagObject('script', {
-            src: path.resolve(PACKAGE_PATH, bundleName, BUNDLE_PATHS[bundleName][bundleKey]),
+            src: path.resolve(PACKAGES_DIR, bundleName, BUNDLE_PATHS[bundleName][bundleKey]),
           });
 
           data.assetTags.scripts.unshift(bundleObject);

From 2c0f8aab74e59de61f64545707a3787bfe7bd1d0 Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Thu, 24 Feb 2022 22:45:57 +0000
Subject: [PATCH 18/19] Remove unused default assets.

---
 packages/integration-tests/utils/defaults/init.js    | 0
 packages/integration-tests/utils/defaults/subject.js | 0
 2 files changed, 0 insertions(+), 0 deletions(-)
 delete mode 100644 packages/integration-tests/utils/defaults/init.js
 delete mode 100644 packages/integration-tests/utils/defaults/subject.js

diff --git a/packages/integration-tests/utils/defaults/init.js b/packages/integration-tests/utils/defaults/init.js
deleted file mode 100644
index e69de29bb2d1..000000000000
diff --git a/packages/integration-tests/utils/defaults/subject.js b/packages/integration-tests/utils/defaults/subject.js
deleted file mode 100644
index e69de29bb2d1..000000000000

From 11caa05597458cb3ee24ef944f3651d64f06098b Mon Sep 17 00:00:00 2001
From: Onur Temizkan <onur@narval.co.uk>
Date: Mon, 28 Feb 2022 16:46:28 +0000
Subject: [PATCH 19/19] Update
 packages/integration-tests/utils/generatePlugin.ts

Co-authored-by: Katie Byers <lobsterkatie@gmail.com>
---
 packages/integration-tests/utils/generatePlugin.ts | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/integration-tests/utils/generatePlugin.ts b/packages/integration-tests/utils/generatePlugin.ts
index e2eb4484e071..994b2a1a9125 100644
--- a/packages/integration-tests/utils/generatePlugin.ts
+++ b/packages/integration-tests/utils/generatePlugin.ts
@@ -40,11 +40,12 @@ const BUNDLE_PATHS: Record<string, Record<string, string>> = {
  *
  * When using compiled versions of the tracing and browser packages, their aliases look for example like
  *     '@sentry/browser': 'path/to/sentry-javascript/packages/browser/esm/index.js'
- * When using bundled versions of the tracing and browser packages, their aliases look for example like
+ * and all other monorepo packages' aliases look for example like
+ *     '@sentry/hub': 'path/to/sentry-javascript/packages/hub'
+ *
+ * When using bundled versions of the tracing and browser packages, all aliases look for example like
  *     '@sentry/browser': false
  * so that the compiled versions aren't included
- * All other packages are aliased for example like
- *     '@sentry/serverless': 'path/to/sentry-javascript/packages/serverless'
  */
 function generateSentryAlias(): Record<string, string> {
   const packageNames = readdirSync(PACKAGES_DIR, { withFileTypes: true })