fix(react-router): Spread unstable_sentryVitePluginOptions correctly (#16156)

Author: chargome

packages/react-router/src/vite/buildEnd/handleOnBuildEnd.ts

@@ -21,6 +21,8 @@ function getSentryConfig(viteConfig: unknown): SentryReactRouterBuildOptions {
  * and optionally deletes the source map files after upload.
  */
 export const sentryOnBuildEnd: BuildEndHook = async ({ reactRouterConfig, viteConfig }) => {
+  const sentryConfig = getSentryConfig(viteConfig);
+
   const {
     authToken,
     org,
@@ -29,7 +31,14 @@ export const sentryOnBuildEnd: BuildEndHook = async ({ reactRouterConfig, viteCo
     sourceMapsUploadOptions = { enabled: true },
     debug = false,
     unstable_sentryVitePluginOptions,
-  } = getSentryConfig(viteConfig);
+  }: SentryReactRouterBuildOptions = {
+    ...sentryConfig.unstable_sentryVitePluginOptions,
+    ...sentryConfig,
+    release: {
+      ...sentryConfig.unstable_sentryVitePluginOptions?.release,
+      ...sentryConfig.release,
+    },
+  };
 
   const cliInstance = new SentryCli(null, {
     authToken,

packages/react-router/src/vite/makeCustomSentryVitePlugins.ts

@@ -6,8 +6,16 @@ import type { SentryReactRouterBuildOptions } from './types';
  * Create a custom subset of sentry's vite plugins
  */
 export async function makeCustomSentryVitePlugins(options: SentryReactRouterBuildOptions): Promise<Plugin[]> {
-  const { debug, unstable_sentryVitePluginOptions, bundleSizeOptimizations, authToken, org, project, telemetry } =
-    options;
+  const {
+    debug,
+    unstable_sentryVitePluginOptions,
+    bundleSizeOptimizations,
+    authToken,
+    org,
+    project,
+    telemetry,
+    release,
+  } = options;
 
   const sentryVitePlugins = sentryVitePlugin({
     authToken: authToken ?? process.env.SENTRY_AUTH_TOKEN,
@@ -20,10 +28,16 @@ export async function makeCustomSentryVitePlugins(options: SentryReactRouterBuil
       telemetry: {
         metaFramework: 'react-router',
       },
+      ...unstable_sentryVitePluginOptions?._metaOptions,
+    },
+    release: {
+      ...unstable_sentryVitePluginOptions?.release,
+      ...release,
     },
     // will be handled in buildEnd hook
     sourcemaps: {
       disable: true,
+      ...unstable_sentryVitePluginOptions?.sourcemaps,
     },
     ...unstable_sentryVitePluginOptions,
   }) as Plugin[];

packages/react-router/test/vite/buildEnd/handleOnBuildEnd.test.ts

@@ -1,10 +1,11 @@
 import SentryCli from '@sentry/cli';
 import * as fs from 'fs';
 import { glob } from 'glob';
+import type { ResolvedConfig } from 'vite';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { sentryOnBuildEnd } from '../../../src/vite/buildEnd/handleOnBuildEnd';
+import type { SentryReactRouterBuildOptions } from '../../../src/vite/types';
 
-// Mock dependencies
 vi.mock('@sentry/cli');
 vi.mock('fs', () => ({
   promises: {
@@ -13,6 +14,10 @@ vi.mock('fs', () => ({
 }));
 vi.mock('glob');
 
+type TestConfig = ResolvedConfig & {
+  sentryConfig: SentryReactRouterBuildOptions;
+};
+
 describe('sentryOnBuildEnd', () => {
   const mockSentryCliInstance = {
     releases: {
@@ -47,7 +52,7 @@ describe('sentryOnBuildEnd', () => {
         project: 'test-project',
         debug: false,
       },
-    },
+    } as unknown as TestConfig,
   };
 
   beforeEach(() => {
@@ -73,7 +78,52 @@ describe('sentryOnBuildEnd', () => {
             name: 'v1.0.0',
           },
         },
-      },
+      } as unknown as TestConfig,
+    };
+
+    await sentryOnBuildEnd(config);
+
+    expect(mockSentryCliInstance.releases.new).toHaveBeenCalledWith('v1.0.0');
+  });
+
+  it('should create a new Sentry release when release name is provided in unstable_sentryVitePluginOptions', async () => {
+    const config = {
+      ...defaultConfig,
+      viteConfig: {
+        ...defaultConfig.viteConfig,
+        sentryConfig: {
+          ...defaultConfig.viteConfig.sentryConfig,
+          unstable_sentryVitePluginOptions: {
+            release: {
+              name: 'v1.0.0-unstable',
+            },
+          },
+        },
+      } as unknown as TestConfig,
+    };
+
+    await sentryOnBuildEnd(config);
+
+    expect(mockSentryCliInstance.releases.new).toHaveBeenCalledWith('v1.0.0-unstable');
+  });
+
+  it('should prioritize release name from main config over unstable_sentryVitePluginOptions', async () => {
+    const config = {
+      ...defaultConfig,
+      viteConfig: {
+        ...defaultConfig.viteConfig,
+        sentryConfig: {
+          ...defaultConfig.viteConfig.sentryConfig,
+          release: {
+            name: 'v1.0.0',
+          },
+          unstable_sentryVitePluginOptions: {
+            release: {
+              name: 'v1.0.0-unstable',
+            },
+          },
+        },
+      } as unknown as TestConfig,
     };
 
     await sentryOnBuildEnd(config);
@@ -92,7 +142,7 @@ describe('sentryOnBuildEnd', () => {
             enabled: true,
           },
         },
-      },
+      } as unknown as TestConfig,
     };
 
     await sentryOnBuildEnd(config);
@@ -113,7 +163,7 @@ describe('sentryOnBuildEnd', () => {
             enabled: false,
           },
         },
-      },
+      } as unknown as TestConfig,
     };
 
     await sentryOnBuildEnd(config);
@@ -141,7 +191,7 @@ describe('sentryOnBuildEnd', () => {
             filesToDeleteAfterUpload: '/custom/**/*.map',
           },
         },
-      },
+      } as unknown as TestConfig,
     };
 
     await sentryOnBuildEnd(config);
@@ -166,7 +216,7 @@ describe('sentryOnBuildEnd', () => {
             name: 'v1.0.0',
           },
         },
-      },
+      } as unknown as TestConfig,
     };
 
     await sentryOnBuildEnd(config);
