ember-vitest 0.3.0 → 0.3.2

package/README.md

@@ -1,6 +1,6 @@
 # ember-vitest
 
-Ember<->Vitest integration
+ember <-> vitest integration
 
 - browser testing is first class
 - pause test execution for UI debugging purposes (and without pausing JS execution)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ember-vitest",
-  "version": "0.3.0",
+  "version": "0.3.2",
   "description": "integration for testing Ember with Vitest",
   "keywords": [
     "ember",
@@ -36,6 +36,7 @@
   "files": [
     "ember-addon-main.cjs",
     "dist",
+    "src",
     "declarations"
   ],
   "dependencies": {
@@ -46,7 +47,7 @@
     "@babel/plugin-syntax-explicit-resource-management": "^7.27.1",
     "@babel/plugin-transform-runtime": "^7.28.3",
     "@babel/plugin-transform-typescript": "^7.28.5",
-    "@ember/library-tsconfig": "^1.1.3",
+    "@ember/library-tsconfig": "^2.0.0",
     "@ember/test-helpers": "^5.4.0",
     "@embroider/addon-dev": "^8.1.2",
     "@embroider/core": "^4.2.0",

package/src/create-app.ts

@@ -0,0 +1,21 @@
+import Application from "ember-strict-application-resolver";
+import type EmberApplication from "@ember/application";
+
+class App extends Application {
+  modules = {};
+}
+
+export function createApp(element: HTMLElement) {
+  return App.create({ autoboot: false, rootElement: element });
+}
+
+export function create(
+  app: typeof EmberApplication | undefined,
+  element: HTMLElement,
+) {
+  if (app) {
+    return app.create({ autoboot: false, rootElement: element });
+  }
+
+  return createApp(element);
+}

package/src/extended-test-context.ts

@@ -0,0 +1,149 @@
+import {
+  setApplication,
+  resumeTest,
+  pauseTest,
+  type TestContext,
+} from "@ember/test-helpers";
+
+// https://vitest.dev/guide/test-context.html#extend-test-context
+import { test as baseTest } from "vitest";
+import {
+  setupContext,
+  teardownContext,
+  setupRenderingContext,
+  setupApplicationContext,
+} from "@ember/test-helpers";
+
+import Application from "ember-strict-application-resolver";
+
+import type EmberApplication from "@ember/application";
+import type { Owner } from "@ember/test-helpers/build-owner";
+
+globalThis.resumeTest = resumeTest;
+
+class App extends Application {
+  modules = {};
+}
+
+const waitForSettled = true;
+const teardownContextOptions = { waitForSettled };
+
+type ExtendedTestContext = {
+  app: typeof EmberApplication;
+  element: HTMLElement;
+  context: TestContext;
+  env: {
+    owner: Owner;
+    element: HTMLElement;
+    pauseTest: () => Promise<void>;
+  };
+};
+
+export const test = baseTest.extend<ExtendedTestContext>({
+  app: ({}, use) => use(App),
+  element: ({}, use) => use(document.createElement("div")),
+  context: ({}, use) => use({} as TestContext),
+  env: [
+    async (
+      {
+        app,
+        element,
+        context,
+      }: {
+        app: typeof EmberApplication;
+        element: HTMLElement;
+        context: TestContext;
+      },
+      use,
+    ) => {
+      document.body.append(element);
+
+      setApplication(app.create({ autoboot: false, rootElement: element }));
+      await setupContext(context);
+
+      await use({
+        owner: context.owner,
+        element,
+        pauseTest,
+      });
+
+      await teardownContext(context, teardownContextOptions);
+      element.remove();
+    },
+    { auto: true },
+  ],
+});
+
+export const renderingTest = baseTest.extend<ExtendedTestContext>({
+  app: ({}, use) => use(App),
+  element: ({}, use) => use(document.createElement("div")),
+  context: ({}, use) => use({} as TestContext),
+  env: [
+    async (
+      {
+        app,
+        element,
+        context,
+      }: {
+        app: typeof EmberApplication;
+        element: HTMLElement;
+        context: TestContext;
+      },
+      use,
+    ) => {
+      document.body.append(element);
+
+      setApplication(app.create({ autoboot: false, rootElement: element }));
+      await setupContext(context);
+      await setupRenderingContext(context);
+
+      await use({
+        owner: context.owner,
+        element,
+        pauseTest,
+      });
+
+      await teardownContext(context, teardownContextOptions);
+      element.remove();
+    },
+    { auto: true },
+  ],
+});
+
+export const applicationTest = baseTest.extend<ExtendedTestContext>({
+  app: ({}, use) => use(App),
+  element: ({}, use) => use(document.createElement("div")),
+  context: ({}, use) => use({} as TestContext),
+  env: [
+    async (
+      {
+        app,
+        element,
+        context,
+      }: {
+        app: typeof EmberApplication;
+        element: HTMLElement;
+        context: TestContext;
+      },
+      use,
+    ) => {
+      document.body.append(element);
+
+      console.log(app);
+
+      setApplication(app.create({ autoboot: false, rootElement: element }));
+      await setupContext(context);
+      await setupApplicationContext(context);
+
+      await use({
+        owner: context.owner,
+        element,
+        pauseTest,
+      });
+
+      await teardownContext(context, teardownContextOptions);
+      element.remove();
+    },
+    { auto: true },
+  ],
+});

package/src/global.ts

@@ -0,0 +1,6 @@
+declare global {
+  var resumeTest: typeof import("@ember/test-helpers").resumeTest;
+  var pauseTest: typeof import("@ember/test-helpers").pauseTest;
+}
+
+export {};

package/src/index.ts

@@ -0,0 +1,7 @@
+export {
+  test,
+  renderingTest,
+  applicationTest,
+} from "./extended-test-context.ts";
+
+export { setupContext, setupRenderingContext } from "./manual.ts";

package/src/manual.ts

@@ -0,0 +1,112 @@
+import { getOwner } from "@ember/owner";
+import { settled, click, type TestContext } from "@ember/test-helpers";
+import {
+  setupContext as emberSetupContext,
+  teardownContext,
+  setApplication,
+  type Target,
+} from "@ember/test-helpers";
+import { renderComponent } from "@ember/renderer";
+import { create, createApp } from "./create-app.ts";
+
+import type EmberApplication from "@ember/application";
+import type Component from "@glimmer/component";
+import type TOC from "@ember/component/template-only";
+
+export function setupContext() {
+  let element = document.createElement("div");
+  document.body.append(element);
+  const app = createApp(element);
+
+  return {
+    element,
+    get owner() {
+      return getOwner(app);
+    },
+    async [Symbol.asyncDispose]() {
+      app.destroy();
+      await settled();
+      element.remove();
+    },
+  };
+}
+
+export async function setupRenderingContext(app: typeof EmberApplication) {
+  let element = document.createElement("div");
+  document.body.append(element);
+
+  let renders: Array<ReturnType<typeof renderComponent>> = [];
+  let ctx = {} as TestContext;
+  let created = create(app, element);
+
+  setApplication(created);
+
+  await emberSetupContext(ctx);
+
+  // Overloads that match Element.querySelector:
+  function find<K extends keyof (HTMLElementTagNameMap | SVGElementTagNameMap)>(
+    selector: K,
+  ): HTMLElementTagNameMap[K] | SVGElementTagNameMap[K] | null;
+  function find<K extends keyof HTMLElementTagNameMap>(
+    selector: K,
+  ): HTMLElementTagNameMap[K] | null;
+  function find<K extends keyof SVGElementTagNameMap>(
+    selector: K,
+  ): SVGElementTagNameMap[K] | null;
+  function find<E extends Element = Element>(selector: string): E | null;
+  function find(selector: string) {
+    return element.querySelector(selector);
+  }
+
+  // Overloads that match Element.querySelectorAll:
+  function findAll<K extends keyof HTMLElementTagNameMap>(
+    selector: K,
+  ): NodeListOf<HTMLElementTagNameMap[K]>;
+  function findAll<K extends keyof SVGElementTagNameMap>(
+    selector: K,
+  ): NodeListOf<SVGElementTagNameMap[K]>;
+  function findAll<K extends keyof HTMLElementDeprecatedTagNameMap>(
+    selector: K,
+  ): NodeListOf<HTMLElementDeprecatedTagNameMap[K]>;
+  function findAll<E extends Element = Element>(
+    selector: string,
+  ): NodeListOf<E>;
+  function findAll(selector: string) {
+    return element.querySelectorAll(selector);
+  }
+
+  return {
+    element,
+    get owner() {
+      return ctx.owner;
+    },
+    find,
+    findAll,
+    click(target: Parameters<typeof click>[0]) {
+      return click(target);
+    },
+    async render(
+      component: (new (...args: unknown[]) => Component) | typeof TOC,
+    ) {
+      let result = renderComponent(component, {
+        into: element,
+        owner: ctx.owner,
+      });
+
+      renders.push(result);
+      await settled();
+    },
+    async [Symbol.dispose]() {
+      renders.forEach((r) => r.destroy());
+      await teardownContext(ctx);
+      element.remove();
+    },
+    async [Symbol.asyncDispose]() {
+      renders.forEach((r) => r.destroy());
+      await settled();
+      await teardownContext(ctx);
+      await settled();
+      element.remove();
+    },
+  };
+}