feat(effect): Add Effect v4 beta support

dev-packages/e2e-tests/test-applications/effect-browser/package.json → dev-packages/e2e-tests/test-applications/effect-3-browser/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "effect-browser-test-app",
+  "name": "effect-3-browser-test-app",
   "version": "1.0.0",
   "private": true,
   "scripts": {

dev-packages/e2e-tests/test-applications/effect-3-browser/start-event-proxy.mjs

@@ -0,0 +1,6 @@
+import { startEventProxyServer } from '@sentry-internal/test-utils';
+
+startEventProxyServer({
+  port: 3031,
+  proxyServerName: 'effect-3-browser',
+});

dev-packages/e2e-tests/test-applications/effect-browser/tests/errors.test.ts → dev-packages/e2e-tests/test-applications/effect-3-browser/tests/errors.test.ts

@@ -2,7 +2,7 @@ import { expect, test } from '@playwright/test';
 import { waitForError, waitForTransaction } from '@sentry-internal/test-utils';
 
 test('captures an error', async ({ page }) => {
-  const errorEventPromise = waitForError('effect-browser', event => {
+  const errorEventPromise = waitForError('effect-3-browser', event => {
     return !event.type && event.exception?.values?.[0]?.value === 'I am an error!';
   });
 
@@ -29,11 +29,11 @@ test('captures an error', async ({ page }) => {
 });
 
 test('sets correct transactionName', async ({ page }) => {
-  const transactionPromise = waitForTransaction('effect-browser', async transactionEvent => {
+  const transactionPromise = waitForTransaction('effect-3-browser', async transactionEvent => {
     return !!transactionEvent?.transaction && transactionEvent.contexts?.trace?.op === 'pageload';
   });
 
-  const errorEventPromise = waitForError('effect-browser', event => {
+  const errorEventPromise = waitForError('effect-3-browser', event => {
     return !event.type && event.exception?.values?.[0]?.value === 'I am an error!';
   });
 

dev-packages/e2e-tests/test-applications/effect-browser/tests/logs.test.ts → dev-packages/e2e-tests/test-applications/effect-3-browser/tests/logs.test.ts

@@ -3,7 +3,7 @@ import { waitForEnvelopeItem } from '@sentry-internal/test-utils';
 import type { SerializedLogContainer } from '@sentry/core';
 
 test('should send Effect debug logs', async ({ page }) => {
-  const logEnvelopePromise = waitForEnvelopeItem('effect-browser', envelope => {
+  const logEnvelopePromise = waitForEnvelopeItem('effect-3-browser', envelope => {
     return (
       envelope[0].type === 'log' &&
       (envelope[1] as SerializedLogContainer).items.some(
@@ -26,7 +26,7 @@ test('should send Effect debug logs', async ({ page }) => {
 });
 
 test('should send Effect info logs', async ({ page }) => {
-  const logEnvelopePromise = waitForEnvelopeItem('effect-browser', envelope => {
+  const logEnvelopePromise = waitForEnvelopeItem('effect-3-browser', envelope => {
     return (
       envelope[0].type === 'log' &&
       (envelope[1] as SerializedLogContainer).items.some(
@@ -49,7 +49,7 @@ test('should send Effect info logs', async ({ page }) => {
 });
 
 test('should send Effect warning logs', async ({ page }) => {
-  const logEnvelopePromise = waitForEnvelopeItem('effect-browser', envelope => {
+  const logEnvelopePromise = waitForEnvelopeItem('effect-3-browser', envelope => {
     return (
       envelope[0].type === 'log' &&
       (envelope[1] as SerializedLogContainer).items.some(
@@ -72,7 +72,7 @@ test('should send Effect warning logs', async ({ page }) => {
 });
 
 test('should send Effect error logs', async ({ page }) => {
-  const logEnvelopePromise = waitForEnvelopeItem('effect-browser', envelope => {
+  const logEnvelopePromise = waitForEnvelopeItem('effect-3-browser', envelope => {
     return (
       envelope[0].type === 'log' &&
       (envelope[1] as SerializedLogContainer).items.some(
@@ -95,7 +95,7 @@ test('should send Effect error logs', async ({ page }) => {
 });
 
 test('should send Effect logs with context attributes', async ({ page }) => {
-  const logEnvelopePromise = waitForEnvelopeItem('effect-browser', envelope => {
+  const logEnvelopePromise = waitForEnvelopeItem('effect-3-browser', envelope => {
     return (
       envelope[0].type === 'log' &&
       (envelope[1] as SerializedLogContainer).items.some(item => item.body === 'Log with context')

dev-packages/e2e-tests/test-applications/effect-browser/tests/transactions.test.ts → dev-packages/e2e-tests/test-applications/effect-3-browser/tests/transactions.test.ts

@@ -2,7 +2,7 @@ import { expect, test } from '@playwright/test';
 import { waitForTransaction } from '@sentry-internal/test-utils';
 
 test('captures a pageload transaction', async ({ page }) => {
-  const transactionPromise = waitForTransaction('effect-browser', async transactionEvent => {
+  const transactionPromise = waitForTransaction('effect-3-browser', async transactionEvent => {
     return !!transactionEvent?.transaction && transactionEvent.contexts?.trace?.op === 'pageload';
   });
 
@@ -49,11 +49,11 @@ test('captures a pageload transaction', async ({ page }) => {
 });
 
 test('captures a navigation transaction', async ({ page }) => {
-  const pageLoadTransactionPromise = waitForTransaction('effect-browser', async transactionEvent => {
+  const pageLoadTransactionPromise = waitForTransaction('effect-3-browser', async transactionEvent => {
     return !!transactionEvent?.transaction && transactionEvent.contexts?.trace?.op === 'pageload';
   });
 
-  const navigationTransactionPromise = waitForTransaction('effect-browser', async transactionEvent => {
+  const navigationTransactionPromise = waitForTransaction('effect-3-browser', async transactionEvent => {
     return !!transactionEvent?.transaction && transactionEvent.contexts?.trace?.op === 'navigation';
   });
 
@@ -80,11 +80,11 @@ test('captures a navigation transaction', async ({ page }) => {
 });
 
 test('captures Effect spans with correct parent-child structure', async ({ page }) => {
-  const pageloadPromise = waitForTransaction('effect-browser', transactionEvent => {
+  const pageloadPromise = waitForTransaction('effect-3-browser', transactionEvent => {
     return transactionEvent?.contexts?.trace?.op === 'pageload';
   });
 
-  const transactionPromise = waitForTransaction('effect-browser', transactionEvent => {
+  const transactionPromise = waitForTransaction('effect-3-browser', transactionEvent => {
     return (
       transactionEvent?.contexts?.trace?.op === 'ui.action.click' &&
       transactionEvent.spans?.some(span => span.description === 'custom-effect-span')

dev-packages/e2e-tests/test-applications/effect-node/package.json → dev-packages/e2e-tests/test-applications/effect-3-node/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "effect-node-app",
+  "name": "effect-3-node-app",
   "version": "1.0.0",
   "private": true,
   "type": "module",

dev-packages/e2e-tests/test-applications/effect-node/start-event-proxy.mjs → dev-packages/e2e-tests/test-applications/effect-3-node/start-event-proxy.mjs

@@ -2,5 +2,5 @@ import { startEventProxyServer } from '@sentry-internal/test-utils';
 
 startEventProxyServer({
   port: 3031,
-  proxyServerName: 'effect-node',
+  proxyServerName: 'effect-3-node',
 });

dev-packages/e2e-tests/test-applications/effect-node/tests/errors.test.ts → dev-packages/e2e-tests/test-applications/effect-3-node/tests/errors.test.ts

@@ -2,7 +2,7 @@ import { expect, test } from '@playwright/test';
 import { waitForError } from '@sentry-internal/test-utils';
 
 test('Captures manually reported error', async ({ baseURL }) => {
-  const errorEventPromise = waitForError('effect-node', event => {
+  const errorEventPromise = waitForError('effect-3-node', event => {
     return !event.type && event.exception?.values?.[0]?.value === 'This is an error';
   });
 
@@ -17,7 +17,7 @@ test('Captures manually reported error', async ({ baseURL }) => {
 });
 
 test('Captures thrown exception', async ({ baseURL }) => {
-  const errorEventPromise = waitForError('effect-node', event => {
+  const errorEventPromise = waitForError('effect-3-node', event => {
     return !event.type && event.exception?.values?.[0]?.value === 'This is an exception with id 123';
   });
 
@@ -30,7 +30,7 @@ test('Captures thrown exception', async ({ baseURL }) => {
 });
 
 test('Captures Effect.fail as error', async ({ baseURL }) => {
-  const errorEventPromise = waitForError('effect-node', event => {
+  const errorEventPromise = waitForError('effect-3-node', event => {
     return !event.type && event.exception?.values?.[0]?.value === 'Effect failure';
   });
 
@@ -43,7 +43,7 @@ test('Captures Effect.fail as error', async ({ baseURL }) => {
 });
 
 test('Captures Effect.die as error', async ({ baseURL }) => {
-  const errorEventPromise = waitForError('effect-node', event => {
+  const errorEventPromise = waitForError('effect-3-node', event => {
     return !event.type && event.exception?.values?.[0]?.value?.includes('Effect defect');
   });
 

dev-packages/e2e-tests/test-applications/effect-node/tests/logs.test.ts → dev-packages/e2e-tests/test-applications/effect-3-node/tests/logs.test.ts

@@ -3,7 +3,7 @@ import { waitForEnvelopeItem } from '@sentry-internal/test-utils';
 import type { SerializedLogContainer } from '@sentry/core';
 
 test('should send Effect debug logs', async ({ baseURL }) => {
-  const logEnvelopePromise = waitForEnvelopeItem('effect-node', envelope => {
+  const logEnvelopePromise = waitForEnvelopeItem('effect-3-node', envelope => {
     return (
       envelope[0].type === 'log' &&
       (envelope[1] as SerializedLogContainer).items.some(
@@ -22,7 +22,7 @@ test('should send Effect debug logs', async ({ baseURL }) => {
 });
 
 test('should send Effect info logs', async ({ baseURL }) => {
-  const logEnvelopePromise = waitForEnvelopeItem('effect-node', envelope => {
+  const logEnvelopePromise = waitForEnvelopeItem('effect-3-node', envelope => {
     return (
       envelope[0].type === 'log' &&
       (envelope[1] as SerializedLogContainer).items.some(
@@ -41,7 +41,7 @@ test('should send Effect info logs', async ({ baseURL }) => {
 });
 
 test('should send Effect warning logs', async ({ baseURL }) => {
-  const logEnvelopePromise = waitForEnvelopeItem('effect-node', envelope => {
+  const logEnvelopePromise = waitForEnvelopeItem('effect-3-node', envelope => {
     return (
       envelope[0].type === 'log' &&
       (envelope[1] as SerializedLogContainer).items.some(
@@ -60,7 +60,7 @@ test('should send Effect warning logs', async ({ baseURL }) => {
 });
 
 test('should send Effect error logs', async ({ baseURL }) => {
-  const logEnvelopePromise = waitForEnvelopeItem('effect-node', envelope => {
+  const logEnvelopePromise = waitForEnvelopeItem('effect-3-node', envelope => {
     return (
       envelope[0].type === 'log' &&
       (envelope[1] as SerializedLogContainer).items.some(
@@ -79,7 +79,7 @@ test('should send Effect error logs', async ({ baseURL }) => {
 });
 
 test('should send Effect logs with context attributes', async ({ baseURL }) => {
-  const logEnvelopePromise = waitForEnvelopeItem('effect-node', envelope => {
+  const logEnvelopePromise = waitForEnvelopeItem('effect-3-node', envelope => {
     return (
       envelope[0].type === 'log' &&
       (envelope[1] as SerializedLogContainer).items.some(item => item.body === 'Log with context')

dev-packages/e2e-tests/test-applications/effect-node/tests/transactions.test.ts → dev-packages/e2e-tests/test-applications/effect-3-node/tests/transactions.test.ts

@@ -2,7 +2,7 @@ import { expect, test } from '@playwright/test';
 import { waitForTransaction } from '@sentry-internal/test-utils';
 
 test('Sends an HTTP transaction', async ({ baseURL }) => {
-  const transactionEventPromise = waitForTransaction('effect-node', transactionEvent => {
+  const transactionEventPromise = waitForTransaction('effect-3-node', transactionEvent => {
     return transactionEvent?.transaction === 'http.server GET';
   });
 
@@ -14,7 +14,7 @@ test('Sends an HTTP transaction', async ({ baseURL }) => {
 });
 
 test('Sends transaction with manual Effect span', async ({ baseURL }) => {
-  const transactionEventPromise = waitForTransaction('effect-node', transactionEvent => {
+  const transactionEventPromise = waitForTransaction('effect-3-node', transactionEvent => {
     return (
       transactionEvent?.transaction === 'http.server GET' &&
       transactionEvent?.spans?.some(span => span.description === 'test-span')
@@ -36,7 +36,7 @@ test('Sends transaction with manual Effect span', async ({ baseURL }) => {
 });
 
 test('Sends Effect spans with correct parent-child structure', async ({ baseURL }) => {
-  const transactionEventPromise = waitForTransaction('effect-node', transactionEvent => {
+  const transactionEventPromise = waitForTransaction('effect-3-node', transactionEvent => {
     return (
       transactionEvent?.transaction === 'http.server GET' &&
       transactionEvent?.spans?.some(span => span.description === 'custom-effect-span')
@@ -87,7 +87,7 @@ test('Sends Effect spans with correct parent-child structure', async ({ baseURL
 });
 
 test('Sends transaction for error route', async ({ baseURL }) => {
-  const transactionEventPromise = waitForTransaction('effect-node', transactionEvent => {
+  const transactionEventPromise = waitForTransaction('effect-3-node', transactionEvent => {
     return transactionEvent?.transaction === 'http.server GET';
   });
 

dev-packages/e2e-tests/test-applications/effect-4-browser/.gitignore

@@ -0,0 +1,28 @@
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+/dist
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+/test-results/
+/playwright-report/
+/playwright/.cache/
+
+!*.d.ts

dev-packages/e2e-tests/test-applications/effect-4-browser/.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/effect-4-browser/build.mjs

@@ -0,0 +1,52 @@
+import * as path from 'path';
+import * as url from 'url';
+import HtmlWebpackPlugin from 'html-webpack-plugin';
+import TerserPlugin from 'terser-webpack-plugin';
+import webpack from 'webpack';
+
+const __dirname = path.dirname(url.fileURLToPath(import.meta.url));
+
+webpack(
+  {
+    entry: path.join(__dirname, 'src/index.js'),
+    output: {
+      path: path.join(__dirname, 'build'),
+      filename: 'app.js',
+    },
+    optimization: {
+      minimize: true,
+      minimizer: [new TerserPlugin()],
+    },
+    plugins: [
+      new webpack.EnvironmentPlugin(['E2E_TEST_DSN']),
+      new HtmlWebpackPlugin({
+        template: path.join(__dirname, 'public/index.html'),
+      }),
+    ],
+    performance: {
+      hints: false,
+    },
+    mode: 'production',
+  },
+  (err, stats) => {
+    if (err) {
+      console.error(err.stack || err);
+      if (err.details) {
+        console.error(err.details);
+      }
+      return;
+    }
+
+    const info = stats.toJson();
+
+    if (stats.hasErrors()) {
+      console.error(info.errors);
+      process.exit(1);
+    }
+
+    if (stats.hasWarnings()) {
+      console.warn(info.warnings);
+      process.exit(1);
+    }
+  },
+);

dev-packages/e2e-tests/test-applications/effect-4-browser/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "effect-4-browser-test-app",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "start": "serve -s build",
+    "build": "node build.mjs",
+    "test": "playwright test",
+    "clean": "npx rimraf node_modules pnpm-lock.yaml",
+    "test:build": "pnpm install && pnpm build",
+    "test:assert": "pnpm test"
+  },
+  "dependencies": {
+    "@sentry/effect": "latest || *",
+    "@types/node": "^18.19.1",
+    "effect": "^4.0.0-beta.50",
+    "typescript": "~5.0.0"
+  },
+  "devDependencies": {
+    "@playwright/test": "~1.56.0",
+    "@sentry-internal/test-utils": "link:../../../test-utils",
+    "webpack": "^5.91.0",
+    "serve": "14.0.1",
+    "terser-webpack-plugin": "^5.3.10",
+    "html-webpack-plugin": "^5.6.0"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "volta": {
+    "node": "22.15.0",
+    "extends": "../../package.json"
+  }
+}

dev-packages/e2e-tests/test-applications/effect-4-browser/playwright.config.mjs

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