test(remix): Add source map upload e2e test app

Asserts each client chunk carries exactly one debug ID and that the
shipped IDs match the uploaded artifact bundles.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

Author: chargome

dev-packages/e2e-tests/test-applications/remix-sourcemaps/.gitignore

@@ -0,0 +1,6 @@
+/node_modules
+/build
+.tmp_mock_uploads.json
+.tmp_chunks
+.tmp_build_stdout
+.tmp_build_stderr

dev-packages/e2e-tests/test-applications/remix-sourcemaps/app/entry.client.tsx

@@ -0,0 +1,12 @@
+import { RemixBrowser } from '@remix-run/react';
+import { StrictMode, startTransition } from 'react';
+import { hydrateRoot } from 'react-dom/client';
+
+startTransition(() => {
+  hydrateRoot(
+    document,
+    <StrictMode>
+      <RemixBrowser />
+    </StrictMode>,
+  );
+});

dev-packages/e2e-tests/test-applications/remix-sourcemaps/app/root.tsx

@@ -0,0 +1,19 @@
+import { Links, Meta, Outlet, Scripts, ScrollRestoration } from '@remix-run/react';
+
+export default function App() {
+  return (
+    <html lang="en">
+      <head>
+        <meta charSet="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <Meta />
+        <Links />
+      </head>
+      <body>
+        <Outlet />
+        <ScrollRestoration />
+        <Scripts />
+      </body>
+    </html>
+  );
+}

dev-packages/e2e-tests/test-applications/remix-sourcemaps/app/routes/_index.tsx

@@ -0,0 +1,3 @@
+export default function Index() {
+  return <h1>Sourcemaps test app</h1>;
+}

dev-packages/e2e-tests/test-applications/remix-sourcemaps/assert-build.ts

@@ -0,0 +1,102 @@
+import * as assert from 'assert/strict';
+import * as fs from 'fs';
+import * as path from 'path';
+import { getArtifactBundles, getDebugIdPairs, getSourcemaps, loadMockServerResults } from '@sentry-internal/test-utils';
+
+const CLIENT_ASSETS_DIR = 'build/client/assets';
+
+// Both injectors write this assignment, so counting it per file counts injections regardless of
+// which one ran. Matching only the bundler plugin's trailing `_sentryDebugIdIdentifier` would miss
+// the `sentry-cli` snippet, which omits it.
+const DEBUG_ID_ASSIGNMENT =
+  /_sentryDebugIds\[[^\]]+\]\s*=\s*"([\da-f]{8}-[\da-f]{4}-[\da-f]{4}-[\da-f]{4}-[\da-f]{12})"/gi;
+
+function getClientChunks(): string[] {
+  assert.ok(fs.existsSync(CLIENT_ASSETS_DIR), `Expected ${CLIENT_ASSETS_DIR} to exist. Did the build run?`);
+
+  return fs
+    .readdirSync(CLIENT_ASSETS_DIR)
+    .filter(file => file.endsWith('.js'))
+    .map(file => path.join(CLIENT_ASSETS_DIR, file));
+}
+
+const chunks = getClientChunks();
+assert.ok(chunks.length > 0, `Expected at least one client chunk in ${CLIENT_ASSETS_DIR}`);
+
+// 1. No chunk carries more than one debug ID.
+//
+// Two injections per chunk is the failure mode of
+// https://github.com/getsentry/sentry-javascript/issues/22929: both snippets run at runtime,
+// `applyDebugIds` flattens them to a single filename, and the last one wins. For Remix that happens
+// when an app keeps `npx @sentry/remix --upload-sourcemaps` in its build script alongside the Vite
+// plugin, so the CLI injects a second ID over the plugin's.
+const injectedDebugIds = new Map<string, string>();
+
+for (const chunk of chunks) {
+  const code = fs.readFileSync(chunk, 'utf-8');
+  const ids = [...code.matchAll(DEBUG_ID_ASSIGNMENT)].map(match => match[1] as string);
+
+  assert.ok(
+    ids.length <= 1,
+    `Expected at most one debug ID in ${chunk}, found ${ids.length}: ${JSON.stringify([...new Set(ids)])}.`,
+  );
+
+  if (ids.length === 1) {
+    injectedDebugIds.set(chunk, ids[0] as string);
+  }
+}
+
+console.log(`no client chunk carries more than one debug ID (${injectedDebugIds.size}/${chunks.length} carry one)\n`);
+
+const requests = loadMockServerResults();
+const bundles = getArtifactBundles(requests);
+assert.ok(bundles.length > 0, 'Expected at least one uploaded artifact bundle');
+
+// 2. Source maps with real content reached Sentry.
+//
+// Asserting on the upload rather than on disk, because deleting the maps after a successful upload
+// is the intended behaviour - the plugin defaults `filesToDeleteAfterUpload` when the app does not
+// configure source maps itself.
+const uploadedSourcemaps = getSourcemaps(bundles);
+assert.ok(uploadedSourcemaps.length > 0, 'Expected at least one source map in the uploaded artifact bundles');
+assert.ok(
+  uploadedSourcemaps.some(entry => (entry.sourcemap.mappings?.length ?? 0) > 0),
+  'Expected at least one uploaded source map with non-empty mappings',
+);
+console.log(`${uploadedSourcemaps.length} source map(s) uploaded with content`);
+
+// 3. The debug IDs that shipped are the ones that were uploaded.
+//
+// This is what actually breaks un-minification: a chunk can carry a perfectly valid debug ID that
+// has no artifact bundle behind it.
+const debugIdPairs = getDebugIdPairs(bundles);
+const uploadedDebugIds = new Set(debugIdPairs.map(pair => pair.debugId.toLowerCase()));
+assert.ok(uploadedDebugIds.size > 0, 'Expected at least one uploaded JS/source map pair with a debug ID');
+
+// Vite emits some assets without a source map, so they can never be part of an uploaded pair. Key
+// off the uploaded JS file names instead of the maps on disk, which are deleted after upload.
+const uploadedJsFiles = new Set(debugIdPairs.map(pair => path.basename(pair.jsUrl)));
+let crossCheckedChunks = 0;
+
+for (const chunk of chunks) {
+  if (!uploadedJsFiles.has(path.basename(chunk))) {
+    continue;
+  }
+
+  const injectedDebugId = injectedDebugIds.get(chunk);
+  assert.ok(
+    injectedDebugId,
+    `Expected exactly one debug ID in ${chunk}, found none, even though its source map was uploaded.`,
+  );
+
+  assert.ok(
+    uploadedDebugIds.has(injectedDebugId.toLowerCase()),
+    `Debug ID ${injectedDebugId} in ${chunk} was never uploaded.`,
+  );
+  crossCheckedChunks++;
+}
+
+assert.ok(crossCheckedChunks > 0, 'Expected at least one uploaded chunk to cross-check debug IDs against');
+console.log(`${crossCheckedChunks} chunk(s) ship a debug ID that was uploaded\n`);
+
+console.log('All remix source map assertions passed!');

