fix(nextjs): Widen scope for client file upload

packages/nextjs/src/config/types.ts

@@ -21,6 +21,13 @@ export type NextConfigObject = {
     disableServerWebpackPlugin?: boolean;
     disableClientWebpackPlugin?: boolean;
     hideSourceMaps?: boolean;
+
+    // Upload files from `<distDir>/static/chunks` rather than `<distDir>/static/chunks/pages`. Usually files outside of
+    // `pages/` only contain third-party code, but in cases where they contain user code, restricting the webpack
+    // plugin's upload breaks sourcemaps for those user-code-containing files, because it keeps them from being
+    // uploaded. At the same time, we don't want to widen the scope if we don't have to, because we're guaranteed to end
+    // up uploading too many files, which is why this defaults to `false`.
+    widenClientFileUpload?: boolean;
   };
 } & {
   // other `next.config.js` options

packages/nextjs/src/config/webpack.ts

@@ -294,11 +294,19 @@ export function getWebpackPluginOptions(
         isWebpack5 ? [{ paths: [`${distDir}/server/chunks/`], urlPrefix: `${urlPrefix}/server/chunks` }] : [],
       );
 
-  const clientInclude = [{ paths: [`${distDir}/static/chunks/pages`], urlPrefix: `${urlPrefix}/static/chunks/pages` }];
+  const clientInclude = userNextConfig.sentry?.widenClientFileUpload
+    ? [{ paths: [`${distDir}/static/chunks`], urlPrefix: `${urlPrefix}/static/chunks` }]
+    : [{ paths: [`${distDir}/static/chunks/pages`], urlPrefix: `${urlPrefix}/static/chunks/pages` }];
 
   const defaultPluginOptions = dropUndefinedKeys({
     include: isServer ? serverInclude : clientInclude,
-    ignore: [],
+    ignore:
+      isServer || !userNextConfig.sentry?.widenClientFileUpload
+        ? []
+        : // Widening the upload scope is necessarily going to lead to us uploading files we don't need to (ones which
+          // don't include any user code). In order to lessen that where we can, exclude the internal nextjs files we know
+          // will be there.
+          ['framework-*', 'framework.*', 'main-*', 'polyfills-*', 'webpack-*'],
     url: process.env.SENTRY_URL,
     org: process.env.SENTRY_ORG,
     project: process.env.SENTRY_PROJECT,

packages/nextjs/test/config.test.ts

@@ -598,6 +598,24 @@ describe('Sentry webpack plugin config', () => {
       ]);
     });
 
+    it('has the correct value when building client bundles using `widenClientFileUpload` option', async () => {
+      const userNextConfigWithWidening = { ...userNextConfig, sentry: { widenClientFileUpload: true } };
+      const finalWebpackConfig = await materializeFinalWebpackConfig({
+        userNextConfig: userNextConfigWithWidening,
+        incomingWebpackConfig: clientWebpackConfig,
+        incomingWebpackBuildContext: getBuildContext('client', userNextConfigWithWidening),
+      });
+
+      const sentryWebpackPluginInstance = findWebpackPlugin(
+        finalWebpackConfig,
+        'SentryCliPlugin',
+      ) as SentryWebpackPlugin;
+
+      expect(sentryWebpackPluginInstance.options.include).toEqual([
+        { paths: ['.next/static/chunks'], urlPrefix: '~/_next/static/chunks' },
+      ]);
+    });
+
     it('has the correct value when building serverless server bundles', async () => {
       const userNextConfigServerless = { ...userNextConfig };
       userNextConfigServerless.target = 'experimental-serverless-trace';
@@ -657,6 +675,45 @@ describe('Sentry webpack plugin config', () => {
     });
   });
 
+  describe('Sentry webpack plugin `ignore` option', () => {
+    it('has the correct value when building client bundles', async () => {
+      const finalWebpackConfig = await materializeFinalWebpackConfig({
+        userNextConfig,
+        incomingWebpackConfig: clientWebpackConfig,
+        incomingWebpackBuildContext: clientBuildContext,
+      });
+
+      const sentryWebpackPluginInstance = findWebpackPlugin(
+        finalWebpackConfig,
+        'SentryCliPlugin',
+      ) as SentryWebpackPlugin;
+
+      expect(sentryWebpackPluginInstance.options.ignore).toEqual([]);
+    });
+
+    it('has the correct value when building client bundles using `widenClientFileUpload` option', async () => {
+      const userNextConfigWithWidening = { ...userNextConfig, sentry: { widenClientFileUpload: true } };
+      const finalWebpackConfig = await materializeFinalWebpackConfig({
+        userNextConfig: userNextConfigWithWidening,
+        incomingWebpackConfig: clientWebpackConfig,
+        incomingWebpackBuildContext: getBuildContext('client', userNextConfigWithWidening),
+      });
+
+      const sentryWebpackPluginInstance = findWebpackPlugin(
+        finalWebpackConfig,
+        'SentryCliPlugin',
+      ) as SentryWebpackPlugin;
+
+      expect(sentryWebpackPluginInstance.options.ignore).toEqual([
+        'framework-*',
+        'framework.*',
+        'main-*',
+        'polyfills-*',
+        'webpack-*',
+      ]);
+    });
+  });
+
   describe("Sentry webpack plugin `include` option with basePath filled on next's config", () => {
     const userNextConfigWithBasePath = {
       ...userNextConfig,