@sentry/wizard 3.11.0 → 3.13.0

package/src/sourcemaps/tools/tsc.ts

@@ -1,39 +1,144 @@
+import * as fs from 'fs';
+import * as path from 'path';
+
+import * as recast from 'recast';
+
+import * as Sentry from '@sentry/node';
+
 // @ts-ignore - clack is ESM and TS complains about that. It works though
-import clack, { select } from '@clack/prompts';
+import * as clack from '@clack/prompts';
 import chalk from 'chalk';
-import { abortIfCancelled } from '../../utils/clack-utils';
-
-export async function configureTscSourcemapGenerationFlow(): Promise<void> {
-  clack.log.step(
-    `Add the following code to your ${chalk.bold(
-      'tsconfig.json',
-    )} file: ${chalk.dim(
-      '(This ensures that source maps are generated correctly)',
-    )}`,
-  );
 
-  // Intentially logging directly to console here so that the code can be copied/pasted directly
-  // eslint-disable-next-line no-console
-  console.log(codeSnippet);
+import {
+  askForToolConfigPath,
+  createNewConfigFile,
+  makeCodeSnippet,
+  showCopyPasteInstructions,
+} from '../../utils/clack-utils';
+import {
+  findFile,
+  getOrSetObjectProperty,
+  parseJsonC,
+  printJsonC,
+  setOrUpdateObjectProperty,
+} from '../../utils/ast-utils';
+import { debug } from '../../utils/debug';
 
-  await abortIfCancelled(
-    select({
-      message: 'Did you update your config as shown in the snippet above?',
-      options: [{ label: 'Yes, continue!', value: true }],
-      initialValue: true,
-    }),
-  );
-}
+const b = recast.types.builders;
 
-const codeSnippet = chalk.gray(`
-{
+const getCodeSnippet = (colors: boolean) =>
+  makeCodeSnippet(colors, (unchanged, plus, _) =>
+    unchanged(
+      `{
   "compilerOptions": {
-    ${chalk.greenBright('"sourceMap": true,')}
-    ${chalk.greenBright('"inlineSources": true,')}
+    ${plus('"sourceMap": true,')}
+    ${plus('"inlineSources": true,')}
 
     // Set \`sourceRoot\` to  "/" to strip the build path prefix from
     // generated source code references. This will improve issue grouping in Sentry.
-    ${chalk.greenBright('"sourceRoot": "/"')}
+    ${plus('"sourceRoot": "/"')}
+  }
+}`,
+    ),
+  );
+
+export async function configureTscSourcemapGenerationFlow(): Promise<void> {
+  const tsConfigPath =
+    findFile(path.join(process.cwd(), 'tsconfig'), ['.json']) ??
+    (await askForToolConfigPath('TypeScript', 'tsconfig.json'));
+
+  let successfullyAdded = false;
+  if (tsConfigPath) {
+    successfullyAdded = await enableSourcemaps(tsConfigPath);
+  } else {
+    successfullyAdded = await createNewConfigFile(
+      path.join(process.cwd(), 'tsconfig.json'),
+      getCodeSnippet(false),
+    );
+    Sentry.setTag('created-new-config', successfullyAdded ? 'success' : 'fail');
+  }
+
+  if (successfullyAdded) {
+    Sentry.setTag('ast-mod', 'success');
+    clack.log.info(
+      `We recommend checking the ${
+        tsConfigPath ? 'modified' : 'added'
+      } file after the wizard finished to ensure it works with your build setup.`,
+    );
+  } else {
+    Sentry.setTag('ast-mod', 'fail');
+    await showCopyPasteInstructions(
+      'tsconfig.json',
+      getCodeSnippet(true),
+      'This ensures that source maps are generated correctly',
+    );
+  }
+}
+
+/**
+ * Modifies tsconfig.json (@param tsConfigPath) to enable source maps generation.
+ *
+ * Exported only for testing
+ */
+export async function enableSourcemaps(tsConfigPath: string): Promise<boolean> {
+  try {
+    const tsConfig = await fs.promises.readFile(tsConfigPath, 'utf-8');
+
+    const { ast, jsonObject } = parseJsonC(tsConfig.toString());
+
+    if (!jsonObject || !ast) {
+      // this will only happen if the input file isn't valid JSON-C
+      Sentry.setTag('ast-mod-fail-reason', 'original-file-invalid');
+      return false;
+    }
+
+    const compilerOptionsProp = getOrSetObjectProperty(
+      jsonObject,
+      'compilerOptions',
+      b.objectExpression([]),
+    );
+
+    const compilerOptionsObj = compilerOptionsProp.value;
+
+    if (!compilerOptionsObj || compilerOptionsObj.type !== 'ObjectExpression') {
+      // a valid compilerOptions prop should always be an object expression
+      Sentry.setTag('ast-mod-fail-reason', 'original-file-invalid');
+      return false;
+    }
+
+    setOrUpdateObjectProperty(
+      compilerOptionsObj,
+      'sourceMap',
+      b.booleanLiteral(true),
+    );
+
+    setOrUpdateObjectProperty(
+      compilerOptionsObj,
+      'inlineSources',
+      b.booleanLiteral(true),
+    );
+
+    setOrUpdateObjectProperty(
+      compilerOptionsObj,
+      'sourceRoot',
+      b.stringLiteral('/'),
+      'Set `sourceRoot` to  "/" to strip the build path prefix\nfrom generated source code references.\nThis improves issue grouping in Sentry.',
+    );
+
+    const code = printJsonC(ast);
+
+    await fs.promises.writeFile(tsConfigPath, code);
+
+    clack.log.success(
+      `Enabled source maps generation in ${chalk.cyan(
+        path.basename(tsConfigPath || 'tsconfig.json'),
+      )}.`,
+    );
+
+    return true;
+  } catch (e) {
+    debug(e);
+    Sentry.setTag('ast-mod-fail-reason', 'insertion-fail');
+    return false;
   }
 }
-`);

