feat(nuxt): Conditionally use plugins based on Nitro version (v2/v3)

dev-packages/e2e-tests/test-applications/nuxt-5/.gitignore

@@ -0,0 +1,24 @@
+# Nuxt dev/build outputs
+.output
+.data
+.nuxt
+.nitro
+.cache
+dist
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
+.env
+.env.*
+!.env.example

dev-packages/e2e-tests/test-applications/nuxt-5/.npmrc

@@ -0,0 +1,2 @@
+@sentry:registry=http://127.0.0.1:4873
+@sentry-internal:registry=http://127.0.0.1:4873

dev-packages/e2e-tests/test-applications/nuxt-5/app/components/ErrorButton.vue

@@ -0,0 +1,22 @@
+<script setup>
+import { defineProps } from 'vue';
+
+const props = defineProps({
+  errorText: {
+    type: String,
+    required: true,
+  },
+  id: {
+    type: String,
+    required: true,
+  },
+});
+
+const triggerError = () => {
+  throw new Error(props.errorText);
+};
+</script>
+
+<template>
+  <button :id="props.id" @click="triggerError">Trigger Error</button>
+</template>

dev-packages/e2e-tests/test-applications/nuxt-5/app/composables/use-sentry-test-tag.ts

@@ -0,0 +1,8 @@
+// fixme: this needs to be imported from @sentry/core, not @sentry/nuxt in dev mode (because of import-in-the-middle error)
+// This could also be a problem with the specific setup of the pnpm E2E test setup, because this could not be reproduced outside of the E2E test.
+// Related to this: https://github.com/getsentry/sentry-javascript/issues/15204#issuecomment-2948908130
+import { setTag } from '@sentry/nuxt';
+
+export default function useSentryTestTag(): void {
+  setTag('test-tag', null);
+}

dev-packages/e2e-tests/test-applications/nuxt-5/app/pages/client-error.vue

@@ -0,0 +1,16 @@
+<script setup>
+import ErrorButton from '../components/ErrorButton.vue';
+
+const catchErr = () => {
+  console.log('Additional functionality in NuxtErrorBoundary');
+};
+</script>
+
+<template>
+  <ErrorButton id="errorBtn" error-text="Error thrown from nuxt-5 E2E test app" />
+  <ErrorButton id="errorBtn2" error-text="Another Error thrown from nuxt-5 E2E test app" />
+
+  <NuxtErrorBoundary @error="catchErr">
+    <ErrorButton id="error-in-error-boundary" error-text="Error thrown in Error Boundary" />
+  </NuxtErrorBoundary>
+</template>

dev-packages/e2e-tests/test-applications/nuxt-5/app/pages/fetch-server-routes.vue

@@ -0,0 +1,18 @@
+<template>
+  <div>
+    <button @click="fetchError">Fetch Server API Error</button>
+    <button @click="fetchNitroFetch">Fetch Nitro $fetch</button>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { useFetch } from '#imports';
+
+const fetchError = async () => {
+  await useFetch('/api/server-error');
+};
+
+const fetchNitroFetch = async () => {
+  await useFetch('/api/nitro-fetch');
+};
+</script>

dev-packages/e2e-tests/test-applications/nuxt-5/app/pages/index.vue

@@ -0,0 +1,20 @@
+<template>
+  <NuxtLayout>
+    <header>
+      <nav>
+        <ul>
+          <li><NuxtLink to="/fetch-server-routes">Fetch Server Routes</NuxtLink></li>
+          <li><NuxtLink to="/test-param/1234">Fetch Param</NuxtLink></li>
+          <li><NuxtLink to="/client-error">Client Error</NuxtLink></li>
+        </ul>
+      </nav>
+    </header>
+    <NuxtPage />
+  </NuxtLayout>
+</template>
+
+<script setup lang="ts">
+import { useSentryTestTag } from '#imports';
+
+useSentryTestTag();
+</script>

dev-packages/e2e-tests/test-applications/nuxt-5/app/pages/rendering-modes/client-side-only-page.vue

@@ -0,0 +1 @@
+<template><p>Client Side Only Page</p></template>

dev-packages/e2e-tests/test-applications/nuxt-5/app/pages/rendering-modes/isr-1h-cached-page.vue

@@ -0,0 +1 @@
+<template><p>ISR 1h Cached Page</p></template>

dev-packages/e2e-tests/test-applications/nuxt-5/app/pages/rendering-modes/isr-cached-page.vue

@@ -0,0 +1 @@
+<template><p>ISR Cached Page</p></template>

dev-packages/e2e-tests/test-applications/nuxt-5/app/pages/rendering-modes/pre-rendered-page.vue

@@ -0,0 +1 @@
+<template><p>Pre-Rendered Page</p></template>

dev-packages/e2e-tests/test-applications/nuxt-5/app/pages/rendering-modes/swr-1h-cached-page.vue

