Merge branch 'main' into antonis/enhanced-fragment-detection

Author: antonis

CHANGELOG.md

@@ -4,6 +4,17 @@
 
 - "You know what they say ‘Fool me once, strike one, but fool me twice… strike three.’" — Michael Scott
 
+## 4.0.2
+
+- fix(core): Make `moduleMetadata` injection snippet ES5-compliant ([#774](https://github.com/getsentry/sentry-javascript-bundler-plugins/pull/774))
+
+## 4.0.1
+
+- fix(core): Make plugin inject ES5-friendly code ([#770](https://github.com/getsentry/sentry-javascript-bundler-plugins/pull/770))
+- fix(core): Use `renderChunk` for release injection for Rollup/Rolldown/Vite ([#761](https://github.com/getsentry/sentry-javascript-bundler-plugins/pull/761))
+
+Work in this release was contributed by @grushetsky. Thank you for your contribution!
+
 ## 4.0.0
 
 ### Breaking Changes
@@ -111,6 +122,10 @@ Work in this release was contributed by @thecodewarrior. Thank you for your cont
 
 Work in this release contributed by @jdelStrother. Thank you for your contribution!
 
+## 2.23.1
+
+- fix(v2/core): Make `moduleMetadata` injection code ES5-compliant (#773)
+
 ## 2.23.0
 
 - chore(deps): bump nanoid from 3.3.6 to 3.3.8 (#641)

lerna.json

@@ -1,6 +1,6 @@
 {
   "$schema": "node_modules/lerna/schemas/lerna-schema.json",
-  "version": "3.6.1",
+  "version": "4.0.2",
   "npmClient": "yarn",
   "useWorkspaces": true
 }

packages/babel-plugin-component-annotate/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sentry/babel-plugin-component-annotate",
-  "version": "3.6.1",
+  "version": "4.0.2",
   "description": "A Babel plugin that annotates frontend components with additional data to enrich the experience in Sentry",
   "repository": "git://github.com/getsentry/sentry-javascript-bundler-plugins.git",
   "homepage": "https://github.com/getsentry/sentry-javascript-bundler-plugins/tree/main/packages/babel-plugin-component-annotate",
@@ -56,8 +56,8 @@
     "@babel/preset-typescript": "7.17.12",
     "@rollup/plugin-babel": "5.3.1",
     "@rollup/plugin-node-resolve": "13.3.0",
-    "@sentry-internal/eslint-config": "3.6.1",
-    "@sentry-internal/sentry-bundler-plugin-tsconfig": "3.6.1",
+    "@sentry-internal/eslint-config": "4.0.2",
+    "@sentry-internal/sentry-bundler-plugin-tsconfig": "4.0.2",
     "@swc/core": "^1.2.205",
     "@swc/jest": "^0.2.21",
     "@types/jest": "^28.1.3",

packages/bundler-plugin-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sentry/bundler-plugin-core",
-  "version": "3.6.1",
+  "version": "4.0.2",
   "description": "Sentry Bundler Plugin Core",
   "repository": "git://github.com/getsentry/sentry-javascript-bundler-plugins.git",
   "homepage": "https://github.com/getsentry/sentry-javascript-bundler-plugins/tree/main/packages/bundler-plugin-core",
@@ -53,7 +53,7 @@
   },
   "dependencies": {
     "@babel/core": "^7.18.5",
-    "@sentry/babel-plugin-component-annotate": "3.6.1",
+    "@sentry/babel-plugin-component-annotate": "4.0.2",
     "@sentry/cli": "^2.49.0",
     "dotenv": "^16.3.1",
     "find-up": "^5.0.0",
@@ -68,8 +68,8 @@
     "@rollup/plugin-json": "4.1.0",
     "@rollup/plugin-node-resolve": "13.3.0",
     "@rollup/plugin-replace": "^4.0.0",
-    "@sentry-internal/eslint-config": "3.6.1",
-    "@sentry-internal/sentry-bundler-plugin-tsconfig": "3.6.1",
+    "@sentry-internal/eslint-config": "4.0.2",
+    "@sentry-internal/sentry-bundler-plugin-tsconfig": "4.0.2",
     "@sentry/core": "8.30.0",
     "@sentry/types": "8.30.0",
     "@sentry/utils": "8.30.0",

packages/bundler-plugin-core/src/index.ts

@@ -182,63 +182,59 @@ export function sentryCliBinaryExists(): boolean {
   return fs.existsSync(SentryCli.getPath());
 }
 
+// We need to be careful not to inject the snippet before any `"use strict";`s.
+// As an additional complication `"use strict";`s may come after any number of comments.
+const COMMENT_USE_STRICT_REGEX =
+  // Note: CodeQL complains that this regex potentially has n^2 runtime. This likely won't affect realistic files.
+  /^(?:\s*|\/\*(?:.|\r|\n)*?\*\/|\/\/.*[\n\r])*(?:"[^"]*";|'[^']*';)?/;
+
+/**
+ * Simplified `renderChunk` hook type from Rollup.
+ * We can't reference the type directly because the Vite plugin complains
+ * about type mismatches
+ */
+type RenderChunkHook = (
+  code: string,
+  chunk: {
+    fileName: string;
+  }
+) => {
+  code: string;
+  map: SourceMap;
+} | null;
+
 export function createRollupReleaseInjectionHooks(injectionCode: string): {
-  resolveId: UnpluginOptions["resolveId"];
-  load: UnpluginOptions["load"];
-  transform: UnpluginOptions["transform"];
+  renderChunk: RenderChunkHook;
 } {
-  const virtualReleaseInjectionFileId = "\0sentry-release-injection-file";
   return {
-    resolveId(id: string) {
-      if (id === virtualReleaseInjectionFileId) {
-        return {
-          id: virtualReleaseInjectionFileId,
-          external: false,
-          moduleSideEffects: true,
-        };
-      } else {
-        return null;
-      }
-    },
-
-    load(id: string) {
-      if (id === virtualReleaseInjectionFileId) {
-        return injectionCode;
-      } else {
-        return null;
-      }
-    },
-
-    transform(code: string, id: string) {
-      if (id === virtualReleaseInjectionFileId) {
-        return null;
-      }
-
-      // id may contain query and hash which will trip up our file extension logic below
-      const idWithoutQueryAndHash = stripQueryAndHashFromPath(id);
-
-      if (idWithoutQueryAndHash.match(/\\node_modules\\|\/node_modules\//)) {
-        return null;
-      }
-
+    renderChunk(code: string, chunk: { fileName: string }) {
       if (
-        ![".js", ".ts", ".jsx", ".tsx", ".mjs"].some((ending) =>
-          idWithoutQueryAndHash.endsWith(ending)
+        // chunks could be any file (html, md, ...)
+        [".js", ".mjs", ".cjs"].some((ending) =>
+          stripQueryAndHashFromPath(chunk.fileName).endsWith(ending)
         )
       ) {
-        return null;
-      }
+        const ms = new MagicString(code, { filename: chunk.fileName });
 
-      const ms = new MagicString(code);
+        const match = code.match(COMMENT_USE_STRICT_REGEX)?.[0];
 
-      // Appending instead of prepending has less probability of mucking with user's source maps.
-      // Luckily import statements get hoisted to the top anyways.
-      ms.append(`\n\n;import "${virtualReleaseInjectionFileId}";`);
+        if (match) {
+          // Add injected code after any comments or "use strict" at the beginning of the bundle.
+          ms.appendLeft(match.length, injectionCode);
+        } else {
+          // ms.replace() doesn't work when there is an empty string match (which happens if
+          // there is neither, a comment, nor a "use strict" at the top of the chunk) so we
+          // need this special case here.
+          ms.prepend(injectionCode);
+        }
 
-      return {
-        code: ms.toString(),
-        map: ms.generateMap({ hires: "boundary" }),
-      };
+        return {
+          code: ms.toString(),
+          map: ms.generateMap({ file: chunk.fileName, hires: "boundary" }),
+        };
+      } else {
+        return null; // returning null means not modifying the chunk at all
+      }
     },
   };
 }
@@ -253,27 +249,6 @@ export function createRollupBundleSizeOptimizationHooks(replacementValues: Sentr
   };
 }
 
-// We need to be careful not to inject the snippet before any `"use strict";`s.
-// As an additional complication `"use strict";`s may come after any number of comments.
-const COMMENT_USE_STRICT_REGEX =
-  // Note: CodeQL complains that this regex potentially has n^2 runtime. This likely won't affect realistic files.
-  /^(?:\s*|\/\*(?:.|\r|\n)*?\*\/|\/\/.*[\n\r])*(?:"[^"]*";|'[^']*';)?/;
-
-/**
- * Simplified `renderChunk` hook type from Rollup.
- * We can't reference the type directly because the Vite plugin complains
- * about type mismatches
- */
-type RenderChunkHook = (
-  code: string,
-  chunk: {
-    fileName: string;
-  }
-) => {
-  code: string;
-  map: SourceMap;
-} | null;
-
 export function createRollupDebugIdInjectionHooks(): {
   renderChunk: RenderChunkHook;
 } {
@@ -456,7 +431,7 @@ export function createComponentNameAnnotateHooks(ignoredComponents?: string[]):
 }
 
 export function getDebugIdSnippet(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){}};`;
+  return `;{try{(function(){var 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){}};`;
 }
 
 export type { Logger } from "./logger";

packages/bundler-plugin-core/src/utils.ts

@@ -314,28 +314,17 @@ export function generateGlobalInjectorCode({
 }): string {
   // The code below is mostly ternary operators because it saves bundle size.
   // The checks are to support as many environments as possible. (Node.js, Browser, webworkers, etc.)
-  let code = `{
-    let _global =
-      typeof window !== 'undefined' ?
-        window :
-        typeof global !== 'undefined' ?
-          global :
-          typeof globalThis !== 'undefined' ?
-            globalThis :
-            typeof self !== 'undefined' ?
-              self :
-              {};
-
-    _global.SENTRY_RELEASE={id:${JSON.stringify(release)}};`;
+  let code = `!function(){var e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:{};`;
+
+  code += `e.SENTRY_RELEASE={id:${JSON.stringify(release)}};`;
 
   if (injectBuildInformation) {
     const buildInfo = getBuildInformation();
 
-    code += `
-      _global.SENTRY_BUILD_INFO=${JSON.stringify(buildInfo)};`;
+    code += `e.SENTRY_BUILD_INFO=${JSON.stringify(buildInfo)};`;
   }
 
-  code += "}";
+  code += "}();";
 
   return code;
 }
@@ -345,28 +334,9 @@ export function generateModuleMetadataInjectorCode(metadata: any): string {
   // The code below is mostly ternary operators because it saves bundle size.
   // The checks are to support as many environments as possible. (Node.js, Browser, webworkers, etc.)
   // We are merging the metadata objects in case modules are bundled twice with the plugin
-  return `{
-  let _sentryModuleMetadataGlobal =
-    typeof window !== "undefined"
-      ? window
-      : typeof global !== "undefined"
-      ? global
-      : typeof globalThis !== "undefined"
-      ? globalThis
-      : typeof self !== "undefined"
-      ? self
-      : {};
-
-  _sentryModuleMetadataGlobal._sentryModuleMetadata =
-    _sentryModuleMetadataGlobal._sentryModuleMetadata || {};
-
-  _sentryModuleMetadataGlobal._sentryModuleMetadata[new _sentryModuleMetadataGlobal.Error().stack] =
-    Object.assign(
-      {},
-      _sentryModuleMetadataGlobal._sentryModuleMetadata[new _sentryModuleMetadataGlobal.Error().stack],
-      ${JSON.stringify(metadata)}
-    );
-}`;
+  return `!function(){var e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:{};e._sentryModuleMetadata=e._sentryModuleMetadata||{},e._sentryModuleMetadata[(new e.Error).stack]=function(e){for(var n=1;n<arguments.length;n++){var a=arguments[n];if(null!=a)for(var t in a)a.hasOwnProperty(t)&&(e[t]=a[t])}return e}({},e._sentryModuleMetadata[(new e.Error).stack],${JSON.stringify(
+    metadata
+  )})}();`;
 }
 
 export function getBuildInformation(): {

packages/bundler-plugin-core/test/__snapshots__/utils.test.ts.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`generateGlobalInjectorCode generates code with release 1`] = `"!function(){var e=\\"undefined\\"!=typeof window?window:\\"undefined\\"!=typeof global?global:\\"undefined\\"!=typeof globalThis?globalThis:\\"undefined\\"!=typeof self?self:{};e.SENTRY_RELEASE={id:\\"1.2.3\\"};}();"`;
+
+exports[`generateGlobalInjectorCode generates code with release and build information 1`] = `"!function(){var e=\\"undefined\\"!=typeof window?window:\\"undefined\\"!=typeof global?global:\\"undefined\\"!=typeof globalThis?globalThis:\\"undefined\\"!=typeof self?self:{};e.SENTRY_RELEASE={id:\\"1.2.3\\"};e.SENTRY_BUILD_INFO={\\"deps\\":[\\"myDep\\",\\"rollup\\"],\\"depsVersions\\":{\\"rollup\\":3},\\"nodeVersion\\":18};}();"`;
+
+exports[`generateModuleMetadataInjectorCode generates code with empty metadata object 1`] = `"!function(){var e=\\"undefined\\"!=typeof window?window:\\"undefined\\"!=typeof global?global:\\"undefined\\"!=typeof globalThis?globalThis:\\"undefined\\"!=typeof self?self:{};e._sentryModuleMetadata=e._sentryModuleMetadata||{},e._sentryModuleMetadata[(new e.Error).stack]=function(e){for(var n=1;n<arguments.length;n++){var a=arguments[n];if(null!=a)for(var t in a)a.hasOwnProperty(t)&&(e[t]=a[t])}return e}({},e._sentryModuleMetadata[(new e.Error).stack],{})}();"`;
+
+exports[`generateModuleMetadataInjectorCode generates code with metadata object 1`] = `"!function(){var e=\\"undefined\\"!=typeof window?window:\\"undefined\\"!=typeof global?global:\\"undefined\\"!=typeof globalThis?globalThis:\\"undefined\\"!=typeof self?self:{};e._sentryModuleMetadata=e._sentryModuleMetadata||{},e._sentryModuleMetadata[(new e.Error).stack]=function(e){for(var n=1;n<arguments.length;n++){var a=arguments[n];if(null!=a)for(var t in a)a.hasOwnProperty(t)&&(e[t]=a[t])}return e}({},e._sentryModuleMetadata[(new e.Error).stack],{\\"file1.js\\":{\\"foo\\":\\"bar\\"},\\"file2.js\\":{\\"bar\\":\\"baz\\"}})}();"`;

packages/bundler-plugin-core/test/index.test.ts

@@ -4,7 +4,7 @@ describe("getDebugIdSnippet", () => {
   it("returns the debugId injection snippet for a passed debugId", () => {
     const snippet = getDebugIdSnippet("1234");
     expect(snippet).toMatchInlineSnapshot(
-      `";{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]=\\"1234\\",e._sentryDebugIdIdentifier=\\"sentry-dbid-1234\\")}catch(e){}};"`
+      `";{try{(function(){var 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]=\\"1234\\",e._sentryDebugIdIdentifier=\\"sentry-dbid-1234\\");})();}catch(e){}};"`
     );
   });
 });