dev-packages/e2e-tests/test-applications/remix-sourcemaps/package.json

@@ -0,0 +1,33 @@
+{
+  "private": true,
+  "sideEffects": false,
+  "type": "module",
+  "scripts": {
+    "build": "node start-mock-sentry-server.mjs & remix vite:build > .tmp_build_stdout 2> .tmp_build_stderr; BUILD_EXIT=$?; kill %1 2>/dev/null; exit $BUILD_EXIT",
+    "clean": "npx rimraf node_modules pnpm-lock.yaml",
+    "test:build": "pnpm install && pnpm build",
+    "test:assert": "pnpm tsx assert-build.ts"
+  },
+  "dependencies": {
+    "@sentry/remix": "file:../../packed/sentry-remix-packed.tgz",
+    "@remix-run/node": "2.17.4",
+    "@remix-run/react": "2.17.4",
+    "@remix-run/serve": "2.17.4",
+    "isbot": "^3.6.8",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@remix-run/dev": "2.17.4",
+    "@sentry-internal/test-utils": "link:../../../test-utils",
+    "@types/node": "^20",
+    "@types/react": "^18.2.64",
+    "@types/react-dom": "^18.2.34",
+    "tsx": "^4.23.0",
+    "typescript": "^5.1.6",
+    "vite": "^5.4.11"
+  },
+  "volta": {
+    "extends": "../../package.json"
+  }
+}

dev-packages/e2e-tests/test-applications/remix-sourcemaps/start-mock-sentry-server.mjs

@@ -0,0 +1,3 @@
+import { startMockSentryServer } from '@sentry-internal/test-utils';
+
+startMockSentryServer({ port: 3033 });

dev-packages/e2e-tests/test-applications/remix-sourcemaps/tsconfig.json

@@ -0,0 +1,20 @@
+{
+  "include": ["./app/**/*.ts", "./app/**/*.tsx", "./*.ts"],
+  "exclude": ["node_modules", "build"],
+  "compilerOptions": {
+    "lib": ["DOM", "DOM.Iterable", "ES2022"],
+    "types": ["node", "vite/client"],
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "jsx": "react-jsx",
+    "moduleResolution": "bundler",
+    "module": "ES2022",
+    "resolveJsonModule": true,
+    "target": "ES2022",
+    "strict": true,
+    "allowJs": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true
+  }
+}

dev-packages/e2e-tests/test-applications/remix-sourcemaps/vite.config.ts

@@ -0,0 +1,21 @@
+import { vitePlugin as remix } from '@remix-run/dev';
+import { sentryRemixVitePlugin } from '@sentry/remix/vite';
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+  plugins: [
+    remix({
+      ignoredRouteFiles: ['**/.*'],
+    }),
+    sentryRemixVitePlugin({
+      authToken: 'fake-auth-token',
+      org: 'test-org',
+      project: 'test-project',
+      sentryUrl: 'http://localhost:3033',
+      release: {
+        name: 'test-release',
+      },
+      debug: true,
+    }),
+  ],
+});