@@ -0,0 +1 @@
+<template><p>SWR 1h Cached Page</p></template>

dev-packages/e2e-tests/test-applications/nuxt-5/app/pages/rendering-modes/swr-cached-page.vue

@@ -0,0 +1 @@
+<template><p>SWR Cached Page</p></template>

dev-packages/e2e-tests/test-applications/nuxt-5/app/pages/test-param/[param].vue

@@ -0,0 +1,22 @@
+<script setup lang="ts">
+import { useRoute, useFetch } from '#imports';
+
+const route = useRoute();
+const param = route.params.param;
+
+const fetchError = async () => {
+  await useFetch(`/api/param-error/${param}`);
+};
+
+const fetchData = async () => {
+  await useFetch(`/api/test-param/${param}`);
+};
+</script>
+
+<template>
+  <p>Param: {{ $route.params.param }}</p>
+
+  <ErrorButton id="errorBtn" errorText="Error thrown from Param Route Button" />
+  <button @click="fetchData">Fetch Server Data</button>
+  <button @click="fetchError">Fetch Server API Error</button>
+</template>

dev-packages/e2e-tests/test-applications/nuxt-5/app/pages/test-param/user/[userId].vue

@@ -0,0 +1,16 @@
+<script setup lang="ts">
+import { useFetch, useRoute } from '#imports';
+
+const route = useRoute();
+const userId = route.params.userId as string;
+
+const { data } = await useFetch(`/api/user/${userId}`, {
+  server: false, // Don't fetch during SSR, only client-side
+});
+</script>
+
+<template>
+  <div>
+    <p v-if="data">User ID: {{ data }}</p>
+  </div>
+</template>

dev-packages/e2e-tests/test-applications/nuxt-5/modules/another-module.ts

@@ -0,0 +1,9 @@
+import { defineNuxtModule } from 'nuxt/kit';
+
+// Just a fake module to check if the SDK works alongside other local Nuxt modules without breaking the build
+export default defineNuxtModule({
+  meta: { name: 'another-module' },
+  setup() {
+    console.log('another-module setup called');
+  },
+});

dev-packages/e2e-tests/test-applications/nuxt-5/nuxt-start-dev-server.bash

@@ -0,0 +1,46 @@
+#!/bin/bash
+# To enable Sentry in Nuxt dev, it needs the sentry.server.config.mjs file from the .nuxt folder.
+# First, we need to start 'nuxt dev' to generate the file, and then start 'nuxt dev' again with the NODE_OPTIONS to have Sentry enabled.
+
+# Using a different port to avoid playwright already starting with the tests for port 3030
+TEMP_PORT=3035
+
+# 1.  Start dev in background - this generates .nuxt folder
+pnpm dev -p $TEMP_PORT &
+DEV_PID=$!
+
+# 2.  Wait for the sentry.server.config.mjs file to appear
+echo "Waiting for .nuxt/dev/sentry.server.config.mjs file..."
+COUNTER=0
+while [ ! -f ".nuxt/dev/sentry.server.config.mjs" ] && [ $COUNTER -lt 30 ]; do
+    sleep 1
+    ((COUNTER++))
+done
+
+if [ ! -f ".nuxt/dev/sentry.server.config.mjs" ]; then
+    echo "ERROR: .nuxt/dev/sentry.server.config.mjs file never appeared!"
+    echo "This usually means the Nuxt dev server failed to start or generate the file. Try to rerun the test."
+    pkill -P $DEV_PID || kill $DEV_PID
+    exit 1
+fi
+
+# 3.  Cleanup
+echo "Found .nuxt/dev/sentry.server.config.mjs, stopping 'nuxt dev' process..."
+pkill -P $DEV_PID || kill $DEV_PID
+
+# Wait for port to be released
+echo "Waiting for port $TEMP_PORT to be released..."
+COUNTER=0
+# Check if port is still in use
+while lsof -i :$TEMP_PORT > /dev/null 2>&1 && [ $COUNTER -lt 10 ]; do
+    sleep 1
+    ((COUNTER++))
+done
+
+if lsof -i :$TEMP_PORT > /dev/null 2>&1; then
+    echo "WARNING: Port $TEMP_PORT still in use after 10 seconds, proceeding anyway..."
+else
+    echo "Port $TEMP_PORT released successfully"
+fi
+
+echo "Nuxt dev server can now be started with '--import ./.nuxt/dev/sentry.server.config.mjs'"

dev-packages/e2e-tests/test-applications/nuxt-5/nuxt.config.ts

