@harnessed-ts/cypress 0.0.0-stage → 0.7.0

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAC/C,YAAY,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAC7C,YAAY,EACV,YAAY,EACZ,qBAAqB,EACrB,aAAa,EACb,aAAa,EACb,OAAO,GACR,MAAM,YAAY,CAAA"}

package/dist/index.js

@@ -0,0 +1,3 @@
+export { CYPRESS_DRIVER, CypressQuery, cypress, registerCommands } from './chunk-CGA7IP66.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/navigation.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=navigation.d.ts.map

package/dist/navigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation.d.ts","sourceRoot":"","sources":["../src/navigation.ts"],"names":[],"mappings":""}

package/dist/real-events.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Trusted input through the Chrome DevTools Protocol, for `realEvents: true`.
+ *
+ * Cypress's own `trigger` and the cypress-real-events commands are `cy`
+ * commands, and a harness runs inside a promise where nothing can be enqueued.
+ * `Cypress.automation('remote:debugger:protocol')` is the one way to reach CDP
+ * that is itself a promise. The browser then produces the events — `isTrusted`,
+ * default actions and all — rather than a script imitating them.
+ */
+/** Refuses early and by name, instead of failing inside the automation channel. */
+export declare function requireChromium(): void;
+export declare function realHover(element: Element): Promise<void>;
+export declare function realClick(element: Element): Promise<void>;
+/** One key, down then up, into whatever has focus. */
+export declare function realPress(key: string): Promise<void>;
+/** Text into whatever has focus, the way an IME commits it — Playwright's `fill`. */
+export declare function realInsertText(text: string): Promise<void>;
+//# sourceMappingURL=real-events.d.ts.map

package/dist/real-events.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"real-events.d.ts","sourceRoot":"","sources":["../src/real-events.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AA+CH,mFAAmF;AACnF,wBAAgB,eAAe,IAAI,IAAI,CAQtC;AA4CD,wBAAsB,SAAS,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,CAG/D;AAED,wBAAsB,SAAS,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,CAM/D;AAED,sDAAsD;AACtD,wBAAsB,SAAS,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAW1D;AAED,qFAAqF;AACrF,wBAAsB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAEhE"}

package/dist/support.cjs

