test(nuxt): Add Nuxt 3 E2E test for client-side (#13002)

Adding E2E test app with `@nuxt/test-utils` based on the [Nuxt
docs](https://nuxt.com/docs/getting-started/testing#testing-in-a-browser).

Author: s1gr1d

.github/workflows/build.yml

@@ -1016,6 +1016,7 @@ jobs:
             'node-exports-test-app',
             'node-koa',
             'node-connect',
+            'nuxt-3',
             'vue-3',
             'webpack-4',
             'webpack-5'

dev-packages/e2e-tests/test-applications/nuxt-3/.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-3/.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-3/app.vue

@@ -0,0 +1,13 @@
+<template>
+  <NuxtLayout>
+    <header>
+      <nav>
+        <ul>
+          <li><NuxtLink to="/client-error">Client Error</NuxtLink></li>
+        </ul>
+      </nav>
+    </header>
+    <NuxtPage />
+  </NuxtLayout>
+</template>
+

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

@@ -0,0 +1,9 @@
+<script setup>
+const triggerError = () => {
+  throw new Error('Error thrown from Nuxt-3 E2E test app');
+};
+</script>
+
+<template>
+  <button id="errorBtn" @click="triggerError">Trigger Error</button>
+</template>

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

@@ -0,0 +1,4 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+  modules: ['@sentry/nuxt/module'],
+});

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

@@ -0,0 +1,24 @@
+{
+  "name": "nuxt-3",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "nuxt build",
+    "dev": "nuxt dev",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview",
+    "clean": "npx nuxi cleanup",
+    "test": "playwright test",
+    "test:build": "pnpm install && npx playwright install && pnpm build",
+    "test:assert": "pnpm test"
+  },
+  "dependencies": {
+    "@sentry/nuxt": "latest || *",
+    "nuxt": "3.11.2"
+  },
+  "devDependencies": {
+    "@nuxt/test-utils": "^3.13.1",
+    "@playwright/test": "^1.44.1",
+    "@sentry-internal/test-utils": "link:../../../test-utils"
+  }
+}

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

@@ -0,0 +1,10 @@
+<script setup>
+import ErrorButton from '../components/ErrorButton.vue';
+</script>
+
+<template>
+  <ErrorButton />
+</template>
+
+
+

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

@@ -0,0 +1,3 @@
+<template>
+<h1>Hello!</h1>
+</template>

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

@@ -0,0 +1,16 @@
+import { fileURLToPath } from 'node:url';
+import type { ConfigOptions } from '@nuxt/test-utils/playwright';
+import { getPlaywrightConfig } from '@sentry-internal/test-utils';
+
+const nuxtConfigOptions: ConfigOptions = {
+  nuxt: {
+    rootDir: fileURLToPath(new URL('.', import.meta.url)),
+  },
+};
+
+const config = getPlaywrightConfig({
+  startCommand: `pnpm preview`,
+  use: { ...nuxtConfigOptions },
+});
+
+export default config;