test: Refactor utils into @sentry-internal/test-utils (#12277)

Re-use this for playwright config in E2E tests.

Now, instead of repeating the whole playwright config, we can import the
util from `@sentry-internal/test-utils` and pass it some config.

I left the places where do not yet use the proxy, because for simplicity
I built the util in a way that assumes the proxy (you can override it,
but I figured not worth it for stuff that we will refactor soon anyhow).

While at it, I also streamlined the playwright version used everywhere
to an up-to-date version.

Author: mydea

.github/workflows/canary.yml

@@ -14,7 +14,7 @@ env:
 
   CACHED_BUILD_PATHS: |
     ${{ github.workspace }}/packages/*/*.tgz
-    ${{ github.workspace }}/dev-packages/event-proxy-server/build
+    ${{ github.workspace }}/dev-packages/test-utils/build
     ${{ github.workspace }}/node_modules
     ${{ github.workspace }}/packages/*/node_modules
     ${{ github.workspace }}/dev-packages/*/node_modules

dev-packages/browser-integration-tests/package.json

@@ -40,7 +40,7 @@
   },
   "dependencies": {
     "@babel/preset-typescript": "^7.16.7",
-    "@playwright/test": "^1.43.1",
+    "@playwright/test": "^1.44.1",
     "@sentry-internal/rrweb": "2.11.0",
     "@sentry/browser": "8.7.0",
     "axios": "1.6.7",

dev-packages/e2e-tests/test-applications/angular-17/package.json

@@ -29,11 +29,11 @@
     "zone.js": "~0.14.3"
   },
   "devDependencies": {
-    "@sentry-internal/event-proxy-server": "link:../../../event-proxy-server",
+    "@playwright/test": "^1.44.1",
+    "@sentry-internal/test-utils": "link:../../../test-utils",
     "@angular-devkit/build-angular": "^17.1.1",
     "@angular/cli": "^17.1.1",
     "@angular/compiler-cli": "^17.1.0",
-    "@playwright/test": "^1.41.1",
     "@types/jasmine": "~5.1.0",
     "http-server": "^14.1.1",
     "jasmine-core": "~5.1.0",
@@ -42,8 +42,7 @@
     "karma-coverage": "~2.2.0",
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "~2.1.0",
-    "typescript": "~5.3.2",
-    "wait-port": "1.0.4"
+    "typescript": "~5.3.2"
   },
   "volta": {
     "extends": "../../package.json"

dev-packages/e2e-tests/test-applications/angular-17/playwright.config.mjs

@@ -0,0 +1,8 @@
+import { getPlaywrightConfig } from '@sentry-internal/test-utils';
+
+const config = getPlaywrightConfig({
+  startCommand: `pnpm preview`,
+  port: 8080,
+});
+
+export default config;

dev-packages/e2e-tests/test-applications/angular-17/playwright.config.ts

@@ -5,11 +5,11 @@ import { appConfig } from './app/app.config';
 import * as Sentry from '@sentry/angular';
 
 Sentry.init({
+  // Cannot use process.env here, so we hardcode the DSN
   dsn: 'https://3b6c388182fb435097f41d181be2b2ba@o4504321058471936.ingest.sentry.io/4504321066008576',
   tracesSampleRate: 1.0,
   integrations: [Sentry.browserTracingIntegration({})],
   tunnel: `http://localhost:3031/`, // proxy server
-  debug: true,
 });
 
 bootstrapApplication(AppComponent, appConfig).catch(err => console.error(err));

dev-packages/e2e-tests/test-applications/angular-17/src/main.ts

@@ -1,4 +1,4 @@
-import { startEventProxyServer } from '@sentry-internal/event-proxy-server';
+import { startEventProxyServer } from '@sentry-internal/test-utils';
 
 startEventProxyServer({
   port: 3031,

dev-packages/e2e-tests/test-applications/angular-17/start-event-proxy.mjs

@@ -1,5 +1,5 @@
 import { expect, test } from '@playwright/test';
-import { waitForError, waitForTransaction } from '@sentry-internal/event-proxy-server';
+import { waitForError, waitForTransaction } from '@sentry-internal/test-utils';
 
 test('sends an error', async ({ page }) => {
   const errorPromise = waitForError('angular-17', async errorEvent => {

dev-packages/e2e-tests/test-applications/angular-17/tests/errors.test.ts

@@ -1,5 +1,5 @@
 import { expect, test } from '@playwright/test';
-import { waitForTransaction } from '@sentry-internal/event-proxy-server';
+import { waitForTransaction } from '@sentry-internal/test-utils';
 import { SEMANTIC_ATTRIBUTE_SENTRY_OP, SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN } from '@sentry/core';
 
 test('sends a pageload transaction with a parameterized URL', async ({ page }) => {

dev-packages/e2e-tests/test-applications/angular-17/tests/performance.test.ts

@@ -29,11 +29,11 @@
     "zone.js": "~0.14.3"
   },
   "devDependencies": {
-    "@sentry-internal/event-proxy-server": "link:../../../event-proxy-server",
+    "@playwright/test": "^1.44.1",
+    "@sentry-internal/test-utils": "link:../../../test-utils",
     "@angular-devkit/build-angular": "^18.0.0",
     "@angular/cli": "^18.0.0",
     "@angular/compiler-cli": "^18.0.0",
-    "@playwright/test": "^1.41.1",
     "@types/jasmine": "~5.1.0",
     "http-server": "^14.1.1",
     "jasmine-core": "~5.1.0",
@@ -42,8 +42,7 @@
     "karma-coverage": "~2.2.0",
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "~2.1.0",
-    "typescript": "~5.4.5",
-    "wait-port": "1.0.4"
+    "typescript": "~5.4.5"
   },
   "volta": {
     "extends": "../../package.json"

dev-packages/e2e-tests/test-applications/angular-18/package.json

@@ -0,0 +1,8 @@
+import { getPlaywrightConfig } from '@sentry-internal/test-utils';
+
+const config = getPlaywrightConfig({
+  startCommand: `pnpm preview`,
+  port: 8080,
+});
+
+export default config;

dev-packages/e2e-tests/test-applications/angular-18/playwright.config.mjs

@@ -5,11 +5,11 @@ import { appConfig } from './app/app.config';
 import * as Sentry from '@sentry/angular';
 
 Sentry.init({
+  // Cannot use process.env here, so we hardcode the DSN
   dsn: 'https://3b6c388182fb435097f41d181be2b2ba@o4504321058471936.ingest.sentry.io/4504321066008576',
   tracesSampleRate: 1.0,
   integrations: [Sentry.browserTracingIntegration({})],
   tunnel: `http://localhost:3031/`, // proxy server
-  debug: true,
 });
 
 bootstrapApplication(AppComponent, appConfig).catch(err => console.error(err));

dev-packages/e2e-tests/test-applications/angular-18/playwright.config.ts

@@ -1,4 +1,4 @@
-import { startEventProxyServer } from '@sentry-internal/event-proxy-server';
+import { startEventProxyServer } from '@sentry-internal/test-utils';
 
 startEventProxyServer({
   port: 3031,

dev-packages/e2e-tests/test-applications/angular-18/src/main.ts

@@ -1,5 +1,5 @@
 import { expect, test } from '@playwright/test';
-import { waitForError, waitForTransaction } from '@sentry-internal/event-proxy-server';
+import { waitForError, waitForTransaction } from '@sentry-internal/test-utils';
 
 test('sends an error', async ({ page }) => {
   const errorPromise = waitForError('angular-18', async errorEvent => {

dev-packages/e2e-tests/test-applications/angular-18/start-event-proxy.mjs

@@ -1,5 +1,5 @@
 import { expect, test } from '@playwright/test';
-import { waitForTransaction } from '@sentry-internal/event-proxy-server';
+import { waitForTransaction } from '@sentry-internal/test-utils';
 import { SEMANTIC_ATTRIBUTE_SENTRY_OP, SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN } from '@sentry/core';
 
 test('sends a pageload transaction with a parameterized URL', async ({ page }) => {

dev-packages/e2e-tests/test-applications/angular-18/tests/errors.test.ts

@@ -23,7 +23,7 @@
     "typescript": "4.9.5"
   },
   "devDependencies": {
-    "@playwright/test": "^1.27.1"
+    "@playwright/test": "^1.44.1"
   },
   "volta": {
     "extends": "../../package.json"

dev-packages/e2e-tests/test-applications/angular-18/tests/performance.test.ts

@@ -25,8 +25,8 @@
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@sentry-internal/event-proxy-server": "link:../../../event-proxy-server",
-    "@playwright/test": "^1.36.2",
+    "@playwright/test": "^1.44.1",
+    "@sentry-internal/test-utils": "link:../../../test-utils",
     "@remix-run/dev": "^2.7.2",
     "@sentry/types": "latest || *",
     "@sentry/utils": "latest || *",

dev-packages/e2e-tests/test-applications/create-next-app/package.json

@@ -0,0 +1,7 @@
+import { getPlaywrightConfig } from '@sentry-internal/test-utils';
+
+const config = getPlaywrightConfig({
+  startCommand: `pnpm dev`,
+});
+
+export default config;

dev-packages/e2e-tests/test-applications/create-remix-app-express-vite-dev/package.json

@@ -1,4 +1,4 @@
-import { startEventProxyServer } from '@sentry-internal/event-proxy-server';
+import { startEventProxyServer } from '@sentry-internal/test-utils';
 
 startEventProxyServer({
   port: 3031,