ember.nvp 0.6.0 → 0.7.0

package/test/ember.nvp/rewrite-imports.test.ts

@@ -0,0 +1,235 @@
+import { describe, it, expect, afterEach } from "vitest";
+import { mkdir, mkdtemp, rm, writeFile } from "node:fs/promises";
+import { tmpdir } from "node:os";
+import { dirname, join } from "node:path";
+
+import { rewriteImportsToMatchFiles } from "#utils/rewrite-imports.js";
+
+/**
+ * Generation renames files (e.g. type removal turns .ts into .js), so
+ * import specifiers are checked against the emitted project tree:
+ * whatever file actually exists on disk wins.
+ */
+describe("rewriteImportsToMatchFiles", () => {
+  const dirs: string[] = [];
+
+  afterEach(async () => {
+    for (const dir of dirs.splice(0)) {
+      await rm(dir, { recursive: true, force: true });
+    }
+  });
+
+  /**
+   * Lays out an emitted-project fixture on disk (the way generation
+   * stages real files) and returns its root.
+   */
+  async function makeProject(files: Record<string, string>) {
+    const dir = await mkdtemp(join(tmpdir(), "rewrite-imports-test-"));
+    dirs.push(dir);
+
+    for (const [path, contents] of Object.entries(files)) {
+      await mkdir(join(dir, dirname(path)), { recursive: true });
+      await writeFile(join(dir, path), contents);
+    }
+
+    return dir;
+  }
+
+  const manifest = JSON.stringify({
+    name: "fixture",
+    imports: {
+      "#app/*": "./app/*",
+      "#config": "./app/config.js",
+    },
+  });
+
+  it("rewrites a specifier whose file was renamed", async () => {
+    const project = await makeProject({
+      "package.json": manifest,
+      "app/app.js": "",
+      "app/config.js": "",
+    });
+
+    const result = rewriteImportsToMatchFiles(
+      [`import Application from "#app/app.ts";`, `import config from "#config";`].join("\n"),
+      join(project, "tests/test-helper.js"),
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import Application from "#app/app.js";
+      import config from "#config";"
+    `);
+  });
+
+  it("leaves a specifier alone when its file exists as written", async () => {
+    const project = await makeProject({
+      "package.json": manifest,
+      "app/helpers/x.ts": "",
+    });
+
+    const result = rewriteImportsToMatchFiles(
+      `import x from "./helpers/x.ts";`,
+      join(project, "app/consumer.ts"),
+    );
+
+    expect(result).toMatchInlineSnapshot(`"import x from "./helpers/x.ts";"`);
+  });
+
+  it("adds the on-disk extension to extensionless local imports", async () => {
+    const project = await makeProject({
+      "package.json": manifest,
+      "app/helpers/x.js": "",
+      "app/app.ts": "",
+    });
+
+    const result = rewriteImportsToMatchFiles(
+      [`import x from "./helpers/x";`, `import Application from "#app/app";`].join("\n"),
+      join(project, "app/consumer.js"),
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import x from "./helpers/x.js";
+      import Application from "#app/app.ts";"
+    `);
+  });
+
+  it("keeps an extensionless specifier whose fully-specified form would not map", async () => {
+    const project = await makeProject({
+      "package.json": manifest,
+      "app/config.js": "",
+    });
+
+    // `#config` maps to "./app/config.js" -- the extension lives in the
+    // `imports` target, so "#config.js" would not resolve
+    const result = rewriteImportsToMatchFiles(
+      `import config from "#config";`,
+      join(project, "app/consumer.js"),
+    );
+
+    expect(result).toMatchInlineSnapshot(`"import config from "#config";"`);
+  });
+
+  it("rewrites relative, re-export, and dynamic import() specifiers", async () => {
+    const project = await makeProject({
+      "package.json": manifest,
+      "app/thing.js": "",
+      "shared/other.js": "",
+      "app/lazy.js": "",
+    });
+
+    const result = rewriteImportsToMatchFiles(
+      [
+        `export { thing } from "./thing.ts";`,
+        `export * from "../shared/other.ts";`,
+        `export async function load() {`,
+        `  return await import("./lazy.ts");`,
+        `}`,
+      ].join("\n"),
+      join(project, "app/consumer.js"),
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "export { thing } from "./thing.js";
+      export * from "../shared/other.js";
+      export async function load() {
+        return await import("./lazy.js");
+      }"
+    `);
+  });
+
+  it("leaves a specifier alone when no file matches at all", async () => {
+    const project = await makeProject({
+      "package.json": manifest,
+    });
+
+    const result = rewriteImportsToMatchFiles(
+      `import missing from "./does-not-exist.ts";`,
+      join(project, "app/consumer.js"),
+    );
+
+    expect(result).toMatchInlineSnapshot(`"import missing from "./does-not-exist.ts";"`);
+  });
+
+  it("leaves package specifiers and non-import strings alone", async () => {
+    const project = await makeProject({
+      "package.json": manifest,
+      "app/looks-like-a-file.js": "",
+    });
+
+    const result = rewriteImportsToMatchFiles(
+      [`import lib from "some-lib/file.ts";`, `const notAnImport = "./looks-like-a-file.ts";`].join(
+        "\n",
+      ),
+      join(project, "app/consumer.js"),
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import lib from "some-lib/file.ts";
+      const notAnImport = "./looks-like-a-file.ts";"
+    `);
+  });
+
+  it("rewrites imports in gjs files while preserving the template", async () => {
+    const project = await makeProject({
+      "package.json": manifest,
+      "app/components/button.gjs": "",
+    });
+
+    const result = rewriteImportsToMatchFiles(
+      [
+        `import Component from "@glimmer/component";`,
+        `import Button from "./button.gts";`,
+        ``,
+        `export default class Foo extends Component {`,
+        `  <template>`,
+        `    <Button />`,
+        `  </template>`,
+        `}`,
+      ].join("\n"),
+      join(project, "app/components/foo.gjs"),
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import Component from "@glimmer/component";
+      import Button from "./button.gjs";
+      export default class Foo extends Component {
+        <template><Button /></template>
+      }"
+    `);
+  });
+
+  it("keeps comments in files whose imports are rewritten", async () => {
+    const project = await makeProject({
+      "package.json": manifest,
+      "app/app.js": "",
+    });
+
+    const result = rewriteImportsToMatchFiles(
+      [
+        `// top comment`,
+        `import Application from "#app/app.ts";`,
+        ``,
+        `/**`,
+        ` * doc comment for start`,
+        ` */`,
+        `export function start() {`,
+        `  // inner comment`,
+        `  Application.create();`,
+        `}`,
+      ].join("\n"),
+      join(project, "tests/test-helper.js"),
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "// top comment
+      import Application from "#app/app.js";
+      /**
+       * doc comment for start
+       */
+      export function start() {
+        // inner comment
+        Application.create();
+      }"
+    `);
+  });
+});

package/test/test-helpers/permutate.test.ts

@@ -51,6 +51,23 @@ describe("permutate", () => {
     expect(hasOneEslint).toBe(true);
   });
 
+  it("enforces mutual exclusivity for testing layers", () => {
+    const result = permutate(["qunit", "vitest", "other"]);
+
+    for (const permutation of result) {
+      const testingCount = permutation.filter(
+        (item) => item === "qunit" || item === "vitest",
+      ).length;
+      expect(testingCount).toBeLessThanOrEqual(1);
+    }
+
+    const hasQunit = result.some((perm) => perm.includes("qunit"));
+    const hasVitest = result.some((perm) => perm.includes("vitest"));
+
+    expect(hasQunit).toBe(true);
+    expect(hasVitest).toBe(true);
+  });
+
   it("generates valid permutations with mixed items", () => {
     const result = permutate(["a", "eslint-foo", "eslint-bar", "b"]);
 

package/test/test-helpers.ts

@@ -16,10 +16,22 @@ export const bases = [minimalApp, minimalAddon];
 
 export const layers = await discoverLayers();
 
+/**
+ * Layers in the same group are alternatives to each other (one eslint
+ * config, one test framework): selecting two of them would produce a
+ * broken project, so permutations never combine them.
+ */
+function exclusivityGroup(name: string): string | undefined {
+  if (name.startsWith("eslint-")) return "eslint";
+  if (name === "qunit" || name === "vitest") return "testing";
+
+  return undefined;
+}
+
 export function permutate(toPermutate: string[]): string[][] {
   const out: string[][] = [];
 
-  function backtrack(startIndex: number, prefix: string[], hasEslint: boolean) {
+  function backtrack(startIndex: number, prefix: string[], usedGroups: Set<string>) {
     if (prefix.length > 0) out.push(prefix.slice());
 
     for (let i = startIndex; i < toPermutate.length; i++) {
@@ -34,19 +46,20 @@ export function permutate(toPermutate: string[]): string[][] {
       // (silly TS not understanding loop bounds)
       if (!option) continue;
 
-      const isEslint = option.startsWith("eslint-");
+      const group = exclusivityGroup(option);
 
-      // Skip this option if it's an eslint entry and we already have one
-      // (enforce mutual exclusivity for eslint-prefixed entries)
-      if (isEslint && hasEslint) continue;
+      // Skip this option if we already have one from its exclusivity group
+      if (group && usedGroups.has(group)) continue;
 
+      if (group) usedGroups.add(group);
       prefix.push(option);
-      backtrack(i + 1, prefix, hasEslint || isEslint);
+      backtrack(i + 1, prefix, usedGroups);
       prefix.pop();
+      if (group) usedGroups.delete(group);
     }
   }
 
-  backtrack(0, [], false);
+  backtrack(0, [], new Set());
   return out;
 }
 

package/tsconfig.json

@@ -10,6 +10,7 @@
     "dist",
     "packages",
     "src/**/layers/*/files/**",
+    "src/**/layers/*/library-files/**",
     "src/**/bases/*/files/**",
     "my-app"
   ]

package/packages/vite/src/maybe-babel.ts

@@ -1,219 +0,0 @@
-/**
- * Reasons we have to have babel
- * - decorators
- * - ember-concurrency
- * - scoped-css
- * - template compilation optimization
- */
-import { extensions } from "@embroider/vite";
-import { babel } from "@rollup/plugin-babel";
-import { join, resolve } from "node:path";
-import { parse as oxcParse } from "oxc-parser";
-import { transform } from "oxc-transform";
-import { walk } from "zimmerframe";
-
-/**
- * if a file imports any of these, it must be optimize
- */
-const babelTemplateImports = new Set([
-  // Templates
-  "@ember/template-compiler",
-  "@ember/template-compilation",
-  "ember-cli-htmlbars",
-  "ember-cli-htmlbars-inline-precompile",
-  "htmlbars-inline-precompile",
-]);
-
-const babelMacroImports = new Set([
-  // Macros
-  "@embroider/macros",
-  "@glimmer/env",
-  "@ember/application/deprecations",
-  // Macros only needed in prod
-  "@ember/debug",
-]); // Babel plugins required from libraries
-const babelOtherImports = new Set([
-  "ember-concurrency",
-  "ember-scoped-css",
-  "ember-intl/helpers/format-message",
-]);
-
-const babelRequiredImports = [...babelTemplateImports, ...babelMacroImports, ...babelOtherImports];
-
-const counts = {
-  total: 0,
-  babel: 0,
-  why: {
-    decorators: 0,
-    formatMessage: 0,
-    imports: {
-      templates: 0,
-      macros: 0,
-      other: 0,
-    },
-    initializeRuntimeMacrosConfig: 0,
-  },
-};
-export function maybeBabel(options: { parallel?: boolean; configFile: string; env: any }) {
-  const { env, parallel, ...restOptions } = options;
-  const original = (() => {
-    const babelPath = resolve(join(process.cwd(), "./babel.config.js"));
-
-    return babel({
-      babelHelpers: "runtime",
-      extensions,
-      skipPreflightCheck: true,
-      ...restOptions,
-      configFile: babelPath,
-      parallel: parallel ?? true,
-    });
-  })();
-
-  /**
-   * In @rollup/plugin-babel v7+, the `transform` hook is the object form
-   * `{ filter, handler }` rather than a plain function. Normalize to the
-   * underlying handler so we can invoke it directly.
-   */
-  const originalTransform = (
-    typeof original.transform === "function" ? original.transform : original.transform?.handler
-  )!;
-
-  const babelMacros = new Set(babelRequiredImports);
-  if (env.mode === "development") {
-    babelMacros.delete("@ember/debug");
-  }
-
-  async function doTransform(this: any, code: string, id: string) {
-    counts.total++;
-
-    const ext = id.split(".").at(-1);
-    const lang = (ext === "gjs" ? "js" : ext === "gts" ? "ts" : ext) as
-      | "js"
-      | "ts"
-      | "jsx"
-      | "tsx"
-      | "dts"
-      | undefined;
-
-    let needsBabel = false;
-
-    const estree = await oxcParse(id, code, { lang });
-
-    walk(
-      estree.program as any,
-      /* state */ {},
-      {
-        Decorator(_node: any, { stop }: any) {
-          needsBabel = true;
-          counts.why.decorators++;
-          stop();
-        },
-        MemberExpression(node: any, { stop }: any) {
-          if (node.property?.name === "formatMessage" && node.object?.name === "intl") {
-            needsBabel = true;
-            counts.why.formatMessage++;
-            stop();
-          }
-        },
-        ImportDeclaration(node: any, { stop }: any) {
-          const value = node.source.value;
-          if (babelMacros.has(value)) {
-            needsBabel = true;
-
-            if (babelTemplateImports.has(value)) {
-              counts.why.imports.templates++;
-            } else if (babelMacroImports.has(value)) {
-              counts.why.imports.macros++;
-            } else {
-              counts.why.imports.other++;
-            }
-
-            stop();
-          }
-        },
-      },
-    );
-
-    if (!needsBabel && code.includes("initializeRuntimeMacrosConfig")) {
-      counts.why.initializeRuntimeMacrosConfig++;
-      needsBabel = true;
-    }
-
-    if (needsBabel) {
-      counts.babel++;
-
-      const result = await originalTransform.call(this, code, id);
-
-      return result;
-    }
-
-    if (ext === "json") {
-      return;
-    }
-
-    if (ext === "js" || ext === "gjs") {
-      // We don't need to process JS
-      return null;
-    }
-
-    const result = await transform(id, code, {
-      lang,
-      typescript: {
-        onlyRemoveTypeImports: true,
-        /**
-         * We should work towards disabling this.
-         */
-        allowNamespaces: true,
-        removeClassFieldsWithoutInitializer: false,
-        rewriteImportExtensions: false,
-      },
-    });
-
-    if (result.errors?.length) {
-      console.error(`Errors during oxc-transform of ${id}:`);
-      for (const err of result.errors) {
-        if (err.labels) {
-          console.error(err.labels);
-        }
-        console.error(err.codeframe || err.message);
-      }
-      throw result.errors;
-    }
-
-    return result;
-  }
-
-  return {
-    enforce: "pre",
-    buildEnd() {
-      if (process.env.INSPECT) {
-        console.debug(`Babel usage: ${counts.babel} / ${counts.total}`, counts.why);
-      }
-    },
-    ...original,
-    name: "nullvoxpopuli:babel",
-    transform: {
-      filter: {
-        id: {
-          include: [/\.js/, /\.gjs/, /\.ts/, /\.gts/],
-          exclude: [/\.json/],
-        },
-        // Enabling this opts us out of template compilation
-        // it's an AND instead of OR
-        // code: {
-        // 	include: [/initializeRuntimeMacrosConfig/, /precompileTemplate/],
-        // },
-      },
-      handler(this: any, code: string, id: string) {
-        try {
-          return doTransform.call(this, code, id);
-        } catch (e) {
-          // Use VSCode JavaScript Debug Terminal
-          // eslint-disable-next-line no-debugger
-          debugger;
-          throw e;
-        }
-      },
-    },
-  };
-}

package/src/layers/qunit/files/run-tests.mjs

@@ -1,30 +0,0 @@
-import { chromium } from "playwright";
-
-const browser = await chromium.launch();
-const page = await browser.newPage();
-
-page.on("console", (msg) => console.log(msg.text()));
-
-await page.goto("http://localhost:4173/tests");
-
-await page.waitForFunction(
-  () => {
-    const elem = document.getElementById("qunit-testresult");
-    return elem?.classList.contains("complete");
-  },
-  { timeout: 30000 },
-);
-
-const failed = await page.evaluate(() => {
-  const elem = document.getElementById("qunit-testresult");
-  return elem?.querySelector(".failed")?.textContent;
-});
-
-await browser.close();
-
-if (failed && parseInt(failed) > 0) {
-  console.error(`❌ ${failed} test(s) failed`);
-  process.exit(1);
-}
-
-console.log("✅ All tests passed!");

package/src/layers/vitest/files/tests/test-helper.ts

@@ -1,5 +0,0 @@
-import Application from "#app/app.ts";
-import config from "#app/config.ts";
-import { setApplication } from "@ember/test-helpers";
-
-setApplication(Application.create(config));