@d-es-ign/stryker-js-instrumenter 9.6.0

package/src/parsers/parser-context.ts

@@ -0,0 +1,15 @@
+import { Ast, AstFormat, AstByFormat } from '../syntax/index.js';
+
+export interface ParserContext {
+  parse<T extends AstFormat>(
+    code: string,
+    fileName: string,
+    formatOverride?: T,
+  ): Promise<AstByFormat[T]>;
+}
+
+export type Parser<T extends Ast = Ast> = (
+  text: string,
+  fileName: string,
+  context: ParserContext,
+) => Promise<T>;

package/src/parsers/parser-options.ts

@@ -0,0 +1,3 @@
+export interface ParserOptions {
+  plugins: unknown[] | null;
+}

package/src/parsers/svelte-parser.ts

@@ -0,0 +1,255 @@
+import type { BaseNode, Program } from 'estree';
+import type { AST } from 'svelte/compiler';
+
+import { notEmpty } from '@stryker-mutator/util';
+
+import { satisfies } from 'semver';
+
+import {
+  AstFormat,
+  SvelteAst,
+  TemplateScript,
+  SvelteRootNode,
+} from '../syntax/index.js';
+import { PositionConverter } from '../util/index.js';
+
+import { ParserContext } from './parser-context.js';
+
+interface Range {
+  start: number;
+  end: number;
+}
+interface TemplateRange extends Range {
+  isExpression: boolean;
+}
+
+interface TemplateScriptRange extends TemplateRange {
+  format: AstFormat.JS | AstFormat.TS;
+}
+
+interface ScriptTag {
+  content: string;
+  attributes: Record<string, boolean | string>;
+}
+
+type RangedProgram = Program & Range;
+const MIN_SVELTE_VERSION = '>=3.30';
+export async function parse(
+  text: string,
+  fileName: string,
+  context: ParserContext,
+): Promise<SvelteAst> {
+  const {
+    parse: svelteParse,
+    preprocess,
+    VERSION,
+  } = await import('svelte/compiler');
+  let walk: typeof import('estree-walker').walk;
+
+  if (!satisfies(VERSION, MIN_SVELTE_VERSION)) {
+    throw new Error(
+      `Svelte version ${VERSION} not supported. Expected: ${MIN_SVELTE_VERSION} (processing file ${fileName})`,
+    );
+  }
+  /*
+    Allow instrumentation of Svelte 5 projects without dropping support for Svelte 4.
+    Due to the way Svelte 5 is structured, we can no longer use the typings from Svelte 4, even though
+    we use the legacy AST. The full Svelte 5 migration should update these typings to use the new AST.
+  */
+  if (satisfies(VERSION, '>=5')) {
+    ({ walk } = await import(
+      import.meta.resolve('estree-walker', import.meta.resolve('svelte'))
+    ));
+  } else {
+    // Svelte 4
+    ({ walk } = await import('svelte/compiler'));
+  }
+
+  const positionConverter = new PositionConverter(text);
+  const { replacedCode, scriptMap } = await replaceScripts(text);
+  const svelteAst = svelteParse(replacedCode, { filename: fileName });
+
+  const moduleScriptRange = getModuleScriptRange(svelteAst);
+  const templateRanges = getTemplateScriptRanges(svelteAst);
+  const { remappedModuleScriptRange, remappedScriptRanges } =
+    remapScriptLocations(
+      replacedCode,
+      scriptMap,
+      moduleScriptRange,
+      templateRanges,
+    );
+
+  const [moduleScript, ...additionalScripts] = await Promise.all([
+    parseTemplateScriptIfDefined(remappedModuleScriptRange),
+    ...remappedScriptRanges.map(parseTemplateScript),
+  ]);
+  const root: SvelteRootNode = { moduleScript, additionalScripts };
+
+  return {
+    originFileName: fileName,
+    rawContent: text,
+    format: AstFormat.Svelte,
+    root,
+  };
+
+  /**
+   * Replaces script tags with placeholders.
+   * This is needed, because svelte's `parse` doesn't support `lang="ts"`.
+   */
+  async function replaceScripts(code: string) {
+    const map = new Map<string, ScriptTag>();
+    let scriptIndex = 0;
+    const result = await preprocess(code, {
+      script(script) {
+        const scriptName = `script${scriptIndex++}`;
+        map.set(scriptName, script);
+        return { code: scriptName };
+      },
+    });
+    return { replacedCode: result.code, scriptMap: map };
+  }
+
+  function getTemplateScriptRanges(ast: Record<string, any>): TemplateRange[] {
+    const ranges: TemplateRange[] = [];
+
+    if (ast.instance) {
+      const { start, end } = ast.instance.content as RangedProgram;
+      ranges.push({ start, end, isExpression: false });
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+    walk(ast.html, {
+      enter(n) {
+        const node = n as any;
+        if (
+          node.type === 'Element' &&
+          node.name === 'script' &&
+          node.children?.[0].type === 'Text'
+        ) {
+          const textContentNode = node.children[0] as AST.Text;
+          ranges.push({
+            start: textContentNode.start,
+            end: textContentNode.end,
+            isExpression: false,
+          });
+        }
+
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+        const templateExpression = collectTemplateExpression(node);
+        if (templateExpression) {
+          const { start, end } = templateExpression;
+          ranges.push({ start, end, isExpression: true });
+        }
+      },
+    });
+
+    return ranges;
+  }
+
+  async function parseTemplateScriptIfDefined(
+    range?: TemplateScriptRange,
+  ): Promise<TemplateScript | undefined> {
+    if (range) {
+      return parseTemplateScript(range);
+    }
+    return;
+  }
+  async function parseTemplateScript({
+    start,
+    end,
+    isExpression,
+    format,
+  }: TemplateScriptRange): Promise<TemplateScript> {
+    const scriptText = text.slice(start, end);
+    const parsed = await context.parse(scriptText, fileName, format);
+    return {
+      ast: {
+        ...parsed,
+        offset: positionConverter.positionFromOffset(start),
+      },
+      range: { start, end },
+      isExpression,
+    };
+  }
+}
+
+function getModuleScriptRange(
+  svelteAst: Record<string, any>,
+): TemplateRange | undefined {
+  if (svelteAst.module) {
+    const script = svelteAst.module.content as RangedProgram;
+    return { start: script.start, end: script.end, isExpression: false };
+  }
+  return;
+}
+
+/**
+ * Remaps script locations back to the original places using the script map
+ */
+function remapScriptLocations(
+  code: string,
+  scriptMap: Map<string, ScriptTag>,
+  moduleScriptRange: TemplateRange | undefined,
+  templateRanges: TemplateRange[],
+): {
+  remappedModuleScriptRange: TemplateScriptRange | undefined;
+  remappedScriptRanges: TemplateScriptRange[];
+} {
+  const scriptRanges = [moduleScriptRange, ...templateRanges]
+    .filter(notEmpty)
+    .sort((a, b) => a.start - b.start);
+  let offset = 0;
+  let newModuleScriptRange: TemplateScriptRange | undefined;
+  const newScriptRanges: TemplateScriptRange[] = scriptRanges.map((range) => {
+    const script = code.substring(range.start, range.end);
+    const actualScript = scriptMap.get(script);
+    const start = range.start + offset;
+    if (actualScript) {
+      const scriptRange: TemplateScriptRange = {
+        start,
+        end: start + actualScript.content.length,
+        isExpression: range.isExpression,
+        format:
+          actualScript.attributes.lang === 'ts' ? AstFormat.TS : AstFormat.JS,
+      };
+      offset += actualScript.content.length - script.length;
+      if (range === moduleScriptRange) {
+        newModuleScriptRange = scriptRange;
+      }
+      return scriptRange;
+    } else {
+      // Template script is always JS
+      return {
+        start,
+        end: start + script.length,
+        isExpression: range.isExpression,
+        format: AstFormat.JS,
+      };
+    }
+  });
+  return {
+    remappedModuleScriptRange: newModuleScriptRange,
+    remappedScriptRanges: newScriptRanges.filter(
+      (range) => range !== newModuleScriptRange,
+    ),
+  };
+}
+
+function collectTemplateExpression(node: {
+  type: string;
+  expression: BaseNode & Range;
+}): (BaseNode & Range) | undefined {
+  switch (node.type) {
+    case 'MustacheTag':
+    case 'RawMustacheTag':
+    case 'IfBlock':
+    case 'ConstTag':
+    case 'EachBlock':
+    case 'AwaitBlock':
+    case 'KeyBlock':
+    case 'EventHandler':
+      return node.expression;
+    default:
+      return undefined;
+  }
+}

package/src/parsers/ts-parser.ts

@@ -0,0 +1,69 @@
+import { createRequire } from 'module';
+
+import babel from '@babel/core';
+
+import { AstFormat, TSAst, TsxAst } from '../syntax/index.js';
+
+const { types, parseAsync } = babel;
+const require = createRequire(import.meta.url);
+/**
+ * See https://babeljs.io/docs/en/babel-preset-typescript
+ * @param text The text to parse
+ * @param fileName The name of the file
+ */
+export async function parseTS(text: string, fileName: string): Promise<TSAst> {
+  return {
+    originFileName: fileName,
+    rawContent: text,
+    format: AstFormat.TS,
+    root: await parse(text, fileName, false),
+  };
+}
+
+export async function parseTsx(
+  text: string,
+  fileName: string,
+): Promise<TsxAst> {
+  return {
+    root: await parse(text, fileName, true),
+    format: AstFormat.Tsx,
+    originFileName: fileName,
+    rawContent: text,
+  };
+}
+
+async function parse(
+  text: string,
+  fileName: string,
+  isTSX: boolean,
+): Promise<babel.types.File> {
+  const ast = await parseAsync(text, {
+    filename: fileName,
+    parserOpts: {
+      ranges: true,
+    },
+    configFile: false,
+    babelrc: false,
+    presets: [
+      [
+        require.resolve('@babel/preset-typescript'),
+        { isTSX, allExtensions: true },
+      ],
+    ],
+    plugins: [
+      [require.resolve('@babel/plugin-proposal-decorators'), { legacy: true }],
+      [require.resolve('@babel/plugin-transform-explicit-resource-management')],
+    ],
+  });
+  if (ast === null) {
+    throw new Error(
+      `Expected ${fileName} to contain a babel.types.file, but it yielded null`,
+    );
+  }
+  if (types.isProgram(ast)) {
+    throw new Error(
+      `Expected ${fileName} to contain a babel.types.file, but was a program`,
+    );
+  }
+  return ast;
+}

package/src/printers/html-printer.ts

@@ -0,0 +1,20 @@
+import { HtmlAst } from '../syntax/index.js';
+
+import { Printer } from './index.js';
+
+export const print: Printer<HtmlAst> = (ast, context) => {
+  const sortedScripts = [...ast.root.scripts].sort(
+    (a, b) => a.root.start! - b.root.start!,
+  );
+  let currentIndex = 0;
+  let html = '';
+  for (const script of sortedScripts) {
+    html += ast.rawContent.substring(currentIndex, script.root.start!);
+    html += '\n';
+    html += context.print(script, context);
+    html += '\n';
+    currentIndex = script.root.end!;
+  }
+  html += ast.rawContent.substr(currentIndex);
+  return html;
+};

package/src/printers/index.ts

@@ -0,0 +1,33 @@
+import { Ast, AstFormat } from '../syntax/index.js';
+
+import { print as htmlPrint } from './html-printer.js';
+import { print as jsPrint } from './js-printer.js';
+import { print as tsPrint } from './ts-printer.js';
+import { print as sveltePrint } from './svelte-printer.js';
+
+export type Printer<T extends Ast> = (
+  file: T,
+  context: PrinterContext,
+) => string;
+
+export interface PrinterContext {
+  print: Printer<Ast>;
+}
+
+export function print(file: Ast): string {
+  const context: PrinterContext = {
+    print,
+  };
+  switch (file.format) {
+    case AstFormat.JS:
+      return jsPrint(file, context);
+    case AstFormat.TS:
+      return tsPrint(file, context);
+    case AstFormat.Tsx:
+      return tsPrint(file, context);
+    case AstFormat.Html:
+      return htmlPrint(file, context);
+    case AstFormat.Svelte:
+      return sveltePrint(file, context);
+  }
+}

package/src/printers/js-printer.ts

@@ -0,0 +1,11 @@
+import generator from '@babel/generator';
+
+import { JSAst } from '../syntax/index.js';
+
+import { Printer } from './index.js';
+
+const generate = generator.default;
+
+export const print: Printer<JSAst> = (file) => {
+  return generate(file.root, { sourceMaps: false }).code;
+};

package/src/printers/svelte-printer.ts

@@ -0,0 +1,34 @@
+import { notEmpty } from '@stryker-mutator/util';
+
+import { SvelteAst } from '../syntax/index.js';
+
+import { Printer } from './index.js';
+
+export const print: Printer<SvelteAst> = ({ root, rawContent }, context) => {
+  let currentIndex = 0;
+  let outputText = '';
+
+  const sortedScripts = [root.moduleScript, ...root.additionalScripts]
+    .filter(notEmpty)
+    .sort((a, b) => a.range.start - b.range.start);
+  for (const script of sortedScripts) {
+    if (script.isExpression) {
+      const code = context.print(script.ast, context);
+      const codeWithoutSemicolon = code.slice(0, -1);
+      outputText +=
+        rawContent.substring(currentIndex, script.range.start) +
+        codeWithoutSemicolon;
+      currentIndex = script.range.end;
+    } else {
+      outputText += rawContent.substring(currentIndex, script.range.start);
+      outputText += '\n';
+      outputText += context.print(script.ast, context);
+      outputText += '\n';
+      currentIndex = script.range.end;
+    }
+  }
+
+  outputText += rawContent.substring(currentIndex);
+
+  return outputText;
+};

package/src/printers/ts-printer.ts

@@ -0,0 +1,14 @@
+import generator from '@babel/generator';
+
+import { TSAst, TsxAst } from '../syntax/index.js';
+
+import { Printer } from './index.js';
+
+const generate = generator.default;
+
+export const print: Printer<TSAst | TsxAst> = (file) => {
+  return generate(file.root, {
+    decoratorsBeforeExport: true,
+    sourceMaps: false,
+  }).code;
+};

package/src/syntax/index.ts

@@ -0,0 +1,97 @@
+import type { types as babelTypes } from '@babel/core';
+import { Position } from '@stryker-mutator/api/core';
+
+export enum AstFormat {
+  Html = 'html',
+  JS = 'js',
+  TS = 'ts',
+  Tsx = 'tsx',
+  Svelte = 'svelte',
+}
+
+export interface AstByFormat {
+  [AstFormat.Html]: HtmlAst;
+  [AstFormat.JS]: JSAst;
+  [AstFormat.TS]: TSAst;
+  [AstFormat.Tsx]: TsxAst;
+  [AstFormat.Svelte]: SvelteAst;
+}
+export type Ast = HtmlAst | JSAst | SvelteAst | TSAst | TsxAst;
+
+export type ScriptFormat = AstFormat.JS | AstFormat.TS | AstFormat.Tsx;
+export type ScriptAst = JSAst | TSAst | TsxAst;
+export interface BaseAst {
+  originFileName: string;
+  rawContent: string;
+  root: Ast['root'];
+  offset?: Position;
+}
+
+/**
+ * Represents an Html AST.
+ */
+export interface HtmlAst extends BaseAst {
+  format: AstFormat.Html;
+  root: HtmlRootNode;
+}
+
+/**
+ * Represents a TS AST
+ */
+export interface JSAst extends BaseAst {
+  format: AstFormat.JS;
+  root: babelTypes.File;
+}
+
+/**
+ * Represents a TS AST
+ */
+export interface TSAst extends BaseAst {
+  format: AstFormat.TS;
+  root: babelTypes.File;
+}
+
+/**
+ * Represents a TS AST
+ */
+export interface TsxAst extends BaseAst {
+  format: AstFormat.Tsx;
+  root: babelTypes.File;
+}
+
+/**
+ * Represents a Svelte AST
+ */
+export interface SvelteAst extends BaseAst {
+  format: AstFormat.Svelte;
+  root: SvelteRootNode;
+}
+
+/**
+ * Represents the root node of an HTML AST
+ * We've taken a shortcut here, instead of representing the entire AST, we're only representing the script tags.
+ * We might need to expand this in the future if we would ever want to support mutating the actual HTML (rather than only the JS/TS)
+ */
+export interface HtmlRootNode {
+  scripts: ScriptAst[];
+}
+
+export interface SvelteRootNode {
+  moduleScript?: TemplateScript;
+  additionalScripts: TemplateScript[];
+}
+
+/**
+ * Represents a svelte script or binding expression
+ * We've taken a shortcut here, instead of representing the entire AST, we're only representing the script tags and expression bindings.
+ */
+export interface TemplateScript {
+  ast: ScriptAst;
+  range: Range;
+  isExpression: boolean;
+}
+
+export interface Range {
+  start: number;
+  end: number;
+}