@@ -0,0 +1,47 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+  compatibilityDate: '2025-07-15',
+  imports: { autoImport: false },
+
+  routeRules: {
+    '/rendering-modes/client-side-only-page': { ssr: false },
+    '/rendering-modes/isr-cached-page': { isr: true },
+    '/rendering-modes/isr-1h-cached-page': { isr: 3600 },
+    '/rendering-modes/swr-cached-page': { swr: true },
+    '/rendering-modes/swr-1h-cached-page': { swr: 3600 },
+    '/rendering-modes/pre-rendered-page': { prerender: true },
+  },
+
+  modules: ['@pinia/nuxt', '@sentry/nuxt/module'],
+  runtimeConfig: {
+    public: {
+      sentry: {
+        dsn: 'https://public@dsn.ingest.sentry.io/1337',
+      },
+    },
+  },
+  nitro: {
+    experimental: {
+      database: true,
+    },
+    database: {
+      default: {
+        connector: 'sqlite',
+        options: { name: 'db' },
+      },
+      users: {
+        connector: 'sqlite',
+        options: { name: 'users_db' },
+      },
+      analytics: {
+        connector: 'sqlite',
+        options: { name: 'analytics_db' },
+      },
+    },
+    storage: {
+      'test-storage': {
+        driver: 'memory',
+      },
+    },
+  },
+});

dev-packages/e2e-tests/test-applications/nuxt-5/package.json

@@ -0,0 +1,38 @@
+{
+  "name": "nuxt-5",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "nuxt build",
+    "dev": "nuxt dev",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview",
+    "start": "node .output/server/index.mjs",
+    "start:import": "node --import ./.output/server/sentry.server.config.mjs .output/server/index.mjs",
+    "clean": "npx nuxi cleanup",
+    "test": "playwright test",
+    "test:prod": "TEST_ENV=production playwright test",
+    "test:dev": "bash ./nuxt-start-dev-server.bash && TEST_ENV=development playwright test environment",
+    "test:build": "pnpm install && pnpm build",
+    "test:build-canary": "pnpm add nuxt@npm:nuxt-nightly@latest && pnpm add nitro@npm:nitro-nightly@latest && pnpm install --force && pnpm build",
+    "test:assert": "pnpm test:prod && pnpm test:dev"
+  },
+  "//": [
+    "Currently, we need to install the latest version of Nitro and the Nuxt nightlies as those contain Nuxt v5",
+    "TODO: remove nitro from dependencies"
+  ],
+  "dependencies": {
+    "@pinia/nuxt": "^0.11.3",
+    "@sentry/nuxt": "latest || *",
+    "nitro": "latest",
+    "nuxt": "npm:nuxt-nightly@5x"
+  },
+  "devDependencies": {
+    "@playwright/test": "~1.56.0",
+    "@sentry-internal/test-utils": "link:../../../test-utils"
+  },
+  "volta": {
+    "extends": "../../package.json",
+    "node": "22.20.0"
+  }
+}

dev-packages/e2e-tests/test-applications/nuxt-5/playwright.config.ts

@@ -0,0 +1,25 @@
+import { getPlaywrightConfig } from '@sentry-internal/test-utils';
+
+const testEnv = process.env.TEST_ENV;
+
+if (!testEnv) {
+  throw new Error('No test env defined');
+}
+
+const getStartCommand = () => {
+  if (testEnv === 'development') {
+    return "NODE_OPTIONS='--import ./.nuxt/dev/sentry.server.config.mjs' nuxt dev -p 3030";
+  }
+
+  if (testEnv === 'production') {
+    return 'pnpm start:import';
+  }
+
+  throw new Error(`Unknown test env: ${testEnv}`);
+};
+
+const config = getPlaywrightConfig({
+  startCommand: getStartCommand(),
+});
+
+export default config;

dev-packages/e2e-tests/test-applications/nuxt-5/sentry.client.config.ts

@@ -0,0 +1,23 @@
+import * as Sentry from '@sentry/nuxt';
+import { /* usePinia,*/ useRuntimeConfig } from '#imports';
+
+Sentry.init({
+  dsn: useRuntimeConfig().public.sentry.dsn,
+  tunnel: `http://localhost:3031/`, // proxy server
+  tracesSampleRate: 1.0,
+  integrations: [
+    /* Sentry.piniaIntegration(usePinia(), {
+      actionTransformer: action => `${action}.transformed`,
+      stateTransformer: state => ({
+        transformed: true,
+        ...state,
+      }),
+    }),
+    */
+    Sentry.vueIntegration({
+      tracingOptions: {
+        trackComponents: true,
+      },
+    }),
+  ],
+});

dev-packages/e2e-tests/test-applications/nuxt-5/sentry.server.config.ts

@@ -0,0 +1,7 @@
+import * as Sentry from '@sentry/nuxt';
+
+Sentry.init({
+  dsn: 'https://public@dsn.ingest.sentry.io/1337',
+  tracesSampleRate: 1.0, //  Capture 100% of the transactions
+  tunnel: 'http://localhost:3031/', // proxy server
+});