@ghentcdh/ui 2.0.0 → 3.0.0

package/testing.mjs

@@ -1,420 +1,339 @@
-class r {
-  constructor(t) {
-    this.locator = t;
-  }
-  /** Access the Page this harness was scoped against. */
-  page() {
-    return this.locator.page();
-  }
-  /** Get the underlying Locator — useful for assertions or further scoping. */
-  asLocator() {
-    return this.locator;
-  }
-}
-const e = (x, t, a) => x.getByRole(t, { name: a });
-class i extends r {
-  static byId(t, a) {
-    return new i(e(t, "textbox", a));
-  }
-  /** Resolve by visible label (the `<legend>` text). */
-  static byLabel(t, a) {
-    return new i(e(t, "textbox", a));
-  }
-  static for(t) {
-    return new i(t);
-  }
-  async fill(t) {
-    return await this.locator.click(), await this.locator.fill(t), this;
-  }
-  /** Type character-by-character — useful when the control reacts to each keystroke. */
-  async type(t) {
-    return await this.locator.click(), await this.locator.pressSequentially(t), this;
-  }
-  async clear() {
-    return await this.locator.fill(""), this;
-  }
-  async value() {
-    return this.locator.inputValue();
-  }
-  async blur() {
-    return await this.locator.press("Tab"), this;
-  }
-}
-class o extends r {
-  static byId(t, a) {
-    return new o(e(t, "spinbutton", a));
-  }
-  static byLabel(t, a) {
-    return new o(e(t, "spinbutton", a));
-  }
-  static for(t) {
-    return new o(t);
-  }
-  async fill(t) {
-    return await this.locator.click(), await this.locator.fill(String(t)), await this.locator.press("Tab"), this;
-  }
-  async clear() {
-    return await this.locator.fill(""), this;
-  }
-  async value() {
-    const t = await this.locator.inputValue();
-    return t === "" ? null : Number(t);
-  }
-}
-class c extends r {
-  static byId(t, a) {
-    return new c(e(t, "textbox", a));
-  }
-  static byLabel(t, a) {
-    return new c(e(t, "textbox", a));
-  }
-  static for(t) {
-    return new c(t);
-  }
-  async fill(t) {
-    return await this.locator.click(), await this.locator.fill(t), this;
-  }
-  async clear() {
-    return await this.locator.fill(""), this;
-  }
-  async value() {
-    return this.locator.inputValue();
-  }
-}
-class s extends r {
-  static byId(t, a) {
-    return new s(e(t, "checkbox", a));
-  }
-  static byLabel(t, a) {
-    return new s(e(t, "checkbox", a));
-  }
-  static for(t) {
-    return new s(t);
-  }
-  async fill(t) {
-    return t ? await this.locator.check() : await this.locator.uncheck(), this;
-  }
-  async toggle() {
-    return await this.locator.click(), this;
-  }
-  async value() {
-    return this.locator.isChecked();
-  }
-}
-class l extends r {
-  static byId(t, a) {
-    return new l(e(t, "combobox", a));
-  }
-  static byLabel(t, a) {
-    return new l(e(t, "combobox", a));
-  }
-  static for(t) {
-    return new l(t);
-  }
-  async open() {
-    return await this.locator.click(), this;
-  }
-  async fill(t) {
-    return this.select(t);
-  }
-  async select(t) {
-    return await this.open(), await this.page().getByRole("option", { name: t }).locator("a").click(), this;
-  }
-  async value() {
-    return (await this.locator.textContent())?.trim() ?? "";
-  }
-  /** Click the "Clear" button rendered next to the select. */
-  async clear() {
-    return await this.locator.locator(
-      'xpath=ancestor::*[@role="select"][1]'
-    ).getByRole("button", { name: "Clear" }).click(), this;
-  }
-  /**
-   * Click the "Create new" button. Requires `enableCreate` to be set on
-   * the component (SelectWrapper conditionally renders the button).
-   */
-  async clickCreateNew() {
-    await this.locator.locator(
-      'xpath=ancestor::*[@role="select"][1]'
-    ).getByRole("button", { name: "create" }).click();
-  }
-}
-class n extends r {
-  static byId(t, a) {
-    return new n(e(t, "combobox", a));
-  }
-  static byLabel(t, a) {
-    return new n(e(t, "combobox", a));
-  }
-  static for(t) {
-    return new n(t);
-  }
-  /** Type a query, wait for the matching option, click it. */
-  async fill(t) {
-    return await this.locator.click(), await this.locator.fill(t), await this.page().getByRole("option", { name: t }).locator("a").click(), this;
-  }
-  /** Just type a query without selecting — useful for asserting dropdown state. */
-  async query(t) {
-    return await this.locator.click(), await this.locator.fill(t), this;
-  }
-  /** Pick a specific option by visible label, after `query()` has filtered. */
-  async pickOption(t) {
-    return await this.page().getByRole("option", { name: t }).locator("a").click(), this;
-  }
-  /** Press a key — useful for arrow-down / Enter / Esc keyboard nav tests. */
-  async press(t) {
-    return await this.locator.press(t), this;
-  }
-  /** Click the "Create new" button (requires `enableCreate`). */
-  async clickCreateNew() {
-    await this.locator.locator(
-      'xpath=ancestor::*[@role="select"][1]'
-    ).getByRole("button", { name: "create" }).click();
-  }
-  async clear() {
-    return await this.locator.locator(
-      'xpath=ancestor::*[@role="select"][1]'
-    ).getByRole("button", { name: "Clear" }).click(), this;
-  }
-  async value() {
-    return this.locator.inputValue();
-  }
-  /** The listbox is portaled — locate it relative to the Page. */
-  listbox() {
-    return this.page().getByRole("listbox");
-  }
-  options() {
-    return this.page().getByRole("option");
-  }
-}
-class u extends r {
-  static byId(t, a) {
-    return new u(e(t, "combobox", a));
-  }
-  static byLabel(t, a) {
-    return new u(e(t, "combobox", a));
-  }
-  static for(t) {
-    return new u(t);
-  }
-  async open() {
-    return await this.locator.click(), this;
-  }
-  async fill(t) {
-    await this.open();
-    for (const a of t)
-      await this.page().getByRole("option", { name: a }).locator("a").click();
-    return await this.locator.click(), this;
-  }
-  async select(t) {
-    return await this.open(), await this.page().getByRole("option", { name: t }).locator("a").click(), this;
-  }
-  /** Remove a selected chip by its label. */
-  async removeChip(t) {
-    return await this.locator.locator(
-      'xpath=ancestor::*[@role="select"][1]'
-    ).getByText(t, { exact: !0 }).getByRole("button").click(), this;
-  }
-}
-class h extends r {
-  static byId(t, a) {
-    return new h(e(t, "textbox", a));
-  }
-  static byLabel(t, a) {
-    return new h(e(t, "textbox", a));
-  }
-  static for(t) {
-    return new h(t);
-  }
-  /** The editable inner surface — TipTap renders a nested `role="textbox"`. */
-  get editor() {
-    return this.locator.getByRole("textbox");
-  }
-  async fill(t) {
-    return await this.editor.fill(t), this;
-  }
-  async clear() {
-    return await this.editor.fill(""), this;
-  }
-  async typeBold(t) {
-    return await this.toolbar("B").click(), await this.editor.pressSequentially(t), await this.toolbar("B").click(), this;
-  }
-  async typeItalic(t) {
-    return await this.toolbar("I").click(), await this.editor.pressSequentially(t), await this.toolbar("I").click(), this;
-  }
-  async type(t) {
-    return await this.editor.pressSequentially(t), this;
-  }
-  toolbar(t) {
-    return this.locator.getByRole("button", { name: t });
-  }
-  /** Is a toolbar mark currently active (the lib adds `btn-active`)? */
-  async isMarkActive(t) {
-    return (await this.toolbar(t).getAttribute("class") ?? "").includes("btn-active");
-  }
-}
-class y extends r {
-  /**
-   * Resolve by the dialog's accessible name (the `modalTitle` shown in the
-   * `<h3>`). Note: matches are case-insensitive substring.
-   */
-  static byTitle(t, a) {
-    return new y(
-      t.getByRole("dialog", { name: a })
-    );
-  }
-  /** Resolve the only-open dialog. Useful when there's just one at a time. */
-  static current(t) {
-    return new y(t.getByRole("dialog"));
-  }
-  static for(t) {
-    return new y(t);
-  }
-  // ── interactions ──────────────────────────────────────────────────────
-  async clickClose() {
-    return await this.locator.getByRole("button", { name: "Close" }).click(), this;
-  }
-  /** Press Esc on the dialog (handled by the native `<dialog>` element). */
-  async pressEscape() {
-    return await this.locator.press("Escape"), this;
-  }
-  /** Click outside the modal box to attempt a backdrop close. */
-  async clickBackdrop() {
-    return await this.locator.click({ position: { x: 5, y: 5 } }), this;
-  }
-  /** Click an action button in the modal's `#actions` slot by accessible name. */
-  async clickAction(t) {
-    return await this.locator.getByRole("button", { name: t }).click(), this;
-  }
-  // ── inspection ────────────────────────────────────────────────────────
-  /** The `<h3>` title element. */
-  title() {
-    return this.locator.locator("h3").first();
-  }
-  /** The content slot wrapper. */
-  content() {
-    return this.locator.locator('[id$="_content"]').first();
-  }
-  /** Whether the dialog is currently visible (for `expect().toBeVisible()`). */
-  asLocator() {
-    return this.locator;
-  }
-}
-class b extends r {
-  /** Resolve by accessible name (button text / aria-label). */
-  static byName(t, a) {
-    return new b(e(t, "button", a));
-  }
-  static for(t) {
-    return new b(t);
-  }
-  async click() {
-    return await this.locator.click(), this;
-  }
-  async isDisabled() {
-    return this.locator.isDisabled();
-  }
-  async text() {
-    return await this.locator.textContent() ?? "";
-  }
-}
-class p extends r {
-  /** Resolve by the collapse title text. */
-  static byTitle(t, a) {
-    const f = t.getByLabel(`Toggle ${a}`);
-    return new p(f.locator(".."));
-  }
-  static for(t) {
-    return new p(t);
-  }
-  /** Toggle open/close by clicking the hidden checkbox. */
-  async toggle() {
-    return await this.checkbox().click(), this;
-  }
-  /** Whether the collapse is currently open (checkbox checked). */
-  async isOpen() {
-    return this.checkbox().isChecked();
-  }
-  /** The title text element. */
-  title() {
-    return this.locator.locator(".collapse-title span").first();
-  }
-  /** The content wrapper. */
-  content() {
-    return this.locator.locator(".collapse-content");
-  }
-  checkbox() {
-    return this.locator.locator('input[type="checkbox"]');
-  }
-}
-class w extends r {
-  /** Resolve the alert by its message text. */
-  static byMessage(t, a) {
-    return new w(
-      t.getByRole("alert").filter({ hasText: a })
-    );
-  }
-  /** Resolve the first (or only) alert on the page. */
-  static first(t) {
-    return new w(t.getByRole("alert").first());
-  }
-  static for(t) {
-    return new w(t);
-  }
-  async message() {
-    return await this.locator.locator("span").textContent() ?? "";
-  }
-  async hasClass(t) {
-    return (await this.locator.getAttribute("class") ?? "").includes(t);
-  }
-}
-class g extends r {
-  /** Resolve the drawer as the `<main>` containing the panels. */
-  static root(t) {
-    return new g(t.locator("main").first());
-  }
-  static for(t) {
-    return new g(t);
-  }
-  async toggleLeft() {
-    return await this.leftButton().click(), this;
-  }
-  async toggleRight() {
-    return await this.rightButton().click(), this;
-  }
-  async isLeftOpen() {
-    return await this.leftButton().getAttribute("aria-expanded") === "true";
-  }
-  async isRightOpen() {
-    return await this.rightButton().getAttribute("aria-expanded") === "true";
-  }
-  leftPanel() {
-    return this.locator.locator("#drawer-left-panel");
-  }
-  rightPanel() {
-    return this.locator.locator("#drawer-right-panel");
-  }
-  leftButton() {
-    return this.locator.locator('button[aria-controls="drawer-left-panel"]');
-  }
-  rightButton() {
-    return this.locator.locator('button[aria-controls="drawer-right-panel"]');
-  }
-}
-export {
-  w as AlertHarness,
-  n as AutocompleteHarness,
-  s as BooleanHarness,
-  b as ButtonHarness,
-  p as CollapseHarness,
-  g as DrawerHarness,
-  r as Harness,
-  h as MarkdownHarness,
-  y as ModalHarness,
-  u as MultiSelectHarness,
-  o as NumberHarness,
-  l as SelectHarness,
-  c as TextAreaHarness,
-  i as TextHarness,
-  e as byRole
+//#region src/testing/Harness.ts
+var e = class {
+	constructor(e) {
+		this.locator = e;
+	}
+	page() {
+		return this.locator.page();
+	}
+	asLocator() {
+		return this.locator;
+	}
+}, t = (e, t, n) => e.getByRole(t, { name: n }), n = class n extends e {
+	static byId(e, r) {
+		return new n(t(e, "textbox", r));
+	}
+	static byLabel(e, r) {
+		return new n(t(e, "textbox", r));
+	}
+	static for(e) {
+		return new n(e);
+	}
+	async fill(e) {
+		return await this.locator.click(), await this.locator.fill(e), this;
+	}
+	async type(e) {
+		return await this.locator.click(), await this.locator.pressSequentially(e), this;
+	}
+	async clear() {
+		return await this.locator.fill(""), this;
+	}
+	async value() {
+		return this.locator.inputValue();
+	}
+	async blur() {
+		return await this.locator.press("Tab"), this;
+	}
+}, r = class n extends e {
+	static byId(e, r) {
+		return new n(t(e, "spinbutton", r));
+	}
+	static byLabel(e, r) {
+		return new n(t(e, "spinbutton", r));
+	}
+	static for(e) {
+		return new n(e);
+	}
+	async fill(e) {
+		return await this.locator.click(), await this.locator.fill(String(e)), await this.locator.press("Tab"), this;
+	}
+	async clear() {
+		return await this.locator.fill(""), this;
+	}
+	async value() {
+		let e = await this.locator.inputValue();
+		return e === "" ? null : Number(e);
+	}
+}, i = class n extends e {
+	static byId(e, r) {
+		return new n(t(e, "textbox", r));
+	}
+	static byLabel(e, r) {
+		return new n(t(e, "textbox", r));
+	}
+	static for(e) {
+		return new n(e);
+	}
+	async fill(e) {
+		return await this.locator.click(), await this.locator.fill(e), this;
+	}
+	async clear() {
+		return await this.locator.fill(""), this;
+	}
+	async value() {
+		return this.locator.inputValue();
+	}
+}, a = class n extends e {
+	static byId(e, r) {
+		return new n(t(e, "checkbox", r));
+	}
+	static byLabel(e, r) {
+		return new n(t(e, "checkbox", r));
+	}
+	static for(e) {
+		return new n(e);
+	}
+	async fill(e) {
+		return e ? await this.locator.check() : await this.locator.uncheck(), this;
+	}
+	async toggle() {
+		return await this.locator.click(), this;
+	}
+	async value() {
+		return this.locator.isChecked();
+	}
+}, o = class n extends e {
+	static byId(e, r) {
+		return new n(t(e, "combobox", r));
+	}
+	static byLabel(e, r) {
+		return new n(t(e, "combobox", r));
+	}
+	static for(e) {
+		return new n(e);
+	}
+	async open() {
+		return await this.locator.click(), this;
+	}
+	async fill(e) {
+		return this.select(e);
+	}
+	async select(e) {
+		return await this.open(), await this.page().getByRole("option", { name: e }).locator("a").click(), this;
+	}
+	async value() {
+		return (await this.locator.textContent())?.trim() ?? "";
+	}
+	async clear() {
+		return await this.locator.locator("xpath=ancestor::*[@role=\"select\"][1]").getByRole("button", { name: "Clear" }).click(), this;
+	}
+	async clickCreateNew() {
+		await this.locator.locator("xpath=ancestor::*[@role=\"select\"][1]").getByRole("button", { name: "create" }).click();
+	}
+}, s = class n extends e {
+	static byId(e, r) {
+		return new n(t(e, "combobox", r));
+	}
+	static byLabel(e, r) {
+		return new n(t(e, "combobox", r));
+	}
+	static for(e) {
+		return new n(e);
+	}
+	async fill(e) {
+		return await this.locator.click(), await this.locator.fill(e), await this.page().getByRole("option", { name: e }).locator("a").click(), this;
+	}
+	async query(e) {
+		return await this.locator.click(), await this.locator.fill(e), this;
+	}
+	async pickOption(e) {
+		return await this.page().getByRole("option", { name: e }).locator("a").click(), this;
+	}
+	async press(e) {
+		return await this.locator.press(e), this;
+	}
+	async clickCreateNew() {
+		await this.locator.locator("xpath=ancestor::*[@role=\"select\"][1]").getByRole("button", { name: "create" }).click();
+	}
+	async clear() {
+		return await this.locator.locator("xpath=ancestor::*[@role=\"select\"][1]").getByRole("button", { name: "Clear" }).click(), this;
+	}
+	async value() {
+		return this.locator.inputValue();
+	}
+	listbox() {
+		return this.page().getByRole("listbox");
+	}
+	options() {
+		return this.page().getByRole("option");
+	}
+}, c = class n extends e {
+	static byId(e, r) {
+		return new n(t(e, "combobox", r));
+	}
+	static byLabel(e, r) {
+		return new n(t(e, "combobox", r));
+	}
+	static for(e) {
+		return new n(e);
+	}
+	async open() {
+		return await this.locator.click(), this;
+	}
+	async fill(e) {
+		await this.open();
+		for (let t of e) await this.page().getByRole("option", { name: t }).locator("a").click();
+		return await this.locator.click(), this;
+	}
+	async select(e) {
+		return await this.open(), await this.page().getByRole("option", { name: e }).locator("a").click(), this;
+	}
+	async removeChip(e) {
+		return await this.locator.locator("xpath=ancestor::*[@role=\"select\"][1]").getByText(e, { exact: !0 }).getByRole("button").click(), this;
+	}
+}, l = class n extends e {
+	static byId(e, r) {
+		return new n(t(e, "textbox", r));
+	}
+	static byLabel(e, r) {
+		return new n(t(e, "textbox", r));
+	}
+	static for(e) {
+		return new n(e);
+	}
+	get editor() {
+		return this.locator.getByRole("textbox");
+	}
+	async fill(e) {
+		return await this.editor.fill(e), this;
+	}
+	async clear() {
+		return await this.editor.fill(""), this;
+	}
+	async typeBold(e) {
+		return await this.toolbar("B").click(), await this.editor.pressSequentially(e), await this.toolbar("B").click(), this;
+	}
+	async typeItalic(e) {
+		return await this.toolbar("I").click(), await this.editor.pressSequentially(e), await this.toolbar("I").click(), this;
+	}
+	async type(e) {
+		return await this.editor.pressSequentially(e), this;
+	}
+	toolbar(e) {
+		return this.locator.getByRole("button", { name: e });
+	}
+	async isMarkActive(e) {
+		return (await this.toolbar(e).getAttribute("class") ?? "").includes("btn-active");
+	}
+}, u = class t extends e {
+	static byTitle(e, n) {
+		return new t(e.getByRole("dialog", { name: n }));
+	}
+	static current(e) {
+		return new t(e.getByRole("dialog"));
+	}
+	static for(e) {
+		return new t(e);
+	}
+	async clickClose() {
+		return await this.locator.getByRole("button", { name: "Close" }).click(), this;
+	}
+	async pressEscape() {
+		return await this.locator.press("Escape"), this;
+	}
+	async clickBackdrop() {
+		return await this.locator.click({ position: {
+			x: 5,
+			y: 5
+		} }), this;
+	}
+	async clickAction(e) {
+		return await this.locator.getByRole("button", { name: e }).click(), this;
+	}
+	title() {
+		return this.locator.locator("h3").first();
+	}
+	content() {
+		return this.locator.locator("[id$=\"_content\"]").first();
+	}
+	asLocator() {
+		return this.locator;
+	}
+}, d = class n extends e {
+	static byName(e, r) {
+		return new n(t(e, "button", r));
+	}
+	static for(e) {
+		return new n(e);
+	}
+	async click() {
+		return await this.locator.click(), this;
+	}
+	async isDisabled() {
+		return this.locator.isDisabled();
+	}
+	async text() {
+		return await this.locator.textContent() ?? "";
+	}
+}, f = class t extends e {
+	static byTitle(e, n) {
+		return new t(e.getByLabel(`Toggle ${n}`).locator(".."));
+	}
+	static for(e) {
+		return new t(e);
+	}
+	async toggle() {
+		return await this.checkbox().click(), this;
+	}
+	async isOpen() {
+		return this.checkbox().isChecked();
+	}
+	title() {
+		return this.locator.locator(".collapse-title span").first();
+	}
+	content() {
+		return this.locator.locator(".collapse-content");
+	}
+	checkbox() {
+		return this.locator.locator("input[type=\"checkbox\"]");
+	}
+}, p = class t extends e {
+	static byMessage(e, n) {
+		return new t(e.getByRole("alert").filter({ hasText: n }));
+	}
+	static first(e) {
+		return new t(e.getByRole("alert").first());
+	}
+	static for(e) {
+		return new t(e);
+	}
+	async message() {
+		return await this.locator.locator("span").textContent() ?? "";
+	}
+	async hasClass(e) {
+		return (await this.locator.getAttribute("class") ?? "").includes(e);
+	}
+}, m = class t extends e {
+	static root(e) {
+		return new t(e.locator("main").first());
+	}
+	static for(e) {
+		return new t(e);
+	}
+	async toggleLeft() {
+		return await this.leftButton().click(), this;
+	}
+	async toggleRight() {
+		return await this.rightButton().click(), this;
+	}
+	async isLeftOpen() {
+		return await this.leftButton().getAttribute("aria-expanded") === "true";
+	}
+	async isRightOpen() {
+		return await this.rightButton().getAttribute("aria-expanded") === "true";
+	}
+	leftPanel() {
+		return this.locator.locator("#drawer-left-panel");
+	}
+	rightPanel() {
+		return this.locator.locator("#drawer-right-panel");
+	}
+	leftButton() {
+		return this.locator.locator("button[aria-controls=\"drawer-left-panel\"]");
+	}
+	rightButton() {
+		return this.locator.locator("button[aria-controls=\"drawer-right-panel\"]");
+	}
 };
+//#endregion
+export { p as AlertHarness, s as AutocompleteHarness, a as BooleanHarness, d as ButtonHarness, f as CollapseHarness, m as DrawerHarness, e as Harness, l as MarkdownHarness, u as ModalHarness, c as MultiSelectHarness, r as NumberHarness, o as SelectHarness, i as TextAreaHarness, n as TextHarness, t as byRole };