@sentry/wizard 3.9.2 → 3.11.0

package/src/sourcemaps/tools/sentry-cli.ts

@@ -6,8 +6,7 @@ import * as path from 'path';
 import * as fs from 'fs';
 import {
   abortIfCancelled,
-  addSentryCliRc,
-  detectPackageManager,
+  addSentryCliConfig,
   getPackageDotJson,
   installPackage,
 } from '../../utils/clack-utils';
@@ -15,6 +14,7 @@ import {
 import { SourceMapUploadToolConfigurationOptions } from './types';
 import { hasPackageInstalled, PackageDotJson } from '../../utils/package-json';
 import { traceStep } from '../../telemetry';
+import { detectPackageManger } from '../../utils/package-manager';
 
 const SENTRY_NPM_SCRIPT_NAME = 'sentry:sourcemaps';
 
@@ -96,7 +96,7 @@ export async function configureSentryCLI(
     );
   }
 
-  await addSentryCliRc(options.authToken);
+  await addSentryCliConfig(options.authToken);
 }
 
 export async function setupNpmScriptInCI(): Promise<void> {
@@ -205,7 +205,8 @@ async function addSentryCommandToBuildCommand(
     (s) => s !== SENTRY_NPM_SCRIPT_NAME,
   );
 
-  const pacMan = detectPackageManager() || 'npm';
+  const packageManager = detectPackageManger();
+  const packageManagerName = packageManager?.name ?? 'npm';
 
   // Heuristic to pre-select the build command:
   // Often, 'build' is the prod build command, so we favour it.
@@ -220,7 +221,7 @@ async function addSentryCommandToBuildCommand(
     (await abortIfCancelled(
       clack.confirm({
         message: `Is ${chalk.cyan(
-          `${pacMan} run ${buildCommand}`,
+          `${packageManagerName} run ${buildCommand}`,
         )} your production build command?`,
       }),
     ));
@@ -228,7 +229,7 @@ async function addSentryCommandToBuildCommand(
   if (allNpmScripts.length && (!buildCommand || !isProdBuildCommand)) {
     buildCommand = await abortIfCancelled(
       clack.select({
-        message: `Which ${pacMan} command in your ${chalk.cyan(
+        message: `Which ${packageManagerName} command in your ${chalk.cyan(
           'package.json',
         )} builds your application for production?`,
         options: allNpmScripts
@@ -254,7 +255,7 @@ Please add it manually to your prod build command.`,
   packageDotJson.scripts[
     buildCommand
     // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
-  ] = `${packageDotJson.scripts[buildCommand]} && ${pacMan} run ${SENTRY_NPM_SCRIPT_NAME}`;
+  ] = `${packageDotJson.scripts[buildCommand]} && ${packageManager} run ${SENTRY_NPM_SCRIPT_NAME}`;
 
   await fs.promises.writeFile(
     path.join(process.cwd(), 'package.json'),

package/src/sourcemaps/tools/vite.ts

@@ -1,10 +1,14 @@
 // @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';
 // @ts-ignore - magicast is ESM and TS complains about that. It works though
 import { generateCode, parseModule } from 'magicast';
 // @ts-ignore - magicast is ESM and TS complains about that. It works though
 import { addVitePlugin } from 'magicast/helpers';
 
+import type { namedTypes as t } from 'ast-types';
+
+import * as recast from 'recast';
+
 import * as Sentry from '@sentry/node';
 
 import chalk from 'chalk';
@@ -20,7 +24,7 @@ import {
   SourceMapUploadToolConfigurationFunction,
   SourceMapUploadToolConfigurationOptions,
 } from './types';
-import { findScriptFile, hasSentryContent } from '../../utils/ast-utils';
+import { findFile, hasSentryContent } from '../../utils/ast-utils';
 
 import * as path from 'path';
 import * as fs from 'fs';
@@ -87,7 +91,7 @@ export const configureVitePlugin: SourceMapUploadToolConfigurationFunction =
     });
 
     const viteConfigPath =
-      findScriptFile(path.resolve(process.cwd(), 'vite.config')) ||
+      findFile(path.resolve(process.cwd(), 'vite.config')) ||
       (await askForViteConfigPath());
 
     let successfullyAdded = false;
@@ -139,7 +143,7 @@ async function createNewViteConfig(
   }
 }
 
-async function addVitePluginToConfig(
+export async function addVitePluginToConfig(
   viteConfigPath: string,
   options: SourceMapUploadToolConfigurationOptions,
 ): Promise<boolean> {
@@ -176,6 +180,12 @@ async function addVitePluginToConfig(
       }
     }
 
+    const enabledSourcemaps = enableSourcemapGeneration(mod.$ast as t.Program);
+    if (!enabledSourcemaps) {
+      Sentry.setTag('ast-mod-fail-reason', 'insertion-fail');
+      return false;
+    }
+
     const { orgSlug: org, projectSlug: project, selfHosted, url } = options;
 
     addVitePlugin(mod, {
@@ -194,7 +204,7 @@ async function addVitePluginToConfig(
     await fs.promises.writeFile(viteConfigPath, code);
 
     clack.log.success(
-      `Added the Sentry Vite plugin to ${prettyViteConfigFilename}`,
+      `Added the Sentry Vite plugin to ${prettyViteConfigFilename} and enabled source maps`,
     );
 
     return true;
@@ -218,7 +228,7 @@ async function showCopyPasteInstructions(
   console.log(`\n${getViteConfigSnippet(options, true)}`);
 
   await abortIfCancelled(
-    select({
+    clack.select({
       message: 'Did you copy the snippet above?',
       options: [{ label: 'Yes, continue!', value: true }],
       initialValue: true,
@@ -258,3 +268,123 @@ async function askForViteConfigPath(): Promise<string | undefined> {
     }),
   );
 }
+
+function enableSourcemapGeneration(program: t.Program): boolean {
+  const configObj = getViteConfigObject(program);
+
+  if (!configObj) {
+    return false;
+  }
+
+  const b = recast.types.builders;
+
+  const buildProp = configObj.properties.find(
+    (p: t.ObjectProperty) =>
+      p.key.type === 'Identifier' && p.key.name === 'build',
+  );
+
+  // case 1: build property doesn't exist yet, so we can just add it
+  if (!buildProp) {
+    configObj.properties.push(
+      b.objectProperty(
+        b.identifier('build'),
+        b.objectExpression([
+          b.objectProperty(b.identifier('sourcemap'), b.booleanLiteral(true)),
+        ]),
+      ),
+    );
+    return true;
+  }
+
+  const isValidBuildProp =
+    buildProp.type === 'ObjectProperty' &&
+    buildProp.value.type === 'ObjectExpression';
+
+  if (!isValidBuildProp) {
+    return false;
+  }
+
+  const sourceMapsProp =
+    buildProp.value.type === 'ObjectExpression' &&
+    buildProp.value.properties.find(
+      (p: t.ObjectProperty) =>
+        p.key.type === 'Identifier' && p.key.name === 'sourcemap',
+    );
+
+  // case 2: build.sourcemap property doesn't exist yet, so we just add it
+  if (!sourceMapsProp && buildProp.value.type === 'ObjectExpression') {
+    buildProp.value.properties.push(
+      b.objectProperty(b.identifier('sourcemap'), b.booleanLiteral(true)),
+    );
+    return true;
+  }
+
+  if (!sourceMapsProp || sourceMapsProp.type !== 'ObjectProperty') {
+    return false;
+  }
+
+  // case 3: build.sourcemap property exists, and it's set to 'hidden'
+  if (
+    sourceMapsProp.value.type === 'StringLiteral' &&
+    sourceMapsProp.value.value === 'hidden'
+  ) {
+    // nothing to do for us
+    return true;
+  }
+
+  // case 4: build.sourcemap property exists, but it's not enabled, so we set it to true
+  //         or it is already true in which case this is a noop
+  sourceMapsProp.value = b.booleanLiteral(true);
+  return true;
+}
+
+function getViteConfigObject(
+  program: t.Program,
+): t.ObjectExpression | undefined {
+  const defaultExport = program.body.find(
+    (s) => s.type === 'ExportDefaultDeclaration',
+  ) as t.ExportDefaultDeclaration;
+
+  if (!defaultExport) {
+    return undefined;
+  }
+
+  if (defaultExport.declaration.type === 'ObjectExpression') {
+    return defaultExport.declaration;
+  }
+
+  if (
+    defaultExport.declaration.type === 'CallExpression' &&
+    defaultExport.declaration.arguments[0].type === 'ObjectExpression'
+  ) {
+    return defaultExport.declaration.arguments[0];
+  }
+
+  if (defaultExport.declaration.type === 'Identifier') {
+    const configId = defaultExport.declaration.name;
+    return findConfigNode(configId, program);
+  }
+
+  return undefined;
+}
+
+function findConfigNode(
+  configId: string,
+  program: t.Program,
+): t.ObjectExpression | undefined {
+  for (const node of program.body) {
+    if (node.type === 'VariableDeclaration') {
+      for (const declaration of node.declarations) {
+        if (
+          declaration.type === 'VariableDeclarator' &&
+          declaration.id.type === 'Identifier' &&
+          declaration.id.name === configId &&
+          declaration.init?.type === 'ObjectExpression'
+        ) {
+          return declaration.init;
+        }
+      }
+    }
+  }
+  return undefined;
+}

package/src/sourcemaps/utils/detect-tool.ts

@@ -10,7 +10,9 @@ export type SupportedTools =
   | 'sentry-cli'
   | 'create-react-app'
   | 'angular'
-  | 'nextjs';
+  | 'nextjs'
+  | 'remix'
+  | 'no-tool';
 
 // A map of package names pointing to the tool slug.
 // The order is important, because we want to detect the most specific tool first.
@@ -25,6 +27,7 @@ export const TOOL_PACKAGE_MAP: Record<string, SupportedTools> = {
   esbuild: 'esbuild',
   rollup: 'rollup',
   typescript: 'tsc',
+  remix: 'remix',
 };
 
 export async function detectUsedTool(): Promise<SupportedTools> {

package/src/sveltekit/sdk-setup.ts

@@ -15,7 +15,7 @@ import { addVitePlugin } from 'magicast/helpers';
 import { getClientHooksTemplate, getServerHooksTemplate } from './templates';
 import { abortIfCancelled, isUsingTypeScript } from '../utils/clack-utils';
 import { debug } from '../utils/debug';
-import { findScriptFile, hasSentryContent } from '../utils/ast-utils';
+import { findFile, hasSentryContent } from '../utils/ast-utils';
 
 const SVELTE_CONFIG_FILE = 'svelte.config.js';
 
@@ -46,10 +46,10 @@ export async function createOrMergeSvelteKitFiles(
   const { clientHooksPath, serverHooksPath } = getHooksConfigDirs(svelteConfig);
 
   // full file paths with correct file ending (or undefined if not found)
-  const originalClientHooksFile = findScriptFile(clientHooksPath);
-  const originalServerHooksFile = findScriptFile(serverHooksPath);
+  const originalClientHooksFile = findFile(clientHooksPath);
+  const originalServerHooksFile = findFile(serverHooksPath);
 
-  const viteConfig = findScriptFile(path.resolve(process.cwd(), 'vite.config'));
+  const viteConfig = findFile(path.resolve(process.cwd(), 'vite.config'));
 
   const fileEnding = isUsingTypeScript() ? 'ts' : 'js';
 

package/src/sveltekit/sveltekit-wizard.ts

@@ -4,12 +4,10 @@ import chalk from 'chalk';
 
 import {
   abort,
-  addSentryCliRc,
-  askForProjectSelection,
-  askForSelfHosted,
-  askForWizardLogin,
+  addSentryCliConfig,
   confirmContinueEvenThoughNoGitRepo,
   ensurePackageIsInstalled,
+  getOrAskForProjectData,
   getPackageDotJson,
   installPackage,
   printWelcome,
@@ -32,22 +30,15 @@ export async function runSvelteKitWizard(
   const packageJson = await getPackageDotJson();
   await ensurePackageIsInstalled(packageJson, '@sveltejs/kit', 'Sveltekit');
 
-  const { url: sentryUrl, selfHosted } = await askForSelfHosted(options.url);
-
-  const { projects, apiKeys } = await askForWizardLogin({
-    promoCode: options.promoCode,
-    url: sentryUrl,
-    platform: 'javascript-sveltekit',
-  });
-
-  const selectedProject = await askForProjectSelection(projects);
+  const { selectedProject, selfHosted, sentryUrl, authToken } =
+    await getOrAskForProjectData(options, 'javascript-sveltekit');
 
   await installPackage({
     packageName: '@sentry/sveltekit',
     alreadyInstalled: hasPackageInstalled('@sentry/sveltekit', packageJson),
   });
 
-  await addSentryCliRc(apiKeys.token);
+  await addSentryCliConfig(authToken);
 
   const svelteConfig = await loadSvelteConfig();
 

package/src/telemetry.ts

@@ -52,6 +52,8 @@ function createSentryInstance(enabled: boolean, integration: string) {
     dsn: 'https://8871d3ff64814ed8960c96d1fcc98a27@o1.ingest.sentry.io/4505425820712960',
     enabled: enabled,
 
+    environment: `production-${integration}`,
+
     tracesSampleRate: 1,
     sampleRate: 1,
 

package/src/utils/ast-utils.ts

@@ -3,13 +3,15 @@ import * as fs from 'fs';
 import { ProxifiedModule } from 'magicast';
 
 /**
- * Checks if a JS/TS file where we don't know its concrete file type yet exists
+ * 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.
  */
-export function findScriptFile(hooksFile: string): string | undefined {
-  const possibleFileTypes = ['.js', '.ts', '.mjs'];
-  return possibleFileTypes
-    .map((type) => `${hooksFile}${type}`)
+export function findFile(
+  filePath: string,
+  fileTypes: string[] = ['.js', '.ts', '.mjs'],
+): string | undefined {
+  return fileTypes
+    .map((type) => `${filePath}${type}`)
     .find((file) => fs.existsSync(file));
 }