@sit-onyx/playwright-utils 1.2.0 → 1.2.1-dev-20260313154245

package/dist/emits/index.d.ts

@@ -1,4 +1,4 @@
-import type { Component } from "vue";
+import type { Component, Events } from "vue";
 import type { ComponentEmitProps } from "./types.js";
 export declare const EMIT_SPY_SYMBOL: unique symbol;
 /**
@@ -14,7 +14,7 @@ export declare const EMIT_SPY_SYMBOL: unique symbol;
  * expectEmit(onUpdateOpen, 1, [false]);
  * ```
  */
-export declare const createEmitSpy: <C extends Component, Key extends keyof Emits, Emits = ComponentEmitProps<C>, Handler = NonNullable<Emits[Key]>, Args extends unknown[] = Handler extends (...args: infer _Args) => unknown ? _Args : unknown[]>() => {
+export declare const createEmitSpy: <C extends Component, Key extends keyof Emits | keyof Events | string, Emits = ComponentEmitProps<C>, Handler = Key extends keyof Emits ? NonNullable<Emits[Key]> : Key extends keyof Events ? (arg: Events[Key]) => void : unknown, Args extends unknown[] = Handler extends (...args: infer _Args) => unknown ? _Args : unknown[]>() => {
     (...args: Args): void;
     [EMIT_SPY_SYMBOL]: Args[];
 };
@@ -25,4 +25,4 @@ export declare const createEmitSpy: <C extends Component, Key extends keyof Emit
  */
 export declare const expectEmit: <Handler extends {
     [EMIT_SPY_SYMBOL]: unknown[][];
-}>(emitSpy: Handler, n: number, matches?: unknown[]) => unknown[] | undefined;
+}>(emitSpy: Handler, n: number, matches?: unknown[]) => Promise<unknown[] | undefined>;

package/dist/index.js

@@ -1,18 +1,22 @@
-import { expect as f } from "@playwright/test";
+import { test as B, expect as f } from "@playwright/test";
 import { jsxs as m, jsx as u } from "playwright/jsx-runtime";
