Skip to content

Commit a801d88

Browse files
onurtemizkanonurtemizkan
committed
feat(remix): Migrate to opentelemetry-instrumentation-remix.
1 parent ad4e9f7 commit a801d88

40 files changed

+390
-731
lines changed

‎dev-packages/e2e-tests/test-applications/create-remix-app-express-vite-dev/README.md

Lines changed: 0 additions & 36 deletions
This file was deleted.

‎dev-packages/e2e-tests/test-applications/create-remix-app-express-vite-dev/app/entry.server.tsx

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,5 @@
11
import * as Sentry from '@sentry/remix';
22

3-
Sentry.init({
4-
tracesSampleRate: 1.0, // Capture 100% of the transactions, reduce in production!
5-
environment: 'qa', // dynamic sampling bias to keep transactions
6-
dsn: process.env.E2E_TEST_DSN,
7-
tunnel: 'http://localhost:3031/', // proxy server
8-
});
9-
103
import { PassThrough } from 'node:stream';
114

125
import type { AppLoadContext, EntryContext } from '@remix-run/node';

‎dev-packages/e2e-tests/test-applications/create-remix-app-express-vite-dev/instrument.server.mjs

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import * as Sentry from '@sentry/remix';
2+
import * as process from 'process';
3+
4+
Sentry.init({
5+
tracesSampleRate: 1.0, // Capture 100% of the transactions, reduce in production!
6+
environment: 'qa', // dynamic sampling bias to keep transactions
7+
dsn: process.env.E2E_TEST_DSN,
8+
tunnel: 'http://localhost:3031/', // proxy server
9+
debug: true,
10+
});

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"sideEffects": false,
44
"scripts": {
55
"build": "remix vite:build",
6-
"dev": "node ./server.mjs",
6+
"dev": "NODE_OPTIONS='--import=./instrument.server.mjs' node ./server.mjs",
77
"lint": "eslint --ignore-path .gitignore --cache --cache-location ./node_modules/.cache/eslint .",
88
"start": "cross-env NODE_ENV=production node ./server.mjs",
99
"typecheck": "tsc",

‎dev-packages/e2e-tests/test-applications/create-remix-app-express-vite-dev/playwright.config.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,8 @@ const config: PlaywrightTestConfig = {
5959
{
6060
command: `PORT=${port} pnpm dev`,
6161
port: port,
62+
stdout: 'pipe',
63+
stderr: 'pipe',
6264
},
6365
],
6466
};

‎dev-packages/e2e-tests/test-applications/create-remix-app-express-vite-dev/server.mjs

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,11 @@
11
import { createRequestHandler } from '@remix-run/express';
22
import { installGlobals } from '@remix-run/node';
3-
import { wrapExpressCreateRequestHandler } from '@sentry/remix';
43
import compression from 'compression';
54
import express from 'express';
65
import morgan from 'morgan';
76

87
installGlobals();
98