package/src/sourcemaps/tools/vite.ts

@@ -15,8 +15,12 @@ import chalk from 'chalk';
 import {
   abortIfCancelled,
   addDotEnvSentryBuildPluginFile,
+  askForToolConfigPath,
+  createNewConfigFile,
   getPackageDotJson,
   installPackage,
+  makeCodeSnippet,
+  showCopyPasteInstructions,
 } from '../../utils/clack-utils';
 import { hasPackageInstalled } from '../../utils/package-json';
 
@@ -33,52 +37,27 @@ import { debug } from '../../utils/debug';
 const getViteConfigSnippet = (
   options: SourceMapUploadToolConfigurationOptions,
   colors: boolean,
-) => {
-  const rawImportStmt =
-    'import { sentryVitePlugin } from "@sentry/vite-plugin";';
-  const rawGenerateSourceMapsOption =
-    'sourcemap: true, // Source map generation must be turned on';
-  const rawSentryVitePluginFunction = `sentryVitePlugin({
-      authToken: process.env.SENTRY_AUTH_TOKEN,
-      org: "${options.orgSlug}",
-      project: "${options.projectSlug}",${
-    options.selfHosted ? `\n      url: "${options.url}",` : ''
-  }
-    }),`;
-
-  const importStmt = colors ? chalk.greenBright(rawImportStmt) : rawImportStmt;
-  const generateSourceMapsOption = colors
-    ? chalk.greenBright(rawGenerateSourceMapsOption)
-    : rawGenerateSourceMapsOption;
-  const sentryVitePluginFunction = colors
-    ? chalk.greenBright(rawSentryVitePluginFunction)
-    : rawSentryVitePluginFunction;
-
-  const code = getViteConfigContent(
-    importStmt,
-    generateSourceMapsOption,
-    sentryVitePluginFunction,
-  );
-  return colors ? chalk.gray(code) : code;
-};
-
-const getViteConfigContent = (
-  importStmt: string,
-  generateSourceMapsOption: string,
-  sentryVitePluginFunction: string,
-) => `import { defineConfig } from "vite";
-${importStmt}
+) =>
+  makeCodeSnippet(colors, (unchanged, plus, _) =>
+    unchanged(`import { defineConfig } from "vite";
+${plus('import { sentryVitePlugin } from "@sentry/vite-plugin";')}
 
 export default defineConfig({
   build: {
-    ${generateSourceMapsOption}
+    ${plus('sourcemap: true, // Source map generation must be turned on')}
   },
   plugins: [
     // Put the Sentry vite plugin after all other plugins
-    ${sentryVitePluginFunction}
+    ${plus(`sentryVitePlugin({
+      authToken: process.env.SENTRY_AUTH_TOKEN,
+      org: "${options.orgSlug}",
+      project: "${options.projectSlug}",${
+      options.selfHosted ? `\n      url: "${options.url}",` : ''
+    }
+    }),`)}
   ],
-});
-`;
+});`),
+  );
 
 export const configureVitePlugin: SourceMapUploadToolConfigurationFunction =
   async (options) => {
@@ -91,58 +70,43 @@ export const configureVitePlugin: SourceMapUploadToolConfigurationFunction =
     });
 
     const viteConfigPath =
