@sentry/wizard 3.12.0 → 3.14.0

package/src/sveltekit/sdk-setup.ts

@@ -4,6 +4,8 @@ import * as path from 'path';
 import * as url from 'url';
 import chalk from 'chalk';
 
+import * as Sentry from '@sentry/node';
+
 // @ts-ignore - clack is ESM and TS complains about that. It works though
 import clack from '@clack/prompts';
 // @ts-ignore - magicast is ESM and TS complains about that. It works though
@@ -20,6 +22,7 @@ import { findFile, hasSentryContent } from '../utils/ast-utils';
 import * as recast from 'recast';
 import x = recast.types;
 import t = x.namedTypes;
+import { traceStep } from '../telemetry';
 
 const SVELTE_CONFIG_FILE = 'svelte.config.js';
 
@@ -59,19 +62,25 @@ export async function createOrMergeSvelteKitFiles(
 
   const { dsn } = projectInfo;
 
+  Sentry.setTag(
+    'client-hooks-file-strategy',
+    originalClientHooksFile ? 'merge' : 'create',
+  );
   if (!originalClientHooksFile) {
     clack.log.info('No client hooks file found, creating a new one.');
     await createNewHooksFile(`${clientHooksPath}.${fileEnding}`, 'client', dsn);
+  } else {
+    await mergeHooksFile(originalClientHooksFile, 'client', dsn);
   }
+
+  Sentry.setTag(
+    'server-hooks-file-strategy',
+    originalServerHooksFile ? 'merge' : 'create',
+  );
   if (!originalServerHooksFile) {
     clack.log.info('No server hooks file found, creating a new one.');
     await createNewHooksFile(`${serverHooksPath}.${fileEnding}`, 'server', dsn);
-  }
-
-  if (originalClientHooksFile) {
-    await mergeHooksFile(originalClientHooksFile, 'client', dsn);
-  }
-  if (originalServerHooksFile) {
+  } else {
     await mergeHooksFile(originalServerHooksFile, 'server', dsn);
   }
 
@@ -124,6 +133,7 @@ async function createNewHooksFile(
   await fs.promises.writeFile(hooksFileDest, filledTemplate);
 
   clack.log.success(`Created ${hooksFileDest}`);
+  Sentry.setTag(`created-${hooktype}-hooks`, 'success');
 }
 
 /**
@@ -143,6 +153,9 @@ async function mergeHooksFile(
   dsn: string,
 ): Promise<void> {
   const originalHooksMod = await loadFile(hooksFile);
+
+  const file: 'server-hooks' | 'client-hooks' = `${hookType}-hooks`;
+
   if (hasSentryContent(originalHooksMod.$ast as t.Program)) {
     // We don't want to mess with files that already have Sentry content.
     // Let's just bail out at this point.
@@ -152,32 +165,59 @@ async function mergeHooksFile(
       )} already contains Sentry code.
 Skipping adding Sentry functionality to.`,
     );
+    Sentry.setTag(`modified-${file}`, 'fail');
+    Sentry.setTag(`${file}-fail-reason`, 'has-sentry-content');
     return;
   }
 
-  originalHooksMod.imports.$add({
-    from: '@sentry/sveltekit',
-    imported: '*',
-    local: 'Sentry',
-  });
+  await modifyAndRecordFail(
+    () =>
+      originalHooksMod.imports.$add({
+        from: '@sentry/sveltekit',
+        imported: '*',
+        local: 'Sentry',
+      }),
+    'import-injection',
+    file,
+  );
 
-  if (hookType === 'client') {
-    insertClientInitCall(dsn, originalHooksMod);
-  } else {
-    insertServerInitCall(dsn, originalHooksMod);
-  }
+  await modifyAndRecordFail(
+    () => {
+      if (hookType === 'client') {
+        insertClientInitCall(dsn, originalHooksMod);
+      } else {
+        insertServerInitCall(dsn, originalHooksMod);
+      }
+    },
+    'init-call-injection',
+    file,
+  );
 
-  wrapHandleError(originalHooksMod);
+  await modifyAndRecordFail(
+    () => wrapHandleError(originalHooksMod),
+    'wrap-handle-error',
+    file,
+  );
 
   if (hookType === 'server') {
-    wrapHandle(originalHooksMod);
+    await modifyAndRecordFail(
+      () => wrapHandle(originalHooksMod),
+      'wrap-handle',
+      'server-hooks',
+    );
   }
 
-  const modifiedCode = originalHooksMod.generate().code;
-
-  await fs.promises.writeFile(hooksFile, modifiedCode);
+  await modifyAndRecordFail(
+    async () => {
+      const modifiedCode = originalHooksMod.generate().code;
+      await fs.promises.writeFile(hooksFile, modifiedCode);
+    },
+    'write-file',
+    file,
+  );
 
   clack.log.success(`Added Sentry code to ${hooksFile}`);
+  Sentry.setTag(`modified-${hookType}-hooks`, 'success');
 }
 
 function insertClientInitCall(
@@ -410,32 +450,45 @@ async function modifyViteConfig(
         )} already contains Sentry code.
 Skipping adding Sentry functionality to.`,
       );
+      Sentry.setTag(`modified-vite-cfg`, 'fail');
+      Sentry.setTag(`vite-cfg-fail-reason`, 'has-sentry-content');
       return;
     }
 
-    addVitePlugin(viteModule, {
-      imported: 'sentrySvelteKit',
-      from: '@sentry/sveltekit',
-      constructor: 'sentrySvelteKit',
-      options: {
-        sourceMapsUploadOptions: {
-          org,
-          project,
-          ...(selfHosted && { url }),
-        },
-      },
-      index: 0,
-    });
-
-    const code = generateCode(viteModule.$ast).code;
+    await modifyAndRecordFail(
+      () =>
+        addVitePlugin(viteModule, {
+          imported: 'sentrySvelteKit',
+          from: '@sentry/sveltekit',
+          constructor: 'sentrySvelteKit',
+          options: {
+            sourceMapsUploadOptions: {
+              org,
+              project,
+              ...(selfHosted && { url }),
+            },
+          },
+          index: 0,
+        }),
+      'add-vite-plugin',
+      'vite-cfg',
+    );
 
-    await fs.promises.writeFile(viteConfigPath, code);
+    await modifyAndRecordFail(
+      async () => {
+        const code = generateCode(viteModule.$ast).code;
+        await fs.promises.writeFile(viteConfigPath, code);
+      },
+      'write-file',
+      'vite-cfg',
+    );
   } catch (e) {
     debug(e);
     await showFallbackViteCopyPasteSnippet(
       viteConfigPath,
       getViteConfigCodeSnippet(org, project, selfHosted, url),
     );
+    Sentry.captureException('Sveltekit Vite Config Modification Fail');
   }
 }
 
@@ -512,3 +565,22 @@ function getInitCallInsertionIndex(originalHooksModAST: Program): number {
     : 0;
   return initCallInsertionIndex;
 }
+
+/**
+ * Applies the @param modifyCallback and records Sentry tags if the call failed.
+ * In case of a failure, a tag is set with @param reason as a fail reason
+ * and the error is rethrown.
+ */
+async function modifyAndRecordFail<T>(
+  modifyCallback: () => T | Promise<T>,
+  reason: string,
+  fileType: 'server-hooks' | 'client-hooks' | 'vite-cfg',
+): Promise<void> {
+  try {
+    await traceStep(`${fileType}-${reason}`, modifyCallback);
+  } catch (e) {
+    Sentry.setTag(`modified-${fileType}`, 'fail');
+    Sentry.setTag(`${fileType}-mod-fail-reason`, reason);
+    throw e;
+  }
+}

package/src/sveltekit/sveltekit-wizard.ts

@@ -1,57 +1,116 @@
 // @ts-ignore - clack is ESM and TS complains about that. It works though
-import clack from '@clack/prompts';
+import * as clack from '@clack/prompts';
 import chalk from 'chalk';
 
+import * as Sentry from '@sentry/node';
+
 import {
   abort,
+  abortIfCancelled,
   addSentryCliConfig,
-  confirmContinueEvenThoughNoGitRepo,
+  confirmContinueIfNoOrDirtyGitRepo,
   ensurePackageIsInstalled,
   getOrAskForProjectData,
   getPackageDotJson,
   installPackage,
   printWelcome,
 } from '../utils/clack-utils';
-import { hasPackageInstalled } from '../utils/package-json';
+import { getPackageVersion, hasPackageInstalled } from '../utils/package-json';
 import { WizardOptions } from '../utils/types';
 import { createExamplePage } from './sdk-example';
 import { createOrMergeSvelteKitFiles, loadSvelteConfig } from './sdk-setup';
+import { traceStep, withTelemetry } from '../telemetry';
+import { getKitVersionBucket, getSvelteVersionBucket } from './utils';
 
 export async function runSvelteKitWizard(
   options: WizardOptions,
+): Promise<void> {
+  return withTelemetry(
+    {
+      enabled: options.telemetryEnabled,
+      integration: 'sveltekit',
+    },
+    () => runSvelteKitWizardWithTelemetry(options),
+  );
+}
+
+export async function runSvelteKitWizardWithTelemetry(
+  options: WizardOptions,
 ): Promise<void> {
   printWelcome({
     wizardName: 'Sentry SvelteKit Wizard',
     promoCode: options.promoCode,
+    telemetryEnabled: options.telemetryEnabled,
   });
 
-  await confirmContinueEvenThoughNoGitRepo();
+  await confirmContinueIfNoOrDirtyGitRepo();
 
   const packageJson = await getPackageDotJson();
+
   await ensurePackageIsInstalled(packageJson, '@sveltejs/kit', 'Sveltekit');
 
+  const kitVersion = getPackageVersion('@sveltejs/kit', packageJson);
+  const kitVersionBucket = getKitVersionBucket(kitVersion);
+  Sentry.setTag('sveltekit-version', kitVersionBucket);
+
+  if (kitVersionBucket === '0.x') {
+    clack.log.warn(
+      "It seems you're using a SvelteKit version <1.0.0 which is not supported by Sentry.\nWe recommend upgrading to the latest 1.x version before you continue.",
+    );
+    const shouldContinue = await abortIfCancelled(
+      clack.select({
+        message: 'Do you want to continue anyway?',
+        options: [
+          {
+            label: 'Yes, continue',
+            hint: 'The SDK might not work correctly',
+            value: true,
+          },
+          { label: "No, I'll upgrade first", value: false },
+        ],
+      }),
+    );
+    if (!shouldContinue) {
+      await abort('Exiting Wizard', 0);
+      return;
+    }
+  }
+
+  Sentry.setTag(
+    'svelte-version',
+    getSvelteVersionBucket(getPackageVersion('svelte', packageJson)),
+  );
+
   const { selectedProject, selfHosted, sentryUrl, authToken } =
     await getOrAskForProjectData(options, 'javascript-sveltekit');
 
+  const sdkAlreadyInstalled = hasPackageInstalled(
+    '@sentry/sveltekit',
+    packageJson,
+  );
+  Sentry.setTag('sdk-already-installed', sdkAlreadyInstalled);
+
   await installPackage({
     packageName: '@sentry/sveltekit',
-    alreadyInstalled: hasPackageInstalled('@sentry/sveltekit', packageJson),
+    alreadyInstalled: sdkAlreadyInstalled,
   });
 
   await addSentryCliConfig(authToken);
 
-  const svelteConfig = await loadSvelteConfig();
+  const svelteConfig = await traceStep('load-svelte-config', loadSvelteConfig);
 
   try {
-    await createOrMergeSvelteKitFiles(
-      {
-        dsn: selectedProject.keys[0].dsn.public,
-        org: selectedProject.organization.slug,
-        project: selectedProject.slug,
-        selfHosted,
-        url: sentryUrl,
-      },
-      svelteConfig,
+    await traceStep('configure-sdk', () =>
+      createOrMergeSvelteKitFiles(
+        {
+          dsn: selectedProject.keys[0].dsn.public,
+          org: selectedProject.organization.slug,
+          project: selectedProject.slug,
+          selfHosted,
+          url: sentryUrl,
+        },
+        svelteConfig,
+      ),
     );
   } catch (e: unknown) {
     clack.log.error('Error while setting up the SvelteKit SDK:');
@@ -64,17 +123,20 @@ export async function runSvelteKitWizard(
           : 'Unknown error',
       ),
     );
+    Sentry.captureException('Error while setting up the SvelteKit SDK');
     await abort('Exiting Wizard');
     return;
   }
 
   try {
-    await createExamplePage(svelteConfig, {
-      selfHosted,
-      url: sentryUrl,
-      orgSlug: selectedProject.organization.slug,
-      projectId: selectedProject.id,
-    });
+    await traceStep('create-example-page', () =>
+      createExamplePage(svelteConfig, {
+        selfHosted,
+        url: sentryUrl,
+        orgSlug: selectedProject.organization.slug,
+        projectId: selectedProject.id,
+      }),
+    );
   } catch (e: unknown) {
     clack.log.error('Error while creating an example page to test Sentry:');
     clack.log.info(
@@ -86,6 +148,9 @@ export async function runSvelteKitWizard(
           : 'Unknown error',
       ),
     );
+    Sentry.captureException(
+      'Error while creating an example Svelte page to test Sentry',
+    );
     await abort('Exiting Wizard');
     return;
   }

package/src/sveltekit/utils.ts

@@ -0,0 +1,50 @@
+import { lt, minVersion } from 'semver';
+
+export function getKitVersionBucket(
+  version: string | undefined,
+): 'none' | 'invalid' | '0.x' | '>=1.0.0 <1.24.0' | '>=1.24.0' {
+  if (!version) {
+    return 'none';
+  }
+
+  const minVer = minVersion(version);
+  if (!minVer) {
+    return 'invalid';
+  }
+
+  if (lt(minVer, '1.0.0')) {
+    return '0.x';
+  } else if (lt(minVer, '1.24.0')) {
+    return '>=1.0.0 <1.24.0';
+  } else {
+    // This is the version when the client-side invalidation fix was released
+    // https://github.com/sveltejs/kit/releases/tag/%40sveltejs%2Fkit%401.24.0
+    // https://github.com/sveltejs/kit/pull/10576
+    return '>=1.24.0';
+  }
+}
+
+export function getSvelteVersionBucket(
+  version: string | undefined,
+): 'none' | 'invalid' | '<3.0.0' | '3.x' | '4.x' | '>4.x' {
+  if (!version) {
+    return 'none';
+  }
+
+  const minVer = minVersion(version);
+  if (!minVer) {
+    return 'invalid';
+  }
+
+  if (lt(minVer, '3.0.0')) {
+    return '<3.0.0';
+  }
+  if (lt(minVer, '4.0.0')) {
+    return '3.x';
+  }
+  if (lt(minVer, '5.0.0')) {
+    return '4.x';
+  }
+  // Svelte 5 isn't released yet but it's being worked on
+  return '>4.x';
+}

package/src/telemetry.ts

@@ -6,7 +6,8 @@ import {
   makeNodeTransport,
   NodeClient,
   runWithAsyncContext,
-  trace,
+  setTag,
+  startSpan,
 } from '@sentry/node';
 import packageJson from '../package.json';
 
@@ -24,24 +25,29 @@ export async function withTelemetry<F>(
 
   makeMain(sentryHub);
 
-  const transaction = sentryHub.startTransaction({
-    name: 'sentry-wizard-execution',
-    status: 'ok',
-    op: 'wizard.flow',
-  });
-  sentryHub.getScope().setSpan(transaction);
   const sentrySession = sentryHub.startSession();
   sentryHub.captureSession();
 
   try {
-    return await runWithAsyncContext(() => callback());
+    return await startSpan(
+      {
+        name: 'sentry-wizard-execution',
+        status: 'ok',
+        op: 'wizard.flow',
+      },
+      async () => {
+        updateProgress('start');
+        const res = await runWithAsyncContext(callback);
+        updateProgress('finished');
+
+        return res;
+      },
+    );
   } catch (e) {
     sentryHub.captureException('Error during wizard execution.');
-    transaction.setStatus('internal_error');
     sentrySession.status = 'crashed';
     throw e;
   } finally {
-    transaction.finish();
     sentryHub.endSession();
     await sentryClient.flush(3000);
   }
@@ -92,5 +98,10 @@ function createSentryInstance(enabled: boolean, integration: string) {
 }
 
 export function traceStep<T>(step: string, callback: () => T): T {
-  return trace({ name: step, op: 'wizard.step' }, () => callback());
+  updateProgress(step);
+  return startSpan({ name: step, op: 'wizard.step' }, () => callback());
+}
+
+export function updateProgress(step: string) {
+  setTag('progress', step);
 }

package/src/utils/ast-utils.ts

@@ -4,6 +4,8 @@ import * as recast from 'recast';
 import x = recast.types;
 import t = x.namedTypes;
 
+const b = recast.types.builders;
+
 /**
  * Checks if a file where we don't know its concrete file type yet exists
  * and returns the full path to the file with the correct file type.
@@ -36,3 +38,181 @@ export function hasSentryContent(program: t.Program): boolean {
 
   return !!foundSentry;
 }
+
+/**
+ * Searches for a property of an ObjectExpression by name
+ *
+ * @param object the ObjectExpression to search in
+ * @param name the name of the property to search for
+ *
+ * @returns the property if it exists
+ */
+export function getObjectProperty(
+  object: t.ObjectExpression,
+  name: string,
+): t.Property | undefined {
+  return object.properties.find((p): p is t.Property => {
+    const isObjectProp = p.type === 'Property' || p.type === 'ObjectProperty';
+
+    if (!isObjectProp) {
+      return false;
+    }
+
+    const hasMatchingLiteralKey =
+      isObjectProp &&
+      (p.key.type === 'Literal' || p.key.type === 'StringLiteral') &&
+      p.key.value === name;
+
+    if (hasMatchingLiteralKey) {
+      return true;
+    }
+
+    // has matching identifier key
+    return isObjectProp && p.key.type === 'Identifier' && p.key.name === name;
+  });
+}
+
+/**
+ * Attempts to find a property of an ObjectExpression by name. If it doesn't exist,
+ * the property will be added to the ObjectExpression with the provided default value.
+ *
+ * @param object the parent object expression to search in
+ * @param name the name of the property to search for
+ * @param defaultValue the default value to set if the property doesn't exist
+ *
+ * @returns the
+ */
+export function getOrSetObjectProperty(
+  object: t.ObjectExpression,
+  name: string,
+  defaultValue:
+    | t.Literal
+    | t.BooleanLiteral
+    | t.StringLiteral
+    | t.ObjectExpression,
+): t.Property {
+  const existingProperty = getObjectProperty(object, name);
+
+  if (existingProperty) {
+    return existingProperty;
+  }
+
+  const newProperty = b.property.from({
+    kind: 'init',
+    key: b.stringLiteral(name),
+    value: defaultValue,
+  });
+
+  object.properties.push(newProperty);
+
+  return newProperty;
+}
+
+/**
+ * Sets a property of an ObjectExpression if it exists, otherwise adds it
+ * to the ObjectExpression. Optionally, a comment can be added to the
+ * property.
+ *
+ * @param object the ObjectExpression to set the property on
+ * @param name the name of the property to set
+ * @param value  the value of the property to set
+ * @param comment (optional) a comment to add to the property
+ */
+export function setOrUpdateObjectProperty(
+  object: t.ObjectExpression,
+  name: string,
+  value: t.Literal | t.BooleanLiteral | t.StringLiteral | t.ObjectExpression,
+  comment?: string,
+) {
+  const newComments =
+    comment &&
+    comment.split('\n').map((c) => b.commentLine(` ${c}`, true, false));
+
+  const existingProperty = getObjectProperty(object, name);
+
+  if (existingProperty) {
+    existingProperty.value = value;
+    if (newComments) {
+      existingProperty.comments = [
+        ...(existingProperty?.comments || []),
+        ...newComments,
+      ];
+    }
+  } else {
+    object.properties.push(
+      b.objectProperty.from({
+        key: b.stringLiteral(name),
+        value,
+        ...(newComments && {
+          comments: newComments,
+        }),
+      }),
+    );
+  }
+}
+
+type JsonCParseResult =
+  | {
+      jsonObject: t.ObjectExpression;
+      ast: t.Program;
+    }
+  | {
+      jsonObject: undefined;
+      ast: undefined;
+    };
+
+/**
+ * Parses a JSON string with (potential) comments (JSON-C) and returns the JS AST
+ * that can be walked and modified with recast like a normal JS AST.
+ *
+ * This is done by wrapping the JSON-C string in parentheses, thereby making it
+ * a JS `Program` with an `ExpressionStatement` as its body. The expression is then
+ * extracted from the AST and returned alongside the AST.
+ *
+ * To preserve as much original formatting as possible, the returned `ast`
+ * property should be passed to {@link `printJsonC`} to get the JSON-C string back.
+ *
+ * If the input is not valid JSON-C, the result will be undefined.
+ *
+ * @see {@link JsonCParseResult}
+ *
+ * @param jsonString a JSON-C string
+ *
+ * @returns a {@link JsonCParseResult}, containing either the JSON-C object and the AST or undefined in both cases
+ */
+export function parseJsonC(jsonString: string): JsonCParseResult {
+  try {
+    const jsTsConfig = `(${jsonString})`;
+    // no idea why recast returns any here, this is dumb :/
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+    const ast = recast.parse(jsTsConfig.toString()).program as t.Program;
+
+    const jsonObject =
+      (ast.body[0].type === 'ExpressionStatement' &&
+        ast.body[0].expression.type === 'ObjectExpression' &&
+        ast.body[0].expression) ||
+      undefined;
+
+    if (jsonObject) {
+      return { jsonObject, ast };
+    }
+  } catch {
+    /* empty */
+  }
+  return { jsonObject: undefined, ast: undefined };
+}
+
+/**
+ * Takes the AST of a parsed JSON-C "program" and returns the JSON-C string without
+ * any of the temporary JS wrapper code that was previously applied.
+ *
+ * Only use this in conjunction with {@link `parseJsonC`}
+ *
+ * @param ast the `ast` returned from {@link `parseJsonC`}
+ *
+ * @returns the JSON-C string
+ */
+export function printJsonC(ast: t.Program): string {
+  const js = recast.print(ast).code;
+  return js.substring(1, js.length - 1);
+}