10-
const sentryCreateRequestHandler = wrapExpressCreateRequestHandler(createRequestHandler);
11-
129
const viteDevServer =
1310
process.env.NODE_ENV === 'production'
1411
? undefined
@@ -42,7 +39,7 @@ app.use(morgan('tiny'));
4239
// handle SSR requests
4340
app.all(
4441
'*',
45-
sentryCreateRequestHandler({
42+
createRequestHandler({
4643
build: viteDevServer
4744
? () => viteDevServer.ssrLoadModule('virtual:remix/server-build')
4845
: await import('./build/server/index.js'),

‎dev-packages/e2e-tests/test-applications/create-remix-app-express/app/entry.server.tsx

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,7 @@
11
import * as Sentry from '@sentry/remix';
2-
import * as isbotModule from 'isbot';
3-
4-
Sentry.init({
5-
tracesSampleRate: 1.0, // Capture 100% of the transactions, reduce in production!
6-
environment: 'qa', // dynamic sampling bias to keep transactions
7-
dsn: process.env.E2E_TEST_DSN,
8-
tunnel: 'http://localhost:3031/', // proxy server
9-
sendDefaultPii: true, // Testing the FormData
10-
});
112

123
import { PassThrough } from 'node:stream';
4+
import * as isbotModule from 'isbot';
135

146
import type { AppLoadContext, EntryContext } from '@remix-run/node';
157
import { createReadableStreamFromReadable } from '@remix-run/node';

‎dev-packages/e2e-tests/test-applications/create-remix-app-express/app/routes/_index.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,9 @@ export default function Index() {
55
const [searchParams] = useSearchParams();
66

77
if (searchParams.get('tag')) {
8-
Sentry.setTag('sentry_test', searchParams.get('tag'));
8+
Sentry.setTags({
9+
sentry_test: searchParams.get('tag'),
10+
});
911
}
1012

1113
return (

‎dev-packages/e2e-tests/test-applications/create-remix-app-express/instrument.cjs

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
const Sentry = require('@sentry/remix');
2+
const process = require('process');
3+
4+
Sentry.init({
5+
tracesSampleRate: 1.0, // Capture 100% of the transactions, reduce in production!
6+
environment: 'qa', // dynamic sampling bias to keep transactions
7+
dsn: process.env.E2E_TEST_DSN,
8+
tunnel: 'http://localhost:3031/', // proxy server
9+
sendDefaultPii: true, // Testing the FormData
10+
captureActionFormDataKeys: {
11+
file: true,
12+
text: true,
13+
},
14+
});

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"build": "remix vite:build",
77
"dev": "node ./server.mjs",
88
"lint": "eslint --ignore-path .gitignore --cache --cache-location ./node_modules/.cache/eslint .",
9-
"start": "cross-env NODE_ENV=production node ./server.mjs",
9+
"start": "cross-env NODE_ENV=production node --require='./instrument.cjs' ./server.mjs",
1010
"typecheck": "tsc",
1111
"clean": "npx rimraf node_modules pnpm-lock.yaml",
1212
"test:build": "pnpm install && npx playwright install && pnpm build",

‎dev-packages/e2e-tests/test-applications/create-remix-app-express/server.mjs

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,11 @@
11
import { createRequestHandler } from '@remix-run/express';
22
import { installGlobals } from '@remix-run/node';
3-
import { wrapExpressCreateRequestHandler } from '@sentry/remix';
43
import compression from 'compression';
54
import express from 'express';
65
import morgan from 'morgan';
76

87
installGlobals();
98

10-
const sentryCreateRequestHandler = wrapExpressCreateRequestHandler(createRequestHandler);
11-
129
const viteDevServer =
1310
process.env.NODE_ENV === 'production'
1411
? undefined
@@ -42,7 +39,7 @@ app.use(morgan('tiny'));
4239
// handle SSR requests
4340
app.all(
4441
'*',
45-
sentryCreateRequestHandler({
42+
createRequestHandler({
4643
build: viteDevServer
4744
? () => viteDevServer.ssrLoadModule('virtual:remix/server-build')
4845
: await import('./build/server/index.js'),

‎dev-packages/e2e-tests/test-applications/create-remix-app-express/tests/behaviour-server.test.ts

Lines changed: 30 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -27,27 +27,44 @@ test('Sends form data with action error to Sentry', async ({ page }) => {
2727
await page.locator('button[type=submit]').click();
2828

2929
const formdataActionTransaction = waitForTransaction('create-remix-app-express', transactionEvent => {
30-
return transactionEvent?.spans?.some(span => span.op === 'function.remix.action');
30+
return transactionEvent?.spans?.some(span => span.data && span.data['code.function'] === 'action');
3131
});
3232

33-
const actionTransaction = await formdataActionTransaction;
33+
const actionSpan = (await formdataActionTransaction).spans.find(
34+
span => span.data && span.data['code.function'] === 'action',
35+
);
3436

35-
expect(actionTransaction).toBeDefined();
36-
expect(actionTransaction.contexts.trace.op).toBe('http.server');
37-
expect(actionTransaction.spans[0].data).toMatchObject({
38-
'remix.action_form_data.text': 'test',
39-
'remix.action_form_data.file': 'file.txt',
37+
expect(actionSpan).toBeDefined();
38+
expect(actionSpan.op).toBe('http');
39+
expect(actionSpan.data).toMatchObject({
40+
'formData.text': 'test',
41+
'formData.file': 'file.txt',
4042
});
4143
});
4244

45+
test('Sends a loader span to Sentry', async ({ page }) => {
46+
const loaderTransactionPromise = waitForTransaction('create-remix-app-express', transactionEvent => {
47+
return transactionEvent?.spans?.some(span => span.data && span.data['code.function'] === 'loader');
48+
});
49+
50+
await page.goto('/');
51+
52+
const loaderSpan = (await loaderTransactionPromise).spans.find(
53+
span => span.data && span.data['code.function'] === 'loader',
54+
);
55+
56+
expect(loaderSpan).toBeDefined();
57+
expect(loaderSpan.op).toBe('http');
58+
});
59+
4360
test('Sends two linked transactions (server & client) to Sentry', async ({ page }) => {
4461
// We use this to identify the transactions
4562
const testTag = uuid4();
4663

4764
const httpServerTransactionPromise = waitForTransaction('create-remix-app-express', transactionEvent => {
4865
return (
4966
transactionEvent.type === 'transaction' &&
50-
transactionEvent.contexts?.trace?.op === 'http.server' &&
67+
transactionEvent.contexts?.trace?.op === 'http' &&
5168
transactionEvent.tags?.['sentry_test'] === testTag
5269
);
5370
});
@@ -70,18 +87,21 @@ test('Sends two linked transactions (server & client) to Sentry', async ({ page
7087

7188
const httpServerTraceId = httpServerTransaction.contexts?.trace?.trace_id;
7289
const httpServerSpanId = httpServerTransaction.contexts?.trace?.span_id;
90+
const loaderSpanId = httpServerTransaction.spans.find(
91+
span => span.data && span.data['code.function'] === 'loader',
92+
)?.span_id;
7393

7494
const pageLoadTraceId = pageloadTransaction.contexts?.trace?.trace_id;
7595
const pageLoadSpanId = pageloadTransaction.contexts?.trace?.span_id;
7696
const pageLoadParentSpanId = pageloadTransaction.contexts?.trace?.parent_span_id;
7797

78-
expect(httpServerTransaction.transaction).toBe('routes/_index');
98+
expect(httpServerTransaction.transaction).toBe('GET http://localhost:3030/');
7999
expect(pageloadTransaction.transaction).toBe('routes/_index');
80100

81101
expect(httpServerTraceId).toBeDefined();
82102
expect(httpServerSpanId).toBeDefined();
83103

84104
expect(pageLoadTraceId).toEqual(httpServerTraceId);
85-
expect(pageLoadParentSpanId).toEqual(httpServerSpanId);
105+
expect(pageLoadParentSpanId).toEqual(loaderSpanId);
86106
expect(pageLoadSpanId).not.toEqual(httpServerSpanId);
87107
});

‎dev-packages/e2e-tests/test-applications/create-remix-app-v2/instrument.server.cjs

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
const Sentry = require('@sentry/remix');
2+
3+
Sentry.init({
4+
tracesSampleRate: 1.0, // Capture 100% of the transactions, reduce in production!
5+
environment: 'qa', // dynamic sampling bias to keep transactions
6+
dsn: process.env.E2E_TEST_DSN,
7+
tunnel: 'http://localhost:3031/', // proxy server
8+
});

‎dev-packages/e2e-tests/test-applications/create-remix-app-v2/playwright.config.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ const config: PlaywrightTestConfig = {
5757
port: eventProxyPort,
5858
},
5959
{
60-
command: `PORT=${port} pnpm start`,
60+
command: `PORT=${port} NODE_OPTIONS='--require ./instrument.server.cjs' pnpm start`,
6161
port: port,
6262
},
6363
],

‎dev-packages/e2e-tests/test-applications/create-remix-app-v2/tests/behaviour-server.test.ts

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ test('Sends two linked transactions (server & client) to Sentry', async ({ page
1010
const httpServerTransactionPromise = waitForTransaction('create-remix-app-v2', transactionEvent => {
1111
return (
1212
transactionEvent.type === 'transaction' &&
13-
transactionEvent.contexts?.trace?.op === 'http.server' &&
13+
transactionEvent.contexts?.trace?.op === 'http' &&
1414
transactionEvent.tags?.['sentry_test'] === testTag
1515
);
1616
});
@@ -33,18 +33,21 @@ test('Sends two linked transactions (server & client) to Sentry', async ({ page
3333

3434
const httpServerTraceId = httpServerTransaction.contexts?.trace?.trace_id;
3535
const httpServerSpanId = httpServerTransaction.contexts?.trace?.span_id;
36+
const loaderSpanId = httpServerTransaction?.spans?.find(
37+
span => span.data && span.data['code.function'] === 'loader',
38+
)?.span_id;
3639

3740
const pageLoadTraceId = pageloadTransaction.contexts?.trace?.trace_id;
3841
const pageLoadSpanId = pageloadTransaction.contexts?.trace?.span_id;
3942
const pageLoadParentSpanId = pageloadTransaction.contexts?.trace?.parent_span_id;
4043

41-
expect(httpServerTransaction.transaction).toBe('routes/_index');
44+
expect(httpServerTransaction.transaction).toBe('GET http://localhost:3030/');
4245
expect(pageloadTransaction.transaction).toBe('routes/_index');
4346

4447
expect(httpServerTraceId).toBeDefined();
4548
expect(httpServerSpanId).toBeDefined();
4649

4750
expect(pageLoadTraceId).toEqual(httpServerTraceId);
48-
expect(pageLoadParentSpanId).toEqual(httpServerSpanId);
51+
expect(pageLoadParentSpanId).toEqual(loaderSpanId);
4952
expect(pageLoadSpanId).not.toEqual(httpServerSpanId);
5053
});

‎dev-packages/e2e-tests/test-applications/create-remix-app/app/entry.server.tsx

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,11 @@
1-
import * as Sentry from '@sentry/remix';
2-
3-
Sentry.init({
4-
tracesSampleRate: 1.0, // Capture 100% of the transactions, reduce in production!
5-
environment: 'qa', // dynamic sampling bias to keep transactions
6-
dsn: process.env.E2E_TEST_DSN,
7-
tunnel: 'http://localhost:3031/', // proxy server
8-
});
9-
101
/**
112
* By default, Remix will handle generating the HTTP Response for you.
123
* You are free to delete this file if you'd like to, but if you ever want it revealed again, you can run `npx remix reveal` ✨
134
* For more information, see https://remix.run/file-conventions/entry.server
145
*/
156

167
import { PassThrough } from 'node:stream';
8+
import * as Sentry from '@sentry/remix';
179

1810
import type { AppLoadContext, EntryContext } from '@remix-run/node';
1911
import { Response } from '@remix-run/node';

‎dev-packages/e2e-tests/test-applications/create-remix-app/instrument.server.cjs

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
const Sentry = require('@sentry/remix');
2+
3+
Sentry.init({
4+
tracesSampleRate: 1.0, // Capture 100% of the transactions, reduce in production!
5+
environment: 'qa', // dynamic sampling bias to keep transactions
6+
dsn: process.env.E2E_TEST_DSN,
7+
tunnel: 'http://localhost:3031/', // proxy server
8+
});

‎dev-packages/e2e-tests/test-applications/create-remix-app/playwright.config.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ const config: PlaywrightTestConfig = {
5757
port: eventProxyPort,
5858
},
5959
{
60-
command: `PORT=${port} pnpm start`,
60+
command: `PORT=${port} NODE_OPTIONS='--require ./instrument.server.cjs' pnpm start`,
6161
port: port,
6262
},
6363
],

‎dev-packages/e2e-tests/test-applications/create-remix-app/tests/behaviour-server.test.ts

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ test('Sends two linked transactions (server & client) to Sentry', async ({ page
1010
const httpServerTransactionPromise = waitForTransaction('create-remix-app', transactionEvent => {
1111
return (
1212
transactionEvent.type === 'transaction' &&
13-
transactionEvent.contexts?.trace?.op === 'http.server' &&
13+
transactionEvent.contexts?.trace?.op === 'http' &&
1414
transactionEvent.tags?.['sentry_test'] === testTag
1515
);
1616
});
@@ -33,18 +33,21 @@ test('Sends two linked transactions (server & client) to Sentry', async ({ page
3333

3434
const httpServerTraceId = httpServerTransaction.contexts?.trace?.trace_id;
3535
const httpServerSpanId = httpServerTransaction.contexts?.trace?.span_id;
36+
const loaderSpanId = httpServerTransaction?.spans?.find(
37+
span => span.data && span.data['code.function'] === 'loader',
38+
)?.span_id;
3639

3740
const pageLoadTraceId = pageloadTransaction.contexts?.trace?.trace_id;
3841
const pageLoadSpanId = pageloadTransaction.contexts?.trace?.span_id;
3942
const pageLoadParentSpanId = pageloadTransaction.contexts?.trace?.parent_span_id;
4043

41-
expect(httpServerTransaction.transaction).toBe('routes/_index');
44+
expect(httpServerTransaction.transaction).toBe('GET http://localhost:3030/');
4245
expect(pageloadTransaction.transaction).toBe('routes/_index');
4346

4447
expect(httpServerTraceId).toBeDefined();
4548
expect(httpServerSpanId).toBeDefined();
4649

4750
expect(pageLoadTraceId).toEqual(httpServerTraceId);
48-
expect(pageLoadParentSpanId).toEqual(httpServerSpanId);
51+
expect(pageLoadParentSpanId).toEqual(loaderSpanId);
4952
expect(pageLoadSpanId).not.toEqual(httpServerSpanId);
5053
});

‎packages/remix/jest.config.js

Lines changed: 0 additions & 8 deletions
This file was deleted.

0 commit comments

Comments
 (0)