-import { expect as v, test as k } from "@playwright/experimental-ct-vue";
-const S = /* @__PURE__ */ Symbol("EMIT_SPY_SYMBOL"), I = () => {
-  const t = [], n = (...r) => {
+import { expect as v, test as L } from "@playwright/experimental-ct-vue";
+const S = /* @__PURE__ */ Symbol("EMIT_SPY_SYMBOL"), Y = () => {
+  const t = [], a = (...r) => {
     t.push(r);
   };
-  return n[S] = t, n;
-}, Y = (t, n, r) => {
-  const e = t[S];
-  f(e).toHaveLength(n);
-  const c = e[n - 1];
-  return r && f(c).toMatchObject(r), c;
-}, d = (t) => t.replace(/\W/g, (n) => n.codePointAt(0)?.toString() || "-"), L = (t) => {
-  const n = () => {
+  return a[S] = t, a;
+}, G = (t, a, r) => B.step(
+  "check emitted events",
+  async () => {
+    const e = t[S];
+    f(e, "Should have emitted at least n times.").toHaveLength(a);
+    const c = e[a - 1];
+    return r && f(c, "Should match expected emit details.").toMatchObject(r), c;
+  },
+  { box: !0 }
+), d = (t) => t.replace(/\W/g, (a) => a.codePointAt(0)?.toString() || "-"), H = (t) => {
+  const a = () => {
     const r = [
       `"blank ${t.columns.map((e) => `column-${d(e)}`).join(" ")}"`
     ];
@@ -45,7 +49,7 @@ const S = /* @__PURE__ */ Symbol("EMIT_SPY_SYMBOL"), I = () => {
           alignItems: "center",
           justifyContent: "center",
           gridTemplateColumns: `auto repeat(${t.columns.length}, 1fr)`,
-          gridTemplateAreas: n()
+          gridTemplateAreas: a()
         },
         children: [
           /* @__PURE__ */ u("div", { style: { gridArea: "blank" } }),
@@ -54,41 +58,41 @@ const S = /* @__PURE__ */ Symbol("EMIT_SPY_SYMBOL"), I = () => {
       }
     )
   ] });
-}, G = (t = {}) => {
-  const n = t.test ?? k;
+}, N = (t = {}) => {
+  const a = t.test ?? L;
   return {
     /**
      * Creates a single matrix screenshot that includes the screenshots for every column-row combination.
      */
     executeMatrixScreenshotTest: async (e) => {
-      n(`${e.name}`, async ({ mount: c, page: i, browserName: $, context: b }) => {
-        n.setTimeout(e.columns.length * e.rows.length * 25e3);
-        const E = async (s, a, l) => {
+      a(`${e.name}`, async ({ mount: c, page: i, browserName: $, context: b }) => {
+        a.setTimeout(e.columns.length * e.rows.length * 25e3);
+        const E = async (s, n, l) => {
           await i.getByRole("document").focus(), await i.getByRole("document").hover({ position: { x: 0, y: 0 }, force: !0 }), await i.mouse.up();
           const o = await c(s);
           await t.defaults?.hooks?.beforeEach?.(
             o,
             i,
-            a,
+            n,
             l,
             e.context
-          ), await e.hooks?.beforeEach?.(o, i, a, l, e.context);
+          ), await e.hooks?.beforeEach?.(o, i, n, l, e.context);
           const x = await o.screenshot({
             animations: "disabled",
             ...t.defaults?.screenshotOptions,
             ...e.screenshotOptions
-          }), h = await o.boundingBox(), B = `${d(l)}-${d(a)}`;
+          }), h = await o.boundingBox(), k = `${d(l)}-${d(n)}`;
           return await t.defaults?.hooks?.afterEach?.(
             o,
             i,
-            a,
+            n,
             l,
             e.context
-          ), await e.hooks?.afterEach?.(o, i, a, l, e.context), { box: h, id: B, screenshot: x };
+          ), await e.hooks?.afterEach?.(o, i, n, l, e.context), { box: h, id: k, screenshot: x };
         }, w = /* @__PURE__ */ new Map();
         for (const s of e.rows)
-          for (const a of e.columns) {
-            const l = e.component(a, s), o = e.removePadding ?? t.defaults?.removePadding, h = await E(/* @__PURE__ */ u(
+          for (const n of e.columns) {
+            const l = e.component(n, s), o = e.removePadding ?? t.defaults?.removePadding, h = await E(/* @__PURE__ */ u(
               "div",
               {
                 style: {
@@ -98,30 +102,30 @@ const S = /* @__PURE__ */ Symbol("EMIT_SPY_SYMBOL"), I = () => {
                 },
                 children: l
               }
-            ), a, s);
+            ), n, s);
             w.set(h.id, h);
           }
         const y = "/_playwright-matrix-screenshot";
-        await b.route(`${y}*`, (s, a) => {
-          const o = new URL(a.url()).searchParams.get("id") ?? "";
+        await b.route(`${y}*`, (s, n) => {
+          const o = new URL(n.url()).searchParams.get("id") ?? "";
           return s.fulfill({
             status: 200,
             contentType: "image/png",
             body: w.get(o)?.screenshot
           });
         });
-        const T = Array.from(w.values()).map(({ box: s, id: a }) => /* @__PURE__ */ u(
+        const T = Array.from(w.values()).map(({ box: s, id: n }) => /* @__PURE__ */ u(
           "img",
           {
             width: s?.width,
             height: s?.height,
-            style: { gridArea: a },
-            src: `${y}?id=${a}`,
-            alt: a
+            style: { gridArea: n },
+            src: `${y}?id=${n}`,
+            alt: n
           }
         )), A = e.rows.map((s) => g({ name: s, type: "row" })), M = e.columns.map(
           (s) => g({ name: s, type: "column" })
-        ), P = L({
+        ), P = H({
           columns: e.columns,
           rows: e.rows,
           name: e.name,
@@ -132,9 +136,9 @@ const S = /* @__PURE__ */ Symbol("EMIT_SPY_SYMBOL"), I = () => {
       });
     }
   };
-}, N = async (t) => {
-  await v(t).toBeVisible(), await t.evaluate((n) => {
-    n.style.height = `${n.scrollHeight}px`, n.style.width = `${n.scrollWidth}px`;
+}, O = async (t) => {
+  await v(t).toBeVisible(), await t.evaluate((a) => {
+    a.style.height = `${a.scrollHeight}px`, a.style.width = `${a.scrollWidth}px`;
   });
 }, g = (t) => /* @__PURE__ */ u(
   "div",
@@ -142,17 +146,17 @@ const S = /* @__PURE__ */ Symbol("EMIT_SPY_SYMBOL"), I = () => {
     style: { textAlign: "center", gridArea: `${t.type}-${d(t.name)}` },
     children: t.name
   }
-), O = async ({ component: t, page: n, state: r }) => {
-  if (r === "hover" && await t.hover(), r === "focus-visible" && await n.keyboard.press("Tab"), r === "active") {
+), p = async ({ component: t, page: a, state: r }) => {
+  if (r === "hover" && await t.hover(), r === "focus-visible" && await a.keyboard.press("Tab"), r === "active") {
     const e = await t.boundingBox(), c = { x: e.x + e.width / 2, y: e.y + e.height / 2 };
-    await n.mouse.move(c.x, c.y), await n.mouse.down();
+    await a.mouse.move(c.x, c.y), await a.mouse.down();
   }
 };
 export {
   S as EMIT_SPY_SYMBOL,
-  N as adjustSizeToAbsolutePosition,
-  I as createEmitSpy,
-  Y as expectEmit,
-  O as useFocusStateHooks,
-  G as useMatrixScreenshotTest
+  O as adjustSizeToAbsolutePosition,
+  Y as createEmitSpy,
+  G as expectEmit,
+  p as useFocusStateHooks,
+  N as useMatrixScreenshotTest
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sit-onyx/playwright-utils",
   "description": "Utilities for Vue component testing with Playwright",
-  "version": "1.2.0",
+  "version": "1.2.1-dev-20260313154245",
   "type": "module",
   "author": "Schwarz IT KG",
   "license": "Apache-2.0",