From 263a31f1561e5339d6fb63b2e7bfa6cdfe4e5f96 Mon Sep 17 00:00:00 2001 From: s1gr1d Date: Mon, 22 Jul 2024 13:45:55 +0200 Subject: [PATCH 1/4] test(nuxt): Add Nuxt 3 E2E test for client --- .../test-applications/nuxt-3/.gitignore | 24 +++++++++++++++ .../e2e-tests/test-applications/nuxt-3/.npmrc | 2 ++ .../test-applications/nuxt-3/app.vue | 13 ++++++++ .../nuxt-3/components/ErrorButton.vue | 9 ++++++ .../test-applications/nuxt-3/nuxt.config.ts | 4 +++ .../test-applications/nuxt-3/package.json | 24 +++++++++++++++ .../nuxt-3/pages/client-error.vue | 10 ++++++ .../test-applications/nuxt-3/pages/index.vue | 3 ++ .../nuxt-3/playwright.config.ts | 16 ++++++++++ .../nuxt-3/public/favicon.ico | Bin 0 -> 4286 bytes .../nuxt-3/sentry.client.config.ts | 8 +++++ .../nuxt-3/start-event-proxy.mjs | 6 ++++ .../nuxt-3/tests/errors.client.test.ts | 29 ++++++++++++++++++ .../test-applications/nuxt-3/tsconfig.json | 4 +++ 14 files changed, 152 insertions(+) create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/.gitignore create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/.npmrc create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/app.vue create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/components/ErrorButton.vue create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/nuxt.config.ts create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/package.json create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/pages/client-error.vue create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/pages/index.vue create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/playwright.config.ts create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/public/favicon.ico create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/sentry.client.config.ts create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/start-event-proxy.mjs create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/tests/errors.client.test.ts create mode 100644 dev-packages/e2e-tests/test-applications/nuxt-3/tsconfig.json diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/.gitignore b/dev-packages/e2e-tests/test-applications/nuxt-3/.gitignore new file mode 100644 index 000000000000..4a7f73a2ed0d --- /dev/null +++ b/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 diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/.npmrc b/dev-packages/e2e-tests/test-applications/nuxt-3/.npmrc new file mode 100644 index 000000000000..070f80f05092 --- /dev/null +++ b/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 diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/app.vue b/dev-packages/e2e-tests/test-applications/nuxt-3/app.vue new file mode 100644 index 000000000000..06f3020220dd --- /dev/null +++ b/dev-packages/e2e-tests/test-applications/nuxt-3/app.vue @@ -0,0 +1,13 @@ + + diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/components/ErrorButton.vue b/dev-packages/e2e-tests/test-applications/nuxt-3/components/ErrorButton.vue new file mode 100644 index 000000000000..84d8a7ac05ef --- /dev/null +++ b/dev-packages/e2e-tests/test-applications/nuxt-3/components/ErrorButton.vue @@ -0,0 +1,9 @@ + + + diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/nuxt.config.ts b/dev-packages/e2e-tests/test-applications/nuxt-3/nuxt.config.ts new file mode 100644 index 000000000000..87cff074ccd9 --- /dev/null +++ b/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'], +}); diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/package.json b/dev-packages/e2e-tests/test-applications/nuxt-3/package.json new file mode 100644 index 000000000000..72acea9f33b6 --- /dev/null +++ b/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" + } +} diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/pages/client-error.vue b/dev-packages/e2e-tests/test-applications/nuxt-3/pages/client-error.vue new file mode 100644 index 000000000000..d4054f7e8bee --- /dev/null +++ b/dev-packages/e2e-tests/test-applications/nuxt-3/pages/client-error.vue @@ -0,0 +1,10 @@ + + + + + + diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/pages/index.vue b/dev-packages/e2e-tests/test-applications/nuxt-3/pages/index.vue new file mode 100644 index 000000000000..74513c5697f3 --- /dev/null +++ b/dev-packages/e2e-tests/test-applications/nuxt-3/pages/index.vue @@ -0,0 +1,3 @@ + diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/playwright.config.ts b/dev-packages/e2e-tests/test-applications/nuxt-3/playwright.config.ts new file mode 100644 index 000000000000..f270a5ad9b48 --- /dev/null +++ b/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; diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/public/favicon.ico b/dev-packages/e2e-tests/test-applications/nuxt-3/public/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..18993ad91cfd43e03b074dd0b5cc3f37ab38e49c GIT binary patch literal 4286 zcmeHLOKuuL5PjK%MHWVi6lD zOGiREbCw`xmFozJ^aNatJY>w+g ze6a2@u~m#^BZm@8wco9#Crlli0uLb^3E$t2-WIc^#(?t)*@`UpuofJ(Uyh@F>b3Ph z$D^m8Xq~pTkGJ4Q`Q2)te3mgkWYZ^Ijq|hkiP^9`De={bQQ%heZC$QU2UpP(-tbl8 zPWD2abEew;oat@w`uP3J^YpsgT%~jT(Dk%oU}sa$7|n6hBjDj`+I;RX(>)%lm_7N{+B7Mu%H?422lE%MBJH!!YTN2oT7xr>>N-8OF$C&qU^ z>vLsa{$0X%q1fjOe3P1mCv#lN{xQ4_*HCSAZjTb1`}mlc+9rl8$B3OP%VT@mch_~G z7Y+4b{r>9e=M+7vSI;BgB?ryZDY4m>&wcHSn81VH1N~`0gvwH{ z8dv#hG|OK`>1;j7tM#B)Z7zDN?{6=dUal}$e { + test('captures error thrown on click', async ({ page }) => { + const errorPromise = waitForError('nuxt-3', async errorEvent => { + return errorEvent?.exception?.values?.[0]?.value === 'Error thrown from Nuxt-3 E2E test app'; + }); + + await page.goto(`/client-error`); + await page.locator('#errorBtn').click(); + + const error = await errorPromise; + + expect(error).toMatchObject({ + exception: { + values: [ + { + type: 'Error', + value: 'Error thrown from Nuxt-3 E2E test app', + mechanism: { + handled: false, + }, + }, + ], + }, + }); + }); +}); diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/tsconfig.json b/dev-packages/e2e-tests/test-applications/nuxt-3/tsconfig.json new file mode 100644 index 000000000000..a746f2a70c28 --- /dev/null +++ b/dev-packages/e2e-tests/test-applications/nuxt-3/tsconfig.json @@ -0,0 +1,4 @@ +{ + // https://nuxt.com/docs/guide/concepts/typescript + "extends": "./.nuxt/tsconfig.json" +} From a66b927c00ca8c9112044cb161f2e023a1b747ae Mon Sep 17 00:00:00 2001 From: s1gr1d Date: Mon, 22 Jul 2024 14:23:00 +0200 Subject: [PATCH 2/4] add nuxt-3 to CI jobs --- .github/workflows/build.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml index 3f8cd2ac44ac..5ee7211b5a71 100644 --- a/.github/workflows/build.yml +++ b/.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' From e2c304202319ea36a7012576c76302903f1a3ca0 Mon Sep 17 00:00:00 2001 From: s1gr1d Date: Mon, 22 Jul 2024 14:34:02 +0200 Subject: [PATCH 3/4] add tracingIntegration --- .../e2e-tests/test-applications/nuxt-3/sentry.client.config.ts | 1 + .../test-applications/nuxt-3/tests/errors.client.test.ts | 1 + 2 files changed, 2 insertions(+) diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/sentry.client.config.ts b/dev-packages/e2e-tests/test-applications/nuxt-3/sentry.client.config.ts index 5253d08c90f0..48792377fde3 100644 --- a/dev-packages/e2e-tests/test-applications/nuxt-3/sentry.client.config.ts +++ b/dev-packages/e2e-tests/test-applications/nuxt-3/sentry.client.config.ts @@ -5,4 +5,5 @@ Sentry.init({ dsn: 'https://public@dsn.ingest.sentry.io/1337', tunnel: `http://localhost:3031/`, // proxy server tracesSampleRate: 1.0, + integrations: [Sentry.browserTracingIntegration()] }); diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/tests/errors.client.test.ts b/dev-packages/e2e-tests/test-applications/nuxt-3/tests/errors.client.test.ts index 091a4b16d028..cd0ae9051f71 100644 --- a/dev-packages/e2e-tests/test-applications/nuxt-3/tests/errors.client.test.ts +++ b/dev-packages/e2e-tests/test-applications/nuxt-3/tests/errors.client.test.ts @@ -25,5 +25,6 @@ test.describe('client-side errors', async () => { ], }, }); + expect(error.transaction).toEqual('/client-error'); }); }); From 77642f981ca40e4251afce977677cdc989d76a03 Mon Sep 17 00:00:00 2001 From: s1gr1d Date: Mon, 22 Jul 2024 14:55:20 +0200 Subject: [PATCH 4/4] fix formatting --- .../e2e-tests/test-applications/nuxt-3/sentry.client.config.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dev-packages/e2e-tests/test-applications/nuxt-3/sentry.client.config.ts b/dev-packages/e2e-tests/test-applications/nuxt-3/sentry.client.config.ts index 48792377fde3..755a0f43e919 100644 --- a/dev-packages/e2e-tests/test-applications/nuxt-3/sentry.client.config.ts +++ b/dev-packages/e2e-tests/test-applications/nuxt-3/sentry.client.config.ts @@ -5,5 +5,5 @@ Sentry.init({ dsn: 'https://public@dsn.ingest.sentry.io/1337', tunnel: `http://localhost:3031/`, // proxy server tracesSampleRate: 1.0, - integrations: [Sentry.browserTracingIntegration()] + integrations: [Sentry.browserTracingIntegration()], });