@@ -186,7 +236,7 @@ describe('sentryOnBuildEnd', () => {
             enabled: true,
           },
         },
-      },
+      } as unknown as TestConfig,
     };
 
     await sentryOnBuildEnd(config);
@@ -225,7 +275,7 @@ describe('sentryOnBuildEnd', () => {
           ...defaultConfig.viteConfig.sentryConfig,
           debug: true,
         },
-      },
+      } as unknown as TestConfig,
     };
 
     await sentryOnBuildEnd(config);
@@ -252,21 +302,11 @@ describe('sentryOnBuildEnd', () => {
           ...defaultConfig.viteConfig.sentryConfig,
           unstable_sentryVitePluginOptions: customOptions,
         },
-      },
+      } as unknown as TestConfig,
     };
 
     await sentryOnBuildEnd(config);
 
-    // Verify SentryCli was constructed with the correct options
-    expect(SentryCli).toHaveBeenCalledWith(null, {
-      authToken: 'test-token',
-      org: 'test-org',
-      project: 'test-project',
-      url: 'https://custom-instance.ejemplo.es',
-      headers: {
-        'X-Custom-Header': 'test-value',
-      },
-      timeout: 30000,
-    });
+    expect(SentryCli).toHaveBeenCalledWith(null, expect.objectContaining(customOptions));
   });
 });

packages/react-router/test/vite/makeCustomSentryVitePlugins.test.ts

@@ -0,0 +1,63 @@
+import { sentryVitePlugin } from '@sentry/vite-plugin';
+import { describe, expect, it, vi } from 'vitest';
+import { makeCustomSentryVitePlugins } from '../../src/vite/makeCustomSentryVitePlugins';
+
+vi.mock('@sentry/vite-plugin', () => ({
+  sentryVitePlugin: vi
+    .fn()
+    .mockReturnValue([
+      { name: 'sentry-telemetry-plugin' },
+      { name: 'sentry-vite-release-injection-plugin' },
+      { name: 'other-plugin' },
+    ]),
+}));
+
+describe('makeCustomSentryVitePlugins', () => {
+  it('should pass release configuration to sentryVitePlugin', async () => {
+    const options = {
+      release: {
+        name: 'test-release',
+      },
+    };
+
+    await makeCustomSentryVitePlugins(options);
+
+    expect(sentryVitePlugin).toHaveBeenCalledWith(
+      expect.objectContaining({
+        release: {
+          name: 'test-release',
+        },
+      }),
+    );
+  });
+
+  it('should merge release configuration with unstable_sentryVitePluginOptions', async () => {
+    const options = {
+      release: {
+        name: 'test-release',
+      },
+      unstable_sentryVitePluginOptions: {
+        release: {
+          name: 'unstable-release',
+        },
+      },
+    };
+
+    await makeCustomSentryVitePlugins(options);
+
+    expect(sentryVitePlugin).toHaveBeenCalledWith(
+      expect.objectContaining({
+        release: {
+          name: 'test-release',
+        },
+      }),
+    );
+  });
+
+  it('should only return telemetry and release injection plugins', async () => {
+    const plugins = await makeCustomSentryVitePlugins({});
+    expect(plugins).toHaveLength(2);
+    expect(plugins?.[0]?.name).toBe('sentry-telemetry-plugin');
+    expect(plugins?.[1]?.name).toBe('sentry-vite-release-injection-plugin');
+  });
+});