@@ -0,0 +1,537 @@
+'use strict';
+
+var core = require('@harnessed-ts/core');
+var resolve = require('@harnessed-ts/resolve');
+var dom = require('@testing-library/dom');
+var userEvent = require('@testing-library/user-event');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var userEvent__default = /*#__PURE__*/_interopDefault(userEvent);
+
+// src/commands.ts
+
+// src/driver-id.ts
+var CYPRESS_DRIVER = "cypress";
+
+// src/real-events.ts
+var NAMED_KEYS = {
+  Enter: { code: "Enter", keyCode: 13, text: "\r" },
+  Tab: { code: "Tab", keyCode: 9 },
+  Backspace: { code: "Backspace", keyCode: 8 },
+  Delete: { code: "Delete", keyCode: 46 },
+  Escape: { code: "Escape", keyCode: 27 },
+  Space: { code: "Space", keyCode: 32, text: " " },
+  ArrowUp: { code: "ArrowUp", keyCode: 38 },
+  ArrowDown: { code: "ArrowDown", keyCode: 40 },
+  ArrowLeft: { code: "ArrowLeft", keyCode: 37 },
+  ArrowRight: { code: "ArrowRight", keyCode: 39 },
+  Home: { code: "Home", keyCode: 36 },
+  End: { code: "End", keyCode: 35 },
+  PageUp: { code: "PageUp", keyCode: 33 },
+  PageDown: { code: "PageDown", keyCode: 34 },
+  Insert: { code: "Insert", keyCode: 45 }
+};
+function keyDefinition(key) {
+  const named = NAMED_KEYS[key];
+  if (named !== void 0) return { key: key === "Space" ? " " : key, ...named };
+  if ([...key].length === 1) {
+    const upper = key.toUpperCase();
+    const code = /[A-Z]/.test(upper) ? `Key${upper}` : /[0-9]/.test(key) ? `Digit${key}` : "";
+    const keyCode = /[A-Z0-9]/.test(upper) ? upper.charCodeAt(0) : 0;
+    return { key, code, keyCode, text: key };
+  }
+  throw new Error(
+    `harnessed: realEvents cannot press "${key}". It presses single characters and ${Object.keys(NAMED_KEYS).join(", ")}; drop realEvents to press it through user-event.`
+  );
+}
+function send(command, params) {
+  return Promise.resolve(Cypress.automation("remote:debugger:protocol", { command, params }));
+}
+function requireChromium() {
+  if (!Cypress.isBrowser({ family: "chromium" })) {
+    throw new Error(
+      `harnessed: realEvents drives Chrome DevTools Protocol input, which only Chromium-family browsers (Chrome, Edge, Electron) have; this run is in ${Cypress.browser.name}. Leave realEvents off to use user-event there.`
+    );
+  }
+}
+function framesDownTo(target, within) {
+  for (const frame of within.querySelectorAll("iframe")) {
+    if (frame.contentWindow === target) return [frame];
+    const inner = frame.contentDocument;
+    const path = inner === null ? null : framesDownTo(target, inner);
+    if (path !== null) return [frame, ...path];
+  }
+  return null;
+}
+function centreOf(element) {
+  element.scrollIntoView({ block: "center", inline: "center" });
+  const box = element.getBoundingClientRect();
+  let x = box.left + box.width / 2;
+  let y = box.top + box.height / 2;
+  const view = element.ownerDocument.defaultView;
+  const top = window.top ?? window;
+  const frames = view === null || view === top ? [] : framesDownTo(view, top.document) ?? [];
+  for (const frame of frames.reverse()) {
+    const frameBox = frame.getBoundingClientRect();
+    const scale = frame.offsetWidth > 0 ? frameBox.width / frame.offsetWidth : 1;
+    const style = frame.ownerDocument.defaultView?.getComputedStyle(frame);
+    const insetX = frame.clientLeft + parseFloat(style?.paddingLeft ?? "0");
+    const insetY = frame.clientTop + parseFloat(style?.paddingTop ?? "0");
+    x = frameBox.left + (insetX + x) * scale;
+    y = frameBox.top + (insetY + y) * scale;
+  }
+  return { x, y };
+}
+async function realHover(element) {
+  const { x, y } = centreOf(element);
+  await send("Input.dispatchMouseEvent", { type: "mouseMoved", x, y });
+}
+async function realClick(element) {
+  const { x, y } = centreOf(element);
+  await send("Input.dispatchMouseEvent", { type: "mouseMoved", x, y });
+  const press = { x, y, button: "left", clickCount: 1 };
+  await send("Input.dispatchMouseEvent", { type: "mousePressed", buttons: 1, ...press });
+  await send("Input.dispatchMouseEvent", { type: "mouseReleased", buttons: 0, ...press });
+}
+async function realPress(key) {
+  const { text, keyCode, ...definition } = keyDefinition(key);
+  const common = { ...definition, windowsVirtualKeyCode: keyCode, nativeVirtualKeyCode: keyCode };
+  await send(
+    "Input.dispatchKeyEvent",
+    text === void 0 ? { type: "rawKeyDown", ...common } : { type: "keyDown", text, unmodifiedText: text, ...common }
+  );
+  await send("Input.dispatchKeyEvent", { type: "keyUp", ...common });
+}
+async function realInsertText(text) {
+  await send("Input.insertText", { text });
+}
+
+// src/cypress-query.ts
+function toKeyboardInput(key) {
+  return key.length === 1 ? key : `{${key}}`;
+}
+var users = /* @__PURE__ */ new WeakMap();
+function userFor(env) {
+  const { document } = env;
+  const bound = users.get(env);
+  if (bound !== void 0 && bound.document === document) return bound.user;
+  const user = userEvent__default.default.setup({ document });
+  users.set(env, { document, user });
+  return user;
+}
+async function waitUntil(condition, container, timeout) {
+  let refused;
+  await dom.waitFor(
+    async () => {
+      try {
+        await condition();
+      } catch (error) {
+        if (!(error instanceof resolve.FrameEntryError || error instanceof core.StrictModeViolation)) {
+          throw error;
+        }
+        refused = error;
+      }
+    },
+    // The default container is the spec frame's document, which never changes;
+    // watching the AUT's is what lets a mutation end the wait early.
+    { container, timeout }
+  );
+  if (refused !== void 0) throw refused;
+}
+var CypressQuery = class _CypressQuery extends core.Query {
+  constructor(env, scope, selector) {
+    super(scope, selector);
+    this.env = env;
+  }
+  env;
+  clone(selector) {
+    return new _CypressQuery(this.env, this.scope, selector);
+  }
+  /** Read per query: navigation replaces the document, and with it the body. */
+  get container() {
+    const { document } = this.env;
+    return document.body ?? document.documentElement;
+  }
+  element(options) {
+    return resolve.resolveOne(this.container, this.scope, this.selector, options?.timeout);
+  }
+  /** Keeps the command log telling the story: one entry per harness action. */
+  log(action, detail) {
+    if (!this.env.log) return;
+    const target = core.describeScope(this.scope, this.selector);
+    Cypress.log({
+      name: "harness",
+      message: `**${action}** ${target}${detail === void 0 ? "" : ` ${detail}`}`,
+      consoleProps: () => ({ action, target, detail })
+    });
+  }
+  get user() {
+    return userFor(this.env);
+  }
+  get real() {
+    if (this.env.realEvents) requireChromium();
+    return this.env.realEvents;
+  }
+  /**
+   * Trusted input returns as soon as the browser has dispatched it, so a read
+   * straight after could beat a framework that renders on a timer of its own
+   * (zoneless Angular schedules after the event). A zero-delay timer in the AUT
+   * window runs after any it queued, as user-event's own pause does in the
+   * other mode.
+   */
+  async afterReal(action) {
+    await action;
+    await new Promise((resolve) => this.env.window.setTimeout(resolve, 0));
+  }
+  /**
+   * Every match, resolved in one pass — see `DomQuery.all` for why. Each result is
+   * bound to its node and falls back to index resolution once that node leaves
+   * the document.
+   */
+  async all() {
+    return (await resolve.resolveAll(this.container, this.scope, this.selector)).map(
+      (element, index) => new BoundCypressQuery(this.env, this.scope, core.nth(this.selector, index), element)
+    );
+  }
+  // --- interactions -------------------------------------------------------
+  async click(options) {
+    this.log("click");
+    const element = await this.element(options);
+    await (this.real ? this.afterReal(realClick(element)) : this.user.click(element));
+  }
+  async fill(value, options) {
+    this.log("fill", JSON.stringify(value));
+    const element = await this.element(options);
+    if (this.real) {
+      await this.afterReal(realReplace(element, value));
+      return;
+    }
+    await this.user.clear(element);
+    if (value !== "") await this.user.type(element, value);
+  }
+  async clear(options) {
+    this.log("clear");
+    const element = await this.element(options);
+    await (this.real ? this.afterReal(realReplace(element, "")) : this.user.clear(element));
+  }
+  async check(options) {
+    this.log("check");
+    const element = await this.element(options);
+    if (element.checked) return;
+    await (this.real ? this.afterReal(realClick(element)) : this.user.click(element));
+  }
+  async uncheck(options) {
+    this.log("uncheck");
+    const element = await this.element(options);
+    if (!element.checked) return;
+    await (this.real ? this.afterReal(realClick(element)) : this.user.click(element));
+  }
+  /**
+   * Through user-event in both modes: a native `<select>` opens a popup the
+   * browser draws outside the page, which CDP pointer input cannot operate.
+   */
+  async selectOption(value, options) {
+    this.log("selectOption", JSON.stringify(value));
+    const element = await this.element(options);
+    if (element.multiple) {
+      const selected = [...element.selectedOptions].map((option) => option.value);
+      if (selected.length > 0) await this.user.deselectOptions(element, selected);
+    }
+    await this.user.selectOptions(element, value);
+  }
+  async hover(options) {
+    this.log("hover");
+    const element = await this.element(options);
+    await (this.real ? this.afterReal(realHover(element)) : this.user.hover(element));
+  }
+  async focus(options) {
+    this.log("focus");
+    (await this.element(options)).focus();
+  }
+  async blur(options) {
+    this.log("blur");
+    (await this.element(options)).blur();
+  }
+  async press(key, options) {
+    this.log("press", key);
+    const element = await this.element(options);
+    element.focus();
+    await (this.real ? this.afterReal(realPress(key)) : this.user.keyboard(toKeyboardInput(key)));
+  }
+  // --- observations -------------------------------------------------------
+  /**
+   * Through user-event, real events or not: the Chrome DevTools Protocol sets
+   * files only from paths on disk, and a File here has none.
+   */
+  async upload(files, options) {
+    const list = Array.isArray(files) ? files : [files];
+    this.log("upload", list.map((file) => file.name).join(", "));
+    const input = resolve.fileInputOf(await this.element(options));
+    core.checkFileTarget(input, list.length, this.scope, this.selector);
+    await this.user.upload(input, list);
+  }
+  async boundingBox(options) {
+    this.log("boundingBox");
+    return resolve.boundingBoxOf(await this.element(options), this.env.document);
+  }
+  async text(options) {
+    this.log("text");
+    return ((await this.element(options)).textContent ?? "").trim();
+  }
+  async inputValue(options) {
+    this.log("inputValue");
+    const element = await this.element(options);
+    return element.value ?? "";
+  }
+  async attribute(name, options) {
+    this.log("attribute", name);
+    return (await this.element(options)).getAttribute(name);
+  }
+  async isVisible(options) {
+    this.log("isVisible");
+    return this.visible(options);
+  }
+  /**
+   * A real browser lays the page out, so visibility is a layout question — a
+   * box, and not `visibility: hidden` — answered the way Playwright answers it,
+   * rather than the dom driver's computed-style walk.
+   */
+  async visible(options) {
+    try {
+      return resolve.isVisibleInLayout(await this.element(options), this.env.document);
+    } catch (error) {
+      if (error instanceof resolve.FrameEntryError || error instanceof core.StrictModeViolation) throw error;
+      return false;
+    }
+  }
+  async isEnabled(options) {
+    this.log("isEnabled");
+    const element = await this.element(options);
+    const disabled = element.disabled === true || element.closest(":disabled") !== null;
+    return core.enabledFrom(disabled, element.getAttribute("aria-disabled"));
+  }
+  async isChecked(options) {
+    this.log("isChecked");
+    const element = await this.element(options);
+    return core.checkedFrom(
+      element.getAttribute("aria-checked"),
+      Boolean(element.checked)
+    );
+  }
+  async selectedOptions(options) {
+    this.log("selectedOptions");
+    const element = await this.element(options);
+    return [...element.selectedOptions ?? []].map((option) => option.value);
+  }
+  // --- waiting ------------------------------------------------------------
+  async waitFor(state, options) {
+    this.log("waitFor", state);
+    const timeout = core.timeoutFor(options?.timeout);
+    const root = this.env.document.documentElement;
+    if (state === "visible") {
+      await waitUntil(
+        async () => {
+          if (!await this.visible({ timeout })) throw new Error("not visible yet");
+        },
+        root,
+        timeout
+      );
+      return;
+    }
+    await waitUntil(
+      async () => {
+        if (await this.count() !== 0 && await this.visible({ timeout })) {
+          throw new Error("still visible");
+        }
+      },
+      root,
+      timeout
+    );
+  }
+  async count() {
+    return resolve.countAll(this.container, this.scope, this.selector);
+  }
+};
+var SET_VALUE_TYPES = ["color", "date", "time", "datetime-local", "month", "range", "week"];
+function setValue(input, value) {
+  const setter = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(input), "value")?.set;
+  if (setter === void 0) input.value = value;
+  else setter.call(input, value);
+  if (input.value !== value) {
+    throw new Error(
+      `harnessed: "${value}" is not a valid value for an <input type="${input.type}">.`
+    );
+  }
+  input.dispatchEvent(new Event("input", { bubbles: true, composed: true }));
+  input.dispatchEvent(new Event("change", { bubbles: true }));
+}
+async function realReplace(element, value) {
+  element.focus();
+  const input = element;
+  if (element.localName === "input" && SET_VALUE_TYPES.includes(input.type)) {
+    setValue(input, value);
+    return;
+  }
+  if (element.localName === "input" || element.localName === "textarea") {
+    element.select();
+  } else {
+    element.ownerDocument.getSelection()?.selectAllChildren(element);
+  }
+  await (value === "" ? realPress("Delete") : realInsertText(value));
+}
+var BoundCypressQuery = class extends CypressQuery {
+  constructor(env, scope, selector, bound) {
+    super(env, scope, selector);
+    this.bound = bound;
+  }
+  bound;
+  async element(options) {
+    if (this.bound.isConnected) return this.bound;
+    return super.element(options);
+  }
+};
+core.registerDriver(CYPRESS_DRIVER, (env, scope, selector) => {
+  return new CypressQuery(env, scope, selector);
+});
+var POLL_MS = 20;
+function sleep(ms) {
+  return new Promise((resolve) => setTimeout(resolve, ms));
+}
+function baseOf(window2) {
+  const baseUrl = Cypress.config("baseUrl");
+  if (baseUrl !== null && baseUrl !== "") return baseUrl;
+  if (/^https?:$/.test(window2.location.protocol)) return window2.location.href;
+  return void 0;
+}
+function resolveUrl(window2, url) {
+  try {
+    return new URL(url, baseOf(window2));
+  } catch {
+    throw new Error(
+      `harnessed: cannot resolve "${url}": the application under test has not loaded a page yet and Cypress has no baseUrl. Set baseUrl, or pass an absolute URL.`
+    );
+  }
+}
+function sameDocument(from, to) {
+  const current = new URL(from);
+  return to.hash !== "" && current.href.split("#")[0] === to.href.split("#")[0];
+}
+async function goto(env, url) {
+  if (Cypress.testingType === "component") {
+    throw new Error(
+      "harnessed: goto() cannot run in component testing \u2014 the component is mounted in the spec frame, so navigating it would end the test. Navigate in an e2e spec, or mount the screen you want."
+    );
+  }
+  const { window: window2 } = env;
+  const leaving = window2.document;
+  const target = resolveUrl(window2, url);
+  const sameDoc = window2.location.protocol !== "about:" && sameDocument(window2.location.href, target);
+  window2.location.href = target.href;
+  if (sameDoc) return;
+  const timeout = Cypress.config("pageLoadTimeout");
+  const deadline = Date.now() + timeout;
+  for (; ; ) {
+    const document = window2.document;
+    if (document !== leaving && document.readyState !== "loading") return;
+    if (Date.now() > deadline) {
+      throw new Error(`harnessed: ${target.href} did not load within ${timeout}ms.`);
+    }
+    await sleep(POLL_MS);
+  }
+}
+core.registerNavigation(CYPRESS_DRIVER, {
+  goto,
+  currentUrl(env) {
+    return env.window.location.href;
+  },
+  async waitForUrl(env, matches, timeout) {
+    const { window: window2 } = env;
+    const deadline = Date.now() + timeout;
+    while (!matches(new URL(window2.location.href))) {
+      if (Date.now() > deadline) {
+        throw new Error(
+          `harnessed: the URL did not match within ${timeout}ms; it is ${window2.location.href}.`
+        );
+      }
+      await sleep(POLL_MS);
+    }
+  }
+});
+
+// src/env.ts
+function cypress({
+  window: window2,
+  document,
+  realEvents = false,
+  log = true
+}) {
+  return {
+    driver: CYPRESS_DRIVER,
+    window: window2,
+    get document() {
+      return document ?? window2.document;
+    },
+    realEvents,
+    log
+  };
+}
+
+// src/commands.ts
+function timeoutOf(options) {
+  return options?.timeout ?? core.getConfig().defaultTimeout * 4;
+}
+function envFor(window2, options) {
+  return cypress({
+    window: window2,
+    realEvents: options?.realEvents ?? false,
+    log: options?.log ?? true
+  });
+}
+function inPage(subject, fn, options) {
+  return cy.window({ log: false }).then({ timeout: timeoutOf(options) }, async (window2) => ({
+    result: await fn(envFor(window2, options))
+  })).then(({ result }) => cy.wrap(result === void 0 ? subject : result, { log: false }));
+}
+function registerCommands() {
+  Cypress.Commands.add(
+    "harnessEnv",
+    { prevSubject: "optional" },
+    (subject, fn, options) => inPage(subject, fn, options)
+  );
+  Cypress.Commands.add(
+    "harness",
+    { prevSubject: "optional" },
+    (subject, Harness, fnOrOptions, maybeOptions) => {
+      const fn = typeof fnOrOptions === "function" ? fnOrOptions : void 0;
+      const options = typeof fnOrOptions === "function" ? maybeOptions : fnOrOptions;
+      Cypress.log({ name: "harness", message: Harness.name });
+      return inPage(
+        subject,
+        (env) => {
+          const harness = new Harness(env);
+          return fn === void 0 ? harness : fn(harness);
+        },
+        options
+      );
+    }
+  );
+  Cypress.Commands.add(
+    "visitPage",
+    (Page, params, rawOptions) => {
+      const options = rawOptions;
+      return cy.window({ log: false }).then((window2) => {
+        const page = new Page(envFor(window2, options));
+        return cy.visit(page.urlFor(params)).then({ timeout: timeoutOf(options) }, async () => {
+          await page.expectReady();
+          return page;
+        });
+      });
+    }
+  );
+}
+
+// src/support.ts
+registerCommands();
+//# sourceMappingURL=support.cjs.map
+//# sourceMappingURL=support.cjs.map