feat(sveltekit): Add performance monitoring for client load

Author: AbhiPrasad

packages/sveltekit/src/client/load.ts

@@ -1,6 +1,7 @@
-import { captureException } from '@sentry/svelte';
+import type { Span } from '@sentry/core';
+import { captureException, getCurrentHub } from '@sentry/svelte';
 import { addExceptionMechanism, isThenable, objectify } from '@sentry/utils';
-import type { ServerLoad } from '@sveltejs/kit';
+import type { Load } from '@sveltejs/kit';
 
 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
@@ -30,21 +31,60 @@ function sendErrorToSentry(e: unknown): unknown {
  *
  * @param origLoad SvelteKit user defined load function
  */
-export function wrapLoadWithSentry(origLoad: ServerLoad): ServerLoad {
+export function wrapLoadWithSentry(origLoad: Load): Load {
   return new Proxy(origLoad, {
-    apply: (wrappingTarget, thisArg, args: Parameters<ServerLoad>) => {
+    apply: (wrappingTarget, thisArg, args: Parameters<Load>) => {
       let maybePromiseResult;
 
+      const [event] = args;
+
+      const scope = getCurrentHub().getScope();
+
+      let activeSpan: Span | undefined = undefined;
+      let parentSpan: Span | undefined = undefined;
+
+      if (scope) {
+        parentSpan = scope.getSpan();
+        if (parentSpan) {
+          activeSpan = parentSpan.startChild({
+            op: 'function.sveltekit.load',
+            description: event.route.id || '/',
+          });
+
+          scope.setSpan(activeSpan);
+        }
+      }
+
       try {
         maybePromiseResult = wrappingTarget.apply(thisArg, args);
       } catch (e) {
-        throw sendErrorToSentry(e);
+        if (activeSpan) {
+          activeSpan.setStatus('internal_error');
+          activeSpan.finish();
+        }
+        const sentryError = sendErrorToSentry(e);
+        throw sentryError;
       }
 
       if (isThenable(maybePromiseResult)) {
-        Promise.resolve(maybePromiseResult).then(null, e => {
-          sendErrorToSentry(e);
-        });
+        Promise.resolve(maybePromiseResult).then(
+          () => {
+            if (activeSpan) {
+              activeSpan.finish();
+            }
+          },
+          e => {
+            if (activeSpan) {
+              activeSpan.setStatus('internal_error');
+              activeSpan.finish();
+            }
+            sendErrorToSentry(e);
+          },
+        );
+      } else {
+        if (activeSpan) {
+          activeSpan.finish();
+        }
       }
 
       return maybePromiseResult;