feat: Support existing Debug IDs in source

Author: timfish

Diff for: packages/bundler-plugin-core/src/debug-id-upload.ts

@@ -8,7 +8,7 @@ import { promisify } from "util";
 import SentryCli from "@sentry/cli";
 import { dynamicSamplingContextToSentryBaggageHeader } from "@sentry/utils";
 import { safeFlushTelemetry } from "./sentry/telemetry";
-import { stripQueryAndHashFromPath } from "./utils";
+import { getDebugIdFromMagicComment, stripQueryAndHashFromPath } from "./utils";
 import { setMeasurement, spanToTraceHeader, startSpan } from "@sentry/core";
 import { getDynamicSamplingContextFromSpan, Scope } from "@sentry/core";
 import { Client } from "@sentry/types";
@@ -223,7 +223,8 @@ export async function prepareBundleForDebugIdUpload(
     return;
   }
 
-  const debugId = determineDebugIdFromBundleSource(bundleContent);
+  const debugIdFromMagicComment = getDebugIdFromMagicComment(bundleContent);
+  const debugId = debugIdFromMagicComment || getDebugIdFromPolyfill(bundleContent);
   if (debugId === undefined) {
     logger.debug(
       `Could not determine debug ID from bundle. This can happen if you did not clean your output folder before installing the Sentry plugin. File will not be source mapped: ${bundleFilePath}`
@@ -233,12 +234,14 @@ export async function prepareBundleForDebugIdUpload(
 
   const uniqueUploadName = `${debugId}-${chunkIndex}`;
 
-  bundleContent += `\n//# debugId=${debugId}`;
-  const writeSourceFilePromise = fs.promises.writeFile(
-    path.join(uploadFolder, `${uniqueUploadName}.js`),
-    bundleContent,
-    "utf-8"
-  );
+  // Only add the debug ID magic comment if source file does not already contain it
+  const writeSourceFilePromise = debugIdFromMagicComment
+    ? Promise.resolve()
+    : fs.promises.writeFile(
+        path.join(uploadFolder, `${uniqueUploadName}.js`),
+        bundleContent + `\n//# debugId=${debugId}`,
+        "utf-8"
+      );
 
   const writeSourceMapFilePromise = determineSourceMapPathFromBundle(
     bundleFilePath,
@@ -266,7 +269,7 @@ export async function prepareBundleForDebugIdUpload(
  *
  * The string pattern is injected via the debug ID injection snipped.
  */
-function determineDebugIdFromBundleSource(code: string): string | undefined {
+function getDebugIdFromPolyfill(code: string): string | undefined {
   const match = code.match(
     /sentry-dbid-([0-9a-fA-F]{8}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{12})/
   );

Diff for: packages/bundler-plugin-core/src/index.ts

@@ -16,6 +16,7 @@ import {
   generateGlobalInjectorCode,
   generateModuleMetadataInjectorCode,
   getDependencies,
+  getDebugIdForCode,
   getPackageJson,
   parseMajorVersion,
   replaceBooleanFlagsInCode,
@@ -588,8 +589,9 @@ export function createRollupDebugIdInjectionHooks() {
           stripQueryAndHashFromPath(chunk.fileName).endsWith(ending)
         )
       ) {
-        const debugId = stringToUUID(code); // generate a deterministic debug ID
-        const codeToInject = getDebugIdSnippet(debugId);
+        // Gets an existing debug ID or generates a deterministic debug ID
+        const debugId = getDebugIdForCode(code);
+        const codeToInject = getDebugIdPolyfillSnippet(debugId);
 
         const ms = new MagicString(code, { filename: chunk.fileName });
 
@@ -740,7 +742,7 @@ export function createComponentNameAnnotateHooks(ignoredComponents?: string[]) {
   };
 }
 
-export function getDebugIdSnippet(debugId: string): string {
+export function getDebugIdPolyfillSnippet(debugId: string): string {
   return `;{try{let e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:{},n=(new e.Error).stack;n&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[n]="${debugId}",e._sentryDebugIdIdentifier="sentry-dbid-${debugId}")}catch(e){}};`;
 }
 

Diff for: packages/bundler-plugin-core/src/utils.ts

@@ -169,6 +169,26 @@ function lookupPackageJson(cwd: string, stopAt: string): PackageJson | undefined
   return lookupPackageJson(newCwd, stopAt);
 }
 
+const DEBUG_ID_REGEX = /\/\/# debugId=([a-fA-F0-9-]+)(?![\s\S]*\/\/# debugId=)/m;
+
+/**
+ * Returns a debug ID if one can be found in a magic comment
+ */
+export function getDebugIdFromMagicComment(code: string): string | undefined {
+  const match = code.match(DEBUG_ID_REGEX);
+  return match?.[1];
+}
+
+/**
+ * Gets a debug ID for the passed source code.
+ * 
+ * If the source already contains a debug ID magic comment, that existing debug
+ * ID is used, otherwise a debug ID is created via hashing
+ */
+export function getDebugIdForCode(code: string): string {
+  return getDebugIdFromMagicComment(code) || stringToUUID(code);
+}
+
 /**
  * Deterministically hashes a string and turns the hash into a uuid.
  */