wip

Author: Lms24

packages/sveltekit/src/client/load.ts

@@ -28,12 +28,13 @@ function sendErrorToSentry(e: unknown): unknown {
 
 /**
  * Wrap load function with Sentry
+ * TODO: usage
  *
  * @param origLoad SvelteKit user defined load function
  */
-export function wrapLoadWithSentry(origLoad: Load): Load {
+export function wrapLoadWithSentry<T extends Load>(origLoad: T): T {
   return new Proxy(origLoad, {
-    apply: (wrappingTarget, thisArg, args: Parameters<Load>) => {
+    apply: (wrappingTarget, thisArg, args: Parameters<T>) => {
       const [event] = args;
 
       const routeId = event.route.id;

packages/sveltekit/src/index.types.ts

@@ -9,7 +9,7 @@ export * from './server';
 
 import type { Integration, Options, StackParser } from '@sentry/types';
 // eslint-disable-next-line import/no-unresolved
-import type { HandleClientError, HandleServerError, Load, ServerLoad } from '@sveltejs/kit';
+import type { HandleClientError, HandleServerError, Load } from '@sveltejs/kit';
 
 import type * as clientSdk from './client';
 import type * as serverSdk from './server';
@@ -21,7 +21,7 @@ export declare function handleErrorWithSentry<T extends HandleClientError | Hand
   handleError?: T,
 ): ReturnType<T>;
 
-export declare function wrapLoadWithSentry<S extends ServerLoad | Load>(origLoad: S): S;
+export declare function wrapLoadWithSentry<T extends Load>(origLoad: T): T;
 
 // We export a merged Integrations object so that users can (at least typing-wise) use all integrations everywhere.
 export declare const Integrations: typeof clientSdk.Integrations & typeof serverSdk.Integrations;

packages/sveltekit/src/server/handle.ts

@@ -2,16 +2,12 @@
 import type { Span } from '@sentry/core';
 import { getActiveTransaction, getCurrentHub, trace } from '@sentry/core';
 import { captureException } from '@sentry/node';
-import {
-  addExceptionMechanism,
-  baggageHeaderToDynamicSamplingContext,
-  dynamicSamplingContextToSentryBaggageHeader,
-  extractTraceparentData,
-  objectify,
-} from '@sentry/utils';
+import { addExceptionMechanism, dynamicSamplingContextToSentryBaggageHeader, objectify } from '@sentry/utils';
 import type { Handle, ResolveOptions } from '@sveltejs/kit';
 import * as domain from 'domain';
 
+import { getTracePropagationData } from './utils';
+
 function sendErrorToSentry(e: unknown): unknown {
   // In case we have a primitive, wrap it in the equivalent wrapper class (string -> String, etc.) so that we can
   // store a seen flag on it.
@@ -77,10 +73,7 @@ export const sentryHandle: Handle = input => {
 };
 
 function instrumentHandle({ event, resolve }: Parameters<Handle>[0]): ReturnType<Handle> {
-  const sentryTraceHeader = event.request.headers.get('sentry-trace');
-  const baggageHeader = event.request.headers.get('baggage');
-  const traceparentData = sentryTraceHeader ? extractTraceparentData(sentryTraceHeader) : undefined;
-  const dynamicSamplingContext = baggageHeaderToDynamicSamplingContext(baggageHeader);
+  const { traceparentData, dynamicSamplingContext } = getTracePropagationData(event);
 
   return trace(
     {

packages/sveltekit/src/server/load.ts

@@ -1,14 +1,11 @@
 /* eslint-disable @sentry-internal/sdk/no-optional-chaining */
 import { trace } from '@sentry/core';
 import { captureException } from '@sentry/node';
-import type { DynamicSamplingContext, TraceparentData, TransactionContext } from '@sentry/types';
-import {
-  addExceptionMechanism,
-  baggageHeaderToDynamicSamplingContext,
-  extractTraceparentData,
-  objectify,
-} from '@sentry/utils';
-import type { HttpError, Load, LoadEvent, ServerLoad, ServerLoadEvent } from '@sveltejs/kit';
+import type { TransactionContext } from '@sentry/types';
+import { addExceptionMechanism, objectify } from '@sentry/utils';
+import type { HttpError, Load, ServerLoad } from '@sveltejs/kit';
+
+import { getTracePropagationData } from './utils';
 
 function isHttpError(err: unknown): err is HttpError {
   return typeof err === 'object' && err !== null && 'status' in err && 'body' in err;
@@ -45,58 +42,65 @@ function sendErrorToSentry(e: unknown): unknown {
 }
 
 /**
- * Wrap load function with Sentry
+ * Wrap a universal load function (e.g. +page.js or +layout.js) with Sentry functionality
+ *
+ * Usage:
+ * ```js
+ * import {  }
+ * ```
  *
  * @param origLoad SvelteKit user defined load function
  */
-export function wrapLoadWithSentry<T extends ServerLoad | Load>(origLoad: T): T {
+export function wrapLoadWithSentry<T extends Load>(origLoad: T): T {
   return new Proxy(origLoad, {
-    apply: (wrappingTarget, thisArg, args: Parameters<ServerLoad | Load>) => {
+    apply: (wrappingTarget, thisArg, args: Parameters<T>) => {
       const [event] = args;
       const routeId = event.route && event.route.id;
 
-      const { traceparentData, dynamicSamplingContext } = getTracePropagationData(event);
-
       const traceLoadContext: TransactionContext = {
-        op: `function.sveltekit${isServerOnlyLoad(event) ? '.server' : ''}.load`,
+        op: 'function.sveltekit.load',
         name: routeId ? routeId : event.url.pathname,
         status: 'ok',
         metadata: {
           source: routeId ? 'route' : 'url',
-          dynamicSamplingContext: traceparentData && !dynamicSamplingContext ? {} : dynamicSamplingContext,
         },
-        ...traceparentData,
       };
 
       return trace(traceLoadContext, () => wrappingTarget.apply(thisArg, args), sendErrorToSentry);
     },
   });
 }
 
-function getTracePropagationData(event: ServerLoadEvent | LoadEvent): {
-  traceparentData?: TraceparentData;
-  dynamicSamplingContext?: Partial<DynamicSamplingContext>;
-} {
-  if (!isServerOnlyLoad(event)) {
-    return {};
-  }
-
-  const sentryTraceHeader = event.request.headers.get('sentry-trace');
-  const baggageHeader = event.request.headers.get('baggage');
-  const traceparentData = sentryTraceHeader ? extractTraceparentData(sentryTraceHeader) : undefined;
-  const dynamicSamplingContext = baggageHeaderToDynamicSamplingContext(baggageHeader);
-
-  return { traceparentData, dynamicSamplingContext };
-}
-
 /**
- * Our server-side wrapLoadWithSentry can be used to wrap two different kinds of `load` functions:
- *  - load functions from `+(page|layout).ts`: These can be called both on client and on server
- *  - load functions from `+(page|layout).server.ts`: These are only called on the server
+ * Wrap a server-only load function (e.g. +page.server.js or +layout.server.js) with Sentry functionality
+ * TODO: usage
  *
- * In both cases, load events look differently. We can distinguish them by checking if the
- * event has a `request` field (which only the server-exclusive load event has).
+ * @param origServerLoad SvelteKit user defined server-only load function
  */
-function isServerOnlyLoad(event: ServerLoadEvent | LoadEvent): event is ServerLoadEvent {
-  return 'request' in event;
+export function wrapServerLoadWithSentry<T extends ServerLoad>(origServerLoad: T): T {
+  return new Proxy(origServerLoad, {
+    apply: (wrappingTarget, thisArg, args: Parameters<T>) => {
+      const [event] = args;
+      const routeId = event.route && event.route.id;
+
+      // Usually, the `handleWithSentry` hook handler should already create a transaction and store
+      // traceparent and DSC on that transaction before the server-only load function is called.
+      // However, since we have access to `event.request` we can still pass it to `trace`
+      // in case our handler isn't called or for some reason the handle hook is bypassed.
+      const { dynamicSamplingContext, traceparentData } = getTracePropagationData(event);
+
+      const traceLoadContext: TransactionContext = {
+        op: 'function.sveltekit.server.load',
+        name: routeId ? routeId : event.url.pathname,
+        status: 'ok',
+        metadata: {
+          source: routeId ? 'route' : 'url',
+          dynamicSamplingContext: traceparentData && !dynamicSamplingContext ? {} : dynamicSamplingContext,
+        },
+        ...traceparentData,
+      };
+
+      return trace(traceLoadContext, () => wrappingTarget.apply(thisArg, args), sendErrorToSentry);
+    },
+  });
 }