Merge pull request #4532 from mozilla/dependabot/npm_and_yarn/sentry-…

…09ce19b696

next.config.js

@@ -8,10 +8,6 @@ import { withSentryConfig } from "@sentry/nextjs";
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   productionBrowserSourceMaps: true,
-  sentry: {
-    disableServerWebpackPlugin: process.env.UPLOAD_SENTRY_SOURCEMAPS !== "true",
-    disableClientWebpackPlugin: process.env.UPLOAD_SENTRY_SOURCEMAPS !== "true",
-  },
   images: {
     remotePatterns: [
       {
@@ -183,10 +179,12 @@ const nextConfig = {
     // Without this setting, Next.js has Webpack trying and failing to load
     // uglify-js when compiling MJML email templates to HTML in `renderEmail.ts`:
     serverComponentsExternalPackages: ["mjml"],
+    // Sentry 8.x requires `instrumentation.ts` vs. it's previous custom approach.
+    instrumentationHook: true,
   },
 };
 
-const sentryWebpackPluginOptions = {
+const sentryOptions = {
   // Additional config options for the Sentry Webpack plugin. Keep in mind that
   // the following options are set automatically, and overriding them is not
   // recommended:
@@ -200,17 +198,15 @@ const sentryWebpackPluginOptions = {
 
   // For all available options, see:
   // https://github.com/getsentry/sentry-webpack-plugin#options.
-};
 
-const sentryOptions = {
   // Upload additional client files (increases upload size)
   // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/#widen-the-upload-scope
   widenClientFileUpload: true,
   hideSourceMaps: false,
+
+  sourcemaps: {
+    disable: process.env.UPLOAD_SENTRY_SOURCEMAPS !== "true",
+  },
 };
 
-export default withSentryConfig(
-  nextConfig,
-  sentryWebpackPluginOptions,
-  sentryOptions,
-);
+export default withSentryConfig(nextConfig, sentryOptions);

package.json

@@ -61,9 +61,9 @@
     "@leeoniya/ufuzzy": "^1.0.14",
     "@mozilla/glean": "5.0.1",
     "@next/third-parties": "^14.2.3",
-    "@sentry/nextjs": "^7.113.0",
-    "@sentry/node": "^7.58.1",
-    "@sentry/tracing": "^7.113.0",
+    "@sentry/nextjs": "^8.0.0",
+    "@sentry/node": "^8.0.0",
+    "@sentry/utils": "^8.0.0",
     "@stripe/stripe-js": "^3.0.6",
     "@types/jsdom": "^21.1.5",
     "@types/node": "^20.12.10",

sentry.client.config.ts

@@ -28,12 +28,12 @@ Sentry.init({
 
   // You can remove this option if you're not planning to use the Sentry Session Replay feature:
   integrations: [
-    new Sentry.Replay({
+    Sentry.replayIntegration({
       // Additional Replay configuration goes in here, for example:
       maskAllText: getEnvironment() === "local",
       blockAllMedia: getEnvironment() === "local",
     }),
-    new Sentry.BrowserTracing(),
+    Sentry.browserTracingIntegration(),
   ],
 });
 

src/instrumentation.ts

@@ -0,0 +1,22 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+import * as Sentry from "@sentry/nextjs";
+
+export function register() {
+  if (process.env.NEXT_RUNTIME === "nodejs") {
+    Sentry.init({
+      environment: process.env.APP_ENV,
+      dsn: process.env.SENTRY_DSN,
+
+      // Adjust this value in production, or use tracesSampler for greater control
+      tracesSampleRate: ["local", "heroku"].includes(process.env.NODE_ENV)
+        ? 1.0
+        : 0.1,
+
+      // Setting this option to true will print useful information to the console while you're setting up Sentry.
+      debug: false,
+    });
+  }
+}

src/middleware.ts

@@ -5,7 +5,6 @@
 import { NextResponse } from "next/server";
 import type { NextRequest } from "next/server";
 import nextConfig from "../next.config";
-import { NextConfig } from "next";
 
 // This function can be marked `async` if using `await` inside
 export function middleware(request: NextRequest) {
@@ -68,9 +67,7 @@ function generateCspData() {
     // `withSentryConfig` in next.config.js messes up the type, but we know that
     // it's a valid NextConfig with `images.remotePatterns` set:
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    `img-src 'self' https://*.google-analytics.com https://*.googletagmanager.com https://firefoxusercontent.com https://mozillausercontent.com https://monitor.cdn.mozilla.net ${(
-      nextConfig as NextConfig
-    )
+    `img-src 'self' https://*.google-analytics.com https://*.googletagmanager.com https://firefoxusercontent.com https://mozillausercontent.com https://monitor.cdn.mozilla.net ${nextConfig
       .images!.remotePatterns!.map(
         (pattern) =>
           `${pattern.protocol ?? "https"}://${pattern.hostname.replace(