-      findFile(path.resolve(process.cwd(), 'vite.config')) ||
-      (await askForViteConfigPath());
+      findFile(path.resolve(process.cwd(), 'vite.config')) ??
+      (await askForToolConfigPath('Vite', 'vite.config.js'));
 
     let successfullyAdded = false;
     if (viteConfigPath) {
       successfullyAdded = await addVitePluginToConfig(viteConfigPath, options);
     } else {
-      successfullyAdded = await createNewViteConfig(options);
+      successfullyAdded = await createNewConfigFile(
+        path.join(process.cwd(), 'vite.config.js'),
+        getViteConfigSnippet(options, false),
+        'More information about vite configs: https://vitejs.dev/config/',
+      );
+      Sentry.setTag(
+        'created-new-config',
+        successfullyAdded ? 'success' : 'fail',
+      );
     }
 
     if (successfullyAdded) {
+      clack.log.info(
+        `We recommend checking the ${
+          viteConfigPath ? 'modified' : 'added'
+        } file after the wizard finished to ensure it works with your build setup.`,
+      );
+
       Sentry.setTag('ast-mod', 'success');
     } else {
       Sentry.setTag('ast-mod', 'fail');
       await showCopyPasteInstructions(
         path.basename(viteConfigPath || 'vite.config.js'),
-        options,
+        getViteConfigSnippet(options, true),
       );
     }
 
     await addDotEnvSentryBuildPluginFile(options.authToken);
   };
 
-async function createNewViteConfig(
-  options: SourceMapUploadToolConfigurationOptions,
-): Promise<boolean> {
-  try {
-    await fs.promises.writeFile(
-      'vite.config.js',
-      getViteConfigSnippet(options, false),
-    );
-    Sentry.setTag('created-new-config', 'success');
-    return true;
-  } catch (e) {
-    debug(e);
-    Sentry.setTag('created-new-config', 'fail');
-    clack.log.warn(
-      `Could not create a new ${chalk.cyan(
-        'vite.config.js',
-      )} file. Please create one manually and follow the instructions below.`,
-    );
-
-    clack.log.info(
-      chalk.gray(
-        'More information about vite configs: https://vitejs.dev/config/',
-      ),
-    );
-
-    return false;
-  }
-}
-
 export async function addVitePluginToConfig(
   viteConfigPath: string,
   options: SourceMapUploadToolConfigurationOptions,
@@ -156,7 +120,7 @@ export async function addVitePluginToConfig(
 
     const mod = parseModule(viteConfigContent);
 
-    if (hasSentryContent(mod)) {
+    if (hasSentryContent(mod.$ast as t.Program)) {
       const shouldContinue = await abortIfCancelled(
         clack.select({
           message: `${prettyViteConfigFilename} already contains Sentry-related code. Should the wizard modify it anyway?`,
@@ -215,60 +179,6 @@ export async function addVitePluginToConfig(
   }
 }
 
-async function showCopyPasteInstructions(
-  viteConfigFilename: string,
-  options: SourceMapUploadToolConfigurationOptions,
-) {
-  clack.log.step(
-    `Add the following code to your ${chalk.cyan(viteConfigFilename)} file:`,
-  );
-
-  // Intentionally logging directly to console here so that the code can be copied/pasted directly
-  // eslint-disable-next-line no-console
-  console.log(`\n${getViteConfigSnippet(options, true)}`);
-
-  await abortIfCancelled(
-    clack.select({
-      message: 'Did you copy the snippet above?',
-      options: [{ label: 'Yes, continue!', value: true }],
-      initialValue: true,
-    }),
-  );
-}
-
-async function askForViteConfigPath(): Promise<string | undefined> {
-  const hasViteConfig = await abortIfCancelled(
-    clack.confirm({
-      message: `Do you have a vite config file (e.g. ${chalk.cyan(
-        'vite.config.js',
-      )}?`,
-      initialValue: true,
-    }),
-  );
-
-  if (!hasViteConfig) {
-    return undefined;
-  }
-
-  return await abortIfCancelled(
-    clack.text({
-      message: 'Please enter the path to your vite config file:',
-      placeholder: `.${path.sep}vite.config.js`,
-      validate: (value) => {
-        if (!value) {
-          return 'Please enter a path.';
-        }
-
-        try {
-          fs.accessSync(value);
-        } catch {
-          return 'Could not access the file at this path.';
-        }
-      },
-    }),
-  );
-}
-
 function enableSourcemapGeneration(program: t.Program): boolean {
   const configObj = getViteConfigObject(program);