@miragon/modeler-shell 0.0.0-stage → 0.1.0

package/dist/testing.js

@@ -0,0 +1,2297 @@
+import {
+  CHROME_ISLANDS,
+  INVALID_STATUS_DELAY_MS,
+  PALETTE_CLEARANCE,
+  SHELL,
+  TOOLTIP_DELAY_MS
+} from "./chunk-5JSZ4VGA.js";
+
+// src/testing/page-tools.ts
+var installPageTools = (_) => {
+  const scope = window;
+  if (scope.__modelerShellConformance) return;
+  const modifierKeys = ["Control", "Meta", "Shift", "Alt", "AltGraph", "CapsLock", "Fn"];
+  const frame = () => new Promise((resolve) => requestAnimationFrame(() => resolve()));
+  const borders = (element) => {
+    const style = getComputedStyle(element);
+    return {
+      left: parseFloat(style.borderLeftWidth) || 0,
+      top: parseFloat(style.borderTopWidth) || 0,
+      right: parseFloat(style.borderRightWidth) || 0,
+      bottom: parseFloat(style.borderBottomWidth) || 0
+    };
+  };
+  const visible = (element) => {
+    if (!element.isConnected) return false;
+    if (typeof element.checkVisibility === "function") {
+      if (!element.checkVisibility({ visibilityProperty: true })) return false;
+    } else {
+      if (element.closest("[hidden]")) return false;
+      for (let node = element; node; node = node.parentElement) {
+        if (getComputedStyle(node).display === "none") return false;
+      }
+      if (getComputedStyle(element).visibility === "hidden") return false;
+    }
+    const rect = element.getBoundingClientRect();
+    return rect.width > 0 && rect.height > 0;
+  };
+  const describe = (element) => {
+    const id = element.id ? `#${element.id}` : "";
+    const classes = [...element.classList].slice(0, 3).map((name2) => `.${name2}`).join("");
+    const chrome = element.getAttribute("data-chrome");
+    return `${element.tagName.toLowerCase()}${id}${classes}${chrome ? `[data-chrome="${chrome}"]` : ""}`;
+  };
+  const tools = {
+    keys: [],
+    documentKeys: [],
+    errors: [],
+    injected: [],
+    cleanups: [],
+    frame,
+    async settle() {
+      await frame();
+      await frame();
+      const running = typeof document.getAnimations === "function" ? document.getAnimations().filter((animation) => {
+        const end = animation.effect?.getComputedTiming().endTime;
+        return animation.playState === "running" && typeof end === "number" && Number.isFinite(end);
+      }) : [];
+      if (running.length > 0) {
+        await Promise.race([
+          Promise.allSettled(running.map((animation) => animation.finished)),
+          new Promise((resolve) => setTimeout(resolve, 2e3))
+        ]);
+      }
+      await frame();
+    },
+    visible,
+    container(root) {
+      const rect = root.getBoundingClientRect();
+      const border = borders(root);
+      return {
+        width: rect.width - border.left - border.right,
+        height: rect.height - border.top - border.bottom
+      };
+    },
+    box(element, root) {
+      const rect = element.getBoundingClientRect();
+      const origin = root.getBoundingClientRect();
+      const border = borders(root);
+      return {
+        left: rect.left - origin.left - border.left,
+        top: rect.top - origin.top - border.top,
+        width: rect.width,
+        height: rect.height
+      };
+    },
+    describe,
+    facts(element) {
+      const attributes = {};
+      for (const name2 of element.getAttributeNames()) attributes[name2] = element.getAttribute(name2) ?? "";
+      return {
+        tag: element.tagName.toLowerCase(),
+        description: describe(element),
+        attributes,
+        text: (element.textContent ?? "").replace(/\s+/g, " ").trim(),
+        visible: visible(element),
+        disabled: Boolean(element.disabled)
+      };
+    }
+  };
+  const recorder = (into) => (event) => {
+    if (modifierKeys.includes(event.key)) return;
+    into.push({
+      key: event.key,
+      code: event.code,
+      ctrlKey: event.ctrlKey,
+      metaKey: event.metaKey,
+      shiftKey: event.shiftKey,
+      altKey: event.altKey,
+      defaultPrevented: event.defaultPrevented
+    });
+  };
+  document.addEventListener("keydown", recorder(tools.documentKeys));
+  window.addEventListener("keydown", recorder(tools.keys));
+  window.addEventListener("error", (event) => {
+    tools.errors.push(event.message || String(event.error));
+  });
+  window.addEventListener("unhandledrejection", (event) => {
+    tools.errors.push(`unhandled rejection: ${String(event.reason)}`);
+  });
+  scope.__modelerShellConformance = tools;
+};
+async function inPage(page, pageFunction, arg) {
+  await page.evaluate(installPageTools, null);
+  return page.evaluate(pageFunction, arg);
+}
+var settleInPage = (_) => window.__modelerShellConformance.settle();
+function settle(page) {
+  return inPage(page, settleInPage, null);
+}
+var CHROME_TARGET_SELECTORS = {
+  menu: '[data-chrome="menu"]',
+  "palette-entry": '[data-chrome="palette"] [data-action]',
+  "palette-tab-stop": '[data-chrome="palette"] [data-action][tabindex="0"]',
+  "zoom-out": '[data-chrome="zoom"] [data-zoom="out"]',
+  "zoom-actual": '[data-chrome="zoom"] [data-zoom="actual"]',
+  "zoom-in": '[data-chrome="zoom"] [data-zoom="in"]',
+  "zoom-fit": '[data-chrome="zoom"] [data-zoom="fit"]',
+  canvas: ".djs-container > svg"
+};
+var targetProbe = ({ root, selector }) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  if (!rootElement) return null;
+  const element = [...rootElement.querySelectorAll(selector)].find((candidate) => tools.visible(candidate));
+  if (!element) return null;
+  const rect = element.getBoundingClientRect();
+  return {
+    client: { x: rect.left + rect.width / 2, y: rect.top + rect.height / 2 },
+    box: tools.box(element, rootElement),
+    label: (element.getAttribute("aria-label") ?? element.textContent ?? "").replace(/\s+/g, " ").trim()
+  };
+};
+async function findTarget(page, root, target) {
+  return inPage(page, targetProbe, { root, selector: CHROME_TARGET_SELECTORS[target] });
+}
+var focusProbe = ({ root, selector }) => {
+  const tools = window.__modelerShellConformance;
+  const element = document.querySelector(root)?.querySelector(selector);
+  if (!element) return null;
+  element.focus();
+  return document.activeElement === element ? tools.describe(element) : null;
+};
+async function focusTarget(page, root, target) {
+  return inPage(page, focusProbe, { root, selector: CHROME_TARGET_SELECTORS[target] });
+}
+var overlayProbe = ({ root, role }) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  if (!rootElement) return null;
+  const shown = [...rootElement.querySelectorAll(`[role="${role}"]`)].filter(
+    (element) => tools.visible(element)
+  );
+  const first = shown[0];
+  if (!first) return null;
+  return {
+    box: tools.box(first, rootElement),
+    text: (first.textContent ?? "").replace(/\s+/g, " ").trim(),
+    count: shown.length,
+    id: first.id
+  };
+};
+async function findOverlay(page, root, role) {
+  return inPage(page, overlayProbe, { root, role });
+}
+var afterPressProbe = async ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  await tools.settle();
+  const readout = document.querySelector(root)?.querySelector('[data-chrome="zoom"] [data-zoom="actual"]')?.textContent;
+  const digits = (readout ?? "").replace(/[^0-9]/g, "");
+  return {
+    zoom: digits ? Number(digits) : null,
+    keys: tools.keys.splice(0),
+    documentKeys: tools.documentKeys.splice(0)
+  };
+};
+var clearKeysProbe = (_) => {
+  const tools = window.__modelerShellConformance;
+  tools.keys.splice(0);
+  tools.documentKeys.splice(0);
+};
+var injectProbe = ({ root, kind }) => {
+  const tools = window.__modelerShellConformance;
+  const parent = document.querySelector(root) ?? tools.armedRoot ?? document.body;
+  const host = parent.isConnected ? parent : document.body;
+  const element = kind === "input" || kind === "textarea" ? document.createElement(kind) : document.createElement("div");
+  element.setAttribute("data-modeler-shell-conformance", kind);
+  element.style.cssText = "position:absolute;left:0;top:0;width:40px;height:20px;";
+  if (kind === "modal" || kind === "popover") {
+    element.setAttribute("role", "dialog");
+    element.setAttribute("aria-label", "Conformance stand-in");
+    if (kind === "modal") element.setAttribute("aria-modal", "true");
+  }
+  if (kind === "contenteditable") element.setAttribute("contenteditable", "true");
+  else if (kind !== "input" && kind !== "textarea") element.tabIndex = -1;
+  host.append(element);
+  tools.injected.push(element);
+  element.focus();
+  return document.activeElement === element;
+};
+var removeInjectedProbe = (_) => {
+  const tools = window.__modelerShellConformance;
+  for (const element of tools.injected.splice(0)) element.remove();
+  for (const cleanup of tools.cleanups.splice(0)) cleanup();
+};
+var canvasHandlesProbe = ({ root, key }) => {
+  const tools = window.__modelerShellConformance;
+  const svg = document.querySelector(root)?.querySelector(".djs-container > svg");
+  if (!svg) return false;
+  const listener = (event) => {
+    if (event.key === key) event.preventDefault();
+  };
+  svg.addEventListener("keydown", listener);
+  tools.cleanups.push(() => svg.removeEventListener("keydown", listener));
+  return true;
+};
+var armCleanupProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  if (rootElement) tools.armedRoot = rootElement;
+  tools.errors.splice(0);
+  tools.keys.splice(0);
+  tools.documentKeys.splice(0);
+  return Boolean(rootElement);
+};
+var leftoverProbe = (_) => {
+  const tools = window.__modelerShellConformance;
+  const ours = (element) => element.hasAttribute("data-modeler-shell-conformance");
+  const shellClass = (name2) => name2.startsWith("cd-shell");
+  const root = tools.armedRoot;
+  return {
+    classedElements: [...document.querySelectorAll("[class]")].filter((element) => element !== document.documentElement && !ours(element)).filter((element) => [...element.classList].some(shellClass)).map((element) => tools.describe(element)),
+    documentClasses: [...document.documentElement.classList].filter(shellClass),
+    chromeElements: [...document.querySelectorAll("[data-chrome]")].map((element) => tools.describe(element)),
+    rootClasses: root ? [...root.classList].filter(shellClass) : [],
+    rootAttributes: root ? root.getAttributeNames() : [],
+    errors: [...tools.errors]
+  };
+};
+var hostPageModeProbe = ({ theme, kontrast }) => {
+  const html = document.documentElement;
+  html.setAttribute("data-cd-theme", theme);
+  if (kontrast) html.setAttribute("data-cd-kontrast", kontrast);
+  else html.removeAttribute("data-cd-kontrast");
+};
+
+// src/testing/geometry.ts
+var GEOMETRY_TOLERANCE_PX = 1;
+var DEFAULT_ROOT = ".cd-shell";
+var ZOOM_PANEL_WIDTH = 173;
+var LEGAL_LINE = 20;
+var LEGEND_MIN_WIDTH = 184;
+var STATUS_MAX_WIDTH = 560;
+var DROPDOWN_MAX_WIDTH = 320;
+var TOOLTIP_MAX_WIDTH = 280;
+var SHEET_MAX_HEIGHT_SHARE = 0.45;
+var measureProbe = ({ root, islands }) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  if (!rootElement) return { error: `no element matches the shell root selector "${root}"` };
+  const boxes = {};
+  const duplicates = [];
+  for (const element of rootElement.querySelectorAll("[data-chrome]")) {
+    const name2 = element.getAttribute("data-chrome") ?? "";
+    if (!islands.includes(name2) || !tools.visible(element)) continue;
+    if (boxes[name2]) {
+      duplicates.push(name2);
+      continue;
+    }
+    boxes[name2] = tools.box(element, rootElement);
+  }
+  return {
+    container: tools.container(rootElement),
+    paletteRow: rootElement.getAttribute("data-palette") === "second-row" ? "second-row" : "top",
+    islands: boxes,
+    open: {
+      legend: rootElement.getAttribute("data-legend") === "open",
+      inspector: rootElement.getAttribute("data-inspector") === "open",
+      problems: rootElement.getAttribute("data-problems") === "shown"
+    },
+    duplicates
+  };
+};
+async function measureChrome(page, root = DEFAULT_ROOT) {
+  const result = await inPage(page, measureProbe, { root, islands: CHROME_ISLANDS });
+  if ("error" in result) throw new Error(`@miragon/modeler-shell conformance: ${result.error}`);
+  if (result.duplicates.length > 0) {
+    const names = [...new Set(result.duplicates)].map((name2) => `[data-chrome="${name2}"]`).join(", ");
+    throw new Error(`@miragon/modeler-shell conformance: more than one visible ${names}`);
+  }
+  return {
+    container: result.container,
+    paletteRow: result.paletteRow,
+    islands: result.islands,
+    open: result.open
+  };
+}
+function isNarrow(container) {
+  return container.width <= SHELL.narrow;
+}
+function isVeryNarrow(container) {
+  return container.width <= SHELL.veryNarrow;
+}
+function sheetOpen(measurement) {
+  return measurement.open.inspector && isNarrow(measurement.container);
+}
+function chromeExpectations(measurement, host) {
+  const { container, islands, open, paletteRow } = measurement;
+  const { edge, gap, row, free, inspectorWidth } = SHELL;
+  const web = host === "web";
+  const secondRow = paletteRow === "second-row";
+  const sheet = sheetOpen(measurement);
+  const sideInspector = open.inspector && !isNarrow(container);
+  const boxes = {};
+  const limits = {};
+  const hidden = {};
+  const required = ["menu", "palette"];
+  boxes.menu = { left: edge, top: edge, width: row, height: row };
+  boxes.palette = { top: secondRow ? free : edge, height: row, centerX: container.width / 2 };
+  const menu = islands.menu;
+  limits.palette = secondRow ? { maxWidth: container.width - 2 * edge } : menu ? { minLeft: menu.left + menu.width + PALETTE_CLEARANCE } : {};
+  if (sheet) {
+    const reason = "hidden while the inspector is a bottom sheet (guide \xA75.11)";
+    hidden.zoom = reason;
+    hidden.problems = reason;
+    hidden.legend = reason;
+  } else {
+    required.push("zoom");
+    boxes.zoom = { right: edge, bottom: edge, width: ZOOM_PANEL_WIDTH, height: row };
+    const stackBase = web ? edge + LEGAL_LINE + gap : edge;
+    if (islands.problems) boxes.problems = { left: edge, bottom: stackBase, height: row };
+    if (islands.legend) {
+      const besidePill = open.problems ? stackBase + row + gap : stackBase;
+      const bottom = isVeryNarrow(container) ? Math.max(besidePill, edge + row + gap) : besidePill;
+      boxes.legend = { left: edge, bottom };
+      limits.legend = { minWidth: LEGEND_MIN_WIDTH };
+    }
+  }
+  if (islands.inspector) {
+    if (sheet) {
+      boxes.inspector = { left: edge, right: edge, bottom: edge };
+      limits.inspector = { maxHeight: container.height * SHEET_MAX_HEIGHT_SHARE };
+    } else {
+      boxes.inspector = { top: free, right: edge, width: inspectorWidth };
+      limits.inspector = { minBottom: free };
+    }
+  }
+  if (islands.status) {
+    const strip = sideInspector ? container.width - edge - inspectorWidth : container.width;
+    boxes.status = { top: secondRow ? free + row + edge : free, centerX: strip / 2 };
+    limits.status = {
+      minLeft: edge,
+      maxWidth: Math.min(STATUS_MAX_WIDTH, container.width - 2 * edge)
+    };
+  }
+  if (web) {
+    if (islands.primary) boxes.primary = { top: edge, right: edge, height: row };
+  } else {
+    hidden.primary = "the top right stays empty in IDE and embedded hosts (guide \xA75.7)";
+  }
+  return { boxes, limits, required, hidden };
+}
+function expectedChromeBoxes(measurement, host) {
+  return chromeExpectations(measurement, host).boxes;
+}
+var round = (value) => Math.round(value * 10) / 10;
+function sides(box, container) {
+  return {
+    left: box.left,
+    top: box.top,
+    right: container.width - box.left - box.width,
+    bottom: container.height - box.top - box.height,
+    width: box.width,
+    height: box.height,
+    centerX: box.left + box.width / 2
+  };
+}
+function boxMismatches(name2, box, expected, container, tolerance = GEOMETRY_TOLERANCE_PX) {
+  const actual = sides(box, container);
+  return Object.keys(expected).flatMap((field) => {
+    const want = expected[field];
+    if (want === void 0) return [];
+    const have = actual[field];
+    return Math.abs(have - want) > tolerance + 1e-6 ? [`${name2}: ${field} is ${round(have)}px, expected ${round(want)}px (\xB1${tolerance}px)`] : [];
+  });
+}
+function limitViolations(name2, box, limits, container, tolerance = GEOMETRY_TOLERANCE_PX) {
+  const actual = sides(box, container);
+  const problems = [];
+  const atLeast = (field, have, limit) => {
+    if (limit !== void 0 && have < limit - tolerance - 1e-6) {
+      problems.push(`${name2}: ${field} is ${round(have)}px, at least ${round(limit)}px expected`);
+    }
+  };
+  const atMost = (field, have, limit) => {
+    if (limit !== void 0 && have > limit + tolerance + 1e-6) {
+      problems.push(`${name2}: ${field} is ${round(have)}px, at most ${round(limit)}px expected`);
+    }
+  };
+  atLeast("width", actual.width, limits.minWidth);
+  atMost("width", actual.width, limits.maxWidth);
+  atMost("height", actual.height, limits.maxHeight);
+  atLeast("left", actual.left, limits.minLeft);
+  atLeast("right", actual.right, limits.minRight);
+  atLeast("bottom", actual.bottom, limits.minBottom);
+  return problems;
+}
+function geometryProblems(measurement, host, tolerance = GEOMETRY_TOLERANCE_PX) {
+  const { container, islands, open, paletteRow } = measurement;
+  const expectations = chromeExpectations(measurement, host);
+  const problems = [];
+  const sheet = sheetOpen(measurement);
+  for (const name2 of expectations.required) {
+    if (!islands[name2]) problems.push(`${name2}: [data-chrome="${name2}"] is missing or not visible`);
+  }
+  for (const name2 of CHROME_ISLANDS) {
+    const box = islands[name2];
+    if (!box) continue;
+    const expected = expectations.boxes[name2];
+    if (!expected) {
+      const reason = expectations.hidden[name2] ?? "no anchor of the guide applies";
+      problems.push(`${name2}: visible, but ${reason}`);
+      continue;
+    }
+    problems.push(...boxMismatches(name2, box, expected, container, tolerance));
+    const limits = expectations.limits[name2];
+    if (limits) problems.push(...limitViolations(name2, box, limits, container, tolerance));
+  }
+  if (isNarrow(container) && paletteRow !== "second-row") {
+    problems.push(
+      `palette: data-palette="${paletteRow}" in a ${round(container.width)}px wide container; up to ${SHELL.narrow}px it is "second-row" (guide \xA75.15)`
+    );
+  }
+  const palette = islands.palette;
+  const menu = islands.menu;
+  if (paletteRow === "second-row" && !isNarrow(container) && palette && menu) {
+    const clipped = palette.width >= container.width - 2 * SHELL.edge - tolerance;
+    const topRowLeft = (container.width - palette.width) / 2;
+    if (!clipped && topRowLeft >= menu.left + menu.width + PALETTE_CLEARANCE + tolerance) {
+      problems.push(
+        `palette: in the second row although the top row keeps ${round(topRowLeft - menu.left - menu.width)}px to the menu trigger (at least ${PALETTE_CLEARANCE}px suffice, guide \xA75.15)`
+      );
+    }
+  }
+  const state = (island, flag, attribute2, hiddenBySheet) => {
+    const shown = Boolean(islands[island]);
+    if (flag && !shown && !hiddenBySheet) {
+      problems.push(`${island}: the root carries ${attribute2}, but the island is not visible`);
+    }
+    if (!flag && shown) problems.push(`${island}: visible, but the root lacks ${attribute2}`);
+  };
+  state("problems", open.problems, 'data-problems="shown"', sheet);
+  state("legend", open.legend, 'data-legend="open"', sheet);
+  state("inspector", open.inspector, 'data-inspector="open"', false);
+  return problems;
+}
+function expectedFitInsets(measurement, host) {
+  const { container, islands, open, paletteRow } = measurement;
+  const insets = {
+    top: paletteRow === "second-row" ? SHELL.fitInsetTopSecondRow : SHELL.fitInsetTop,
+    right: SHELL.fitInsetSide,
+    bottom: host === "web" && open.problems ? SHELL.fitInsetBottomWeb : SHELL.fitInsetBottom,
+    left: SHELL.fitInsetSide
+  };
+  if (sheetOpen(measurement)) {
+    const sheet = islands.inspector;
+    insets.bottom = sheet ? container.height - sheet.top + SHELL.edge : SHELL.fitInsetBottom;
+    return insets;
+  }
+  if (open.inspector) insets.right = SHELL.edge + SHELL.inspectorWidth + SHELL.fitInsetSide;
+  const legend = islands.legend;
+  if (open.legend && legend && legend.width > 0 && container.width > SHELL.veryNarrow) {
+    insets.left = SHELL.edge + legend.width + SHELL.fitInsetSide;
+  }
+  return insets;
+}
+function freeRectangle(measurement, host) {
+  const { container } = measurement;
+  const insets = expectedFitInsets(measurement, host);
+  const horizontal = container.width - insets.left - insets.right > 0;
+  const vertical = container.height - insets.top - insets.bottom > 0;
+  return {
+    left: horizontal ? insets.left : 0,
+    top: vertical ? insets.top : 0,
+    right: horizontal ? container.width - insets.right : container.width,
+    bottom: vertical ? container.height - insets.bottom : container.height
+  };
+}
+function dropdownProblems(box, container, tolerance = GEOMETRY_TOLERANCE_PX) {
+  const { edge, gap, row, menuMinWidth } = SHELL;
+  return [
+    ...boxMismatches("dropdown", box, { top: edge + row + gap, left: edge }, container, tolerance),
+    ...limitViolations(
+      "dropdown",
+      box,
+      {
+        minWidth: menuMinWidth,
+        maxWidth: Math.min(DROPDOWN_MAX_WIDTH, container.width - 2 * edge),
+        minBottom: edge
+      },
+      container,
+      tolerance
+    )
+  ];
+}
+function tooltipProblems(tooltip, anchor, row, container, tolerance = GEOMETRY_TOLERANCE_PX) {
+  const { edge, gap, row: rowHeight, free } = SHELL;
+  const clamp = (centred) => Math.max(edge, Math.min(centred, container.width - edge - tooltip.width));
+  const expectedAt = (left) => row === "bottom" ? { left, bottom: edge + rowHeight + gap } : { left, top: (row === "top" ? edge : free) + rowHeight + gap };
+  let mismatches = boxMismatches(
+    "tooltip",
+    tooltip,
+    expectedAt(clamp(anchor.left + anchor.width / 2 - tooltip.width / 2)),
+    container,
+    tolerance
+  );
+  if (row === "second-row" && mismatches.length > 0) {
+    const inContainer = boxMismatches(
+      "tooltip",
+      tooltip,
+      expectedAt(clamp(container.width / 2 - tooltip.width / 2)),
+      container,
+      tolerance
+    );
+    if (inContainer.length === 0) mismatches = inContainer;
+  }
+  return [
+    ...mismatches,
+    ...limitViolations(
+      "tooltip",
+      tooltip,
+      { minLeft: edge, minRight: edge, maxWidth: Math.min(TOOLTIP_MAX_WIDTH, container.width - 2 * edge) },
+      container,
+      tolerance
+    )
+  ];
+}
+
+// src/testing/facts.ts
+var DOM_ORDER = [
+  "menu",
+  "primary",
+  "palette",
+  "canvas",
+  "status",
+  "hint",
+  "inspector",
+  "problems",
+  "legend",
+  "zoom"
+];
+var ariaProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  if (!rootElement) return null;
+  const find = (selector) => rootElement.querySelector(selector);
+  const factsOf = (element) => element ? tools.facts(element) : null;
+  const navigatorLike = navigator;
+  const trigger = find('[data-chrome="menu"]');
+  const controlsId = trigger?.getAttribute("aria-controls");
+  const palette = find('[data-chrome="palette"]');
+  const toolbar = palette?.querySelector('[role="toolbar"]') ?? palette?.querySelector(".djs-palette-entries");
+  const zoom = find('[data-chrome="zoom"]');
+  const zoomButtons = {};
+  for (const name2 of ["out", "actual", "in", "fit"]) {
+    const button = zoom?.querySelector(`[data-zoom="${name2}"]`);
+    if (button) zoomButtons[name2] = tools.facts(button);
+  }
+  const legend = find('[data-chrome="legend"]');
+  const labelledBy = legend?.getAttribute("aria-labelledby");
+  const parts = [
+    ["menu", trigger],
+    ["primary", find('[data-chrome="primary"]')],
+    ["palette", palette],
+    ["canvas", find(".djs-container > svg")],
+    ["status", find('[data-chrome="status"]')],
+    ["hint", find(".cd-shell-hint")],
+    ["inspector", find('[data-chrome="inspector"]')],
+    ["problems", find('[data-chrome="problems"]')],
+    ["legend", legend],
+    ["zoom", zoom]
+  ];
+  const present = parts.filter((part) => part[1] !== null);
+  present.sort(([, a], [, b]) => a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1);
+  const titledSelector = [
+    '[data-chrome="menu"][title]',
+    '[data-chrome="palette"] [data-action][title]',
+    '[data-chrome="zoom"] [title]',
+    '[data-chrome="problems"][title]'
+  ].join(", ");
+  return {
+    platform: /mac/i.test(navigatorLike.userAgentData?.platform ?? navigatorLike.platform ?? "") ? "mac" : "other",
+    documentLang: document.documentElement.lang,
+    rootLang: rootElement.getAttribute("lang"),
+    trigger: factsOf(trigger),
+    controlled: factsOf(controlsId ? document.getElementById(controlsId) : null),
+    palette: factsOf(palette),
+    toolbar: factsOf(toolbar),
+    canvas: factsOf(find(".djs-container > svg")),
+    entries: [...palette?.querySelectorAll("[data-action]") ?? []].map((entry) => ({
+      ...tools.facts(entry),
+      group: entry.closest("[data-group]")?.getAttribute("data-group") ?? null
+    })),
+    zoom: factsOf(zoom),
+    zoomButtons,
+    order: present.map(([name2]) => name2),
+    positiveTabindex: [...rootElement.querySelectorAll("[tabindex]")].filter((element) => Number(element.getAttribute("tabindex")) > 0).map((element) => `${tools.describe(element)} (tabindex="${element.getAttribute("tabindex")}")`),
+    titled: [...rootElement.querySelectorAll(titledSelector)].map((element) => tools.describe(element)),
+    problems: factsOf(find('[data-chrome="problems"]')),
+    status: factsOf(find('[data-chrome="status"]')),
+    legend: factsOf(legend),
+    legendTitle: labelledBy ? labelledBy.split(/\s+/).map((id) => document.getElementById(id)?.textContent?.trim() ?? "").join(" ").trim() : null,
+    legendClose: factsOf(legend?.querySelector("button")),
+    inspector: factsOf(find('[data-chrome="inspector"]'))
+  };
+};
+var menuProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  if (!rootElement) return null;
+  const trigger = rootElement.querySelector('[data-chrome="menu"]');
+  const menu = [...rootElement.querySelectorAll('[role="menu"]')].find((element) => tools.visible(element)) ?? null;
+  const items = menu ? [
+    ...menu.querySelectorAll('[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]')
+  ].filter((item) => tools.visible(item)) : [];
+  return {
+    expanded: trigger?.getAttribute("aria-expanded") ?? null,
+    controls: trigger?.getAttribute("aria-controls") ?? null,
+    menu: menu ? tools.facts(menu) : null,
+    items: items.map((item) => {
+      const group = item.closest('[role="group"]');
+      return {
+        role: item.getAttribute("role") ?? "",
+        name: (item.getAttribute("aria-label") ?? item.textContent ?? "").replace(/\s+/g, " ").trim(),
+        checked: item.getAttribute("aria-checked"),
+        disabled: item.getAttribute("aria-disabled"),
+        haspopup: item.getAttribute("aria-haspopup"),
+        group: group && menu?.contains(group) ? group.getAttribute("aria-label") ?? "" : null
+      };
+    }),
+    active: items.findIndex((item) => item === document.activeElement),
+    activeIsTrigger: Boolean(trigger) && document.activeElement === trigger
+  };
+};
+var paletteFocusProbe = ({ root }) => {
+  const palette = document.querySelector(root)?.querySelector('[data-chrome="palette"]');
+  if (!palette) return null;
+  const entries = [...palette.querySelectorAll("[data-action]")];
+  const active = document.activeElement;
+  return {
+    entries: entries.map((entry) => entry.getAttribute("data-action") ?? ""),
+    tabStops: entries.filter((entry) => entry.getAttribute("tabindex") === "0").map((entry) => entry.getAttribute("data-action") ?? ""),
+    active: active && entries.includes(active) ? active.getAttribute("data-action") : null
+  };
+};
+var zoomButtonsProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const zoom = document.querySelector(root)?.querySelector('[data-chrome="zoom"]');
+  const buttons = {};
+  for (const name2 of ["out", "actual", "in", "fit"]) {
+    const button = zoom?.querySelector(`[data-zoom="${name2}"]`);
+    if (button) buttons[name2] = tools.facts(button);
+  }
+  return buttons;
+};
+var MODE_ROLES = ["--cd-ui-grund", "--cd-ui-text", "--cd-ui-flaeche-hoch", "--cd-ui-linie"];
+var appearanceProbe = ({
+  root,
+  roles
+}) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  if (!rootElement) return null;
+  const mode = (name2, element) => {
+    const style = getComputedStyle(element);
+    const resolved = {};
+    for (const role of roles) resolved[role] = style.getPropertyValue(role).trim();
+    return { name: name2, description: tools.describe(element), colorScheme: style.colorScheme, roles: resolved };
+  };
+  const parts = [mode("root", rootElement)];
+  const canvas = rootElement.querySelector(".djs-container");
+  if (canvas) parts.push(mode("canvas", canvas));
+  for (const island of rootElement.querySelectorAll("[data-chrome]")) {
+    if (tools.visible(island)) parts.push(mode(island.getAttribute("data-chrome") ?? "island", island));
+  }
+  for (const [name2, role] of [
+    ["dropdown", "menu"],
+    ["tooltip", "tooltip"]
+  ]) {
+    const popup = [...rootElement.querySelectorAll(`[role="${role}"]`)].find(
+      (element) => tools.visible(element)
+    );
+    if (popup) parts.push(mode(name2, popup));
+  }
+  return {
+    documentClasses: [...document.documentElement.classList],
+    themed: [...document.querySelectorAll("[data-cd-theme], [data-cd-kontrast]")].map((element) => ({
+      description: tools.describe(element),
+      isDocument: element === document.documentElement,
+      relation: element === rootElement ? "self" : element.contains(rootElement) ? "ancestor" : rootElement.contains(element) ? "descendant" : "elsewhere",
+      theme: element.getAttribute("data-cd-theme"),
+      kontrast: element.getAttribute("data-cd-kontrast")
+    })),
+    parts
+  };
+};
+var activeStopProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const active = document.activeElement;
+  const rootElement = document.querySelector(root);
+  if (!active || active === document.body || !rootElement) return { description: "<body>", kind: "other" };
+  const description = tools.describe(active);
+  if (!rootElement.contains(active))
+    return { description: `${description} outside the shell root`, kind: "other" };
+  if (active.matches('[data-chrome="palette"] [data-action]')) return { description, kind: "palette" };
+  if (active.matches(".djs-container > svg")) return { description, kind: "canvas" };
+  if (active.closest('[data-chrome="primary"]')) return { description, kind: "primary" };
+  const tabindex = active.getAttribute("tabindex");
+  return {
+    description: tabindex === null ? description : `${description}[tabindex="${tabindex}"]`,
+    kind: "other"
+  };
+};
+var paletteShortcutProbe = ({
+  root
+}) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  const active = document.activeElement;
+  if (!rootElement || !active?.matches('[data-chrome="palette"] [data-action]')) return null;
+  const tooltip = [...rootElement.querySelectorAll('[role="tooltip"]')].find(
+    (element) => tools.visible(element)
+  );
+  const chip = tooltip ? [...tooltip.querySelectorAll("kbd")].find((element) => tools.visible(element)) : void 0;
+  return {
+    action: active.getAttribute("data-action") ?? "",
+    chip: (chip?.textContent ?? "").trim(),
+    keyShortcuts: active.getAttribute("aria-keyshortcuts")
+  };
+};
+var surroundProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  if (!rootElement) return null;
+  const transparent = (color) => {
+    if (color === "" || color === "transparent") return true;
+    const legacy = /^rgba\([^)]*,\s*([\d.]+)\)$/.exec(color);
+    if (legacy) return Number(legacy[1]) === 0;
+    const modern = /\/\s*([\d.]+)%?\s*\)$/.exec(color);
+    return modern ? Number(modern[1]) === 0 : false;
+  };
+  const start = rootElement.querySelector(".djs-container");
+  let painted = null;
+  for (let node = start; node && !painted; node = node.parentElement) {
+    const color = getComputedStyle(node).backgroundColor;
+    if (!transparent(color)) painted = { description: tools.describe(node), color };
+    if (node === rootElement) break;
+  }
+  const probe = document.createElement("span");
+  probe.setAttribute("data-modeler-shell-conformance", "role-probe");
+  probe.style.cssText = "position:absolute;visibility:hidden;background-color:var(--cd-ui-grund);";
+  rootElement.append(probe);
+  const grund = getComputedStyle(probe).backgroundColor;
+  probe.remove();
+  return { container: start !== null, painted, grund };
+};
+var paletteEntriesProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const palette = document.querySelector(root)?.querySelector('[data-chrome="palette"]');
+  if (!palette) return [];
+  return [...palette.querySelectorAll("[data-action]")].filter((entry) => tools.visible(entry)).map((entry) => {
+    const rect = entry.getBoundingClientRect();
+    return {
+      action: entry.getAttribute("data-action") ?? "",
+      group: entry.closest("[data-group]")?.getAttribute("data-group") ?? null,
+      pressed: entry.getAttribute("aria-pressed") === "true",
+      disabled: entry.getAttribute("aria-disabled") === "true",
+      client: { x: rect.left + rect.width / 2, y: rect.top + rect.height / 2 }
+    };
+  });
+};
+var paletteColorProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const palette = document.querySelector(root)?.querySelector('[data-chrome="palette"]');
+  if (!palette) return null;
+  const resolve = (role) => {
+    const probe = document.createElement("span");
+    probe.setAttribute("data-modeler-shell-conformance", "role-probe");
+    probe.style.cssText = `position:absolute;visibility:hidden;color:var(${role});`;
+    palette.append(probe);
+    const color = getComputedStyle(probe).color;
+    probe.remove();
+    return color;
+  };
+  const iconOf = (entry) => {
+    const svg = entry.querySelector("svg");
+    if (svg) return { kind: "svg", color: getComputedStyle(svg).color };
+    const before = getComputedStyle(entry, "::before");
+    if (before.content && before.content !== "none" && before.content !== "normal") {
+      return { kind: "::before", color: before.color };
+    }
+    return null;
+  };
+  return {
+    roles: {
+      text: resolve("--cd-ui-text"),
+      interaktion: resolve("--cd-ui-interaktion"),
+      textLeise: resolve("--cd-ui-text-leise")
+    },
+    entries: [...palette.querySelectorAll("[data-action]")].filter((entry) => tools.visible(entry)).map((entry) => ({
+      action: entry.getAttribute("data-action") ?? "",
+      group: entry.closest("[data-group]")?.getAttribute("data-group") ?? null,
+      pressed: entry.getAttribute("aria-pressed") === "true",
+      disabled: entry.getAttribute("aria-disabled") === "true",
+      hovered: entry.matches(":hover"),
+      color: getComputedStyle(entry).color,
+      icon: iconOf(entry)
+    }))
+  };
+};
+var shapesProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  if (!rootElement) return [];
+  return [...rootElement.querySelectorAll(".djs-container .djs-shape[data-element-id]")].filter((shape) => tools.visible(shape)).map((shape) => {
+    const visual = shape.querySelector(".djs-visual") ?? shape;
+    const rect = visual.getBoundingClientRect();
+    const client = { x: rect.left + rect.width / 2, y: rect.top + rect.height / 2 };
+    const local = typeof visual.getBBox === "function" ? visual.getBBox() : rect;
+    const hitElement = document.elementFromPoint(client.x, client.y);
+    return {
+      id: shape.getAttribute("data-element-id") ?? "",
+      selected: shape.classList.contains("selected"),
+      transform: shape.getAttribute("transform") ?? "",
+      size: { width: local.width, height: local.height },
+      box: tools.box(visual, rootElement),
+      client,
+      hit: hitElement !== null && shape.contains(hitElement)
+    };
+  });
+};
+var canvasStateProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const container = document.querySelector(root)?.querySelector(".djs-container");
+  const active = document.activeElement;
+  const ours = (element) => element.closest("[data-modeler-shell-conformance]") !== null;
+  const visibleIn = (selector) => container ? [...container.querySelectorAll(selector)].filter(
+    (element) => !ours(element) && tools.visible(element)
+  ) : [];
+  return {
+    focusInCanvas: Boolean(container && active && container.contains(active)),
+    focused: !active || active === document.body ? "<body>" : tools.describe(active),
+    contextPadEntries: visibleIn(".djs-context-pad .entry").map(
+      (entry) => entry.getAttribute("data-action") ?? tools.describe(entry)
+    ),
+    textFields: visibleIn('input, textarea, [contenteditable]:not([contenteditable="false"])').map(
+      (field) => tools.describe(field)
+    )
+  };
+};
+var readOnlyStateProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  if (!rootElement) return null;
+  const status = rootElement.querySelector('[data-chrome="status"]');
+  return { readOnly: rootElement.hasAttribute("data-readonly"), status: status ? tools.facts(status) : null };
+};
+var menuEntriesProbe = ({ root }) => {
+  const tools = window.__modelerShellConformance;
+  const rootElement = document.querySelector(root);
+  const menu = rootElement ? [...rootElement.querySelectorAll('[role="menu"]')].find((element) => tools.visible(element)) : void 0;
+  if (!menu) return null;
+  const entries = [];
+  const selector = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]';
+  for (const element of menu.querySelectorAll(selector)) {
+    const role = element.getAttribute("role") ?? "";
+    if (!tools.visible(element)) continue;
+    entries.push({
+      name: (element.getAttribute("aria-label") ?? element.textContent ?? "").replace(/\s+/g, " ").trim(),
+      role,
+      menuId: element.closest("[data-menu-id]")?.getAttribute("data-menu-id") ?? null,
+      disabled: element.getAttribute("aria-disabled") === "true",
+      group: element.closest("[data-menu-group]")?.getAttribute("data-menu-group") ?? null
+    });
+  }
+  return entries;
+};
+
+// src/testing/checks.ts
+var normalize = (text) => text.replace(/\s+/g, " ").trim();
+var name = (element) => normalize(element.attributes["aria-label"] ?? element.text);
+var attribute = (element, key) => element.attributes[key];
+function expectedKeyShortcuts(platform) {
+  const modifier = platform === "mac" ? "Meta" : "Control";
+  return {
+    in: `${modifier}+= ${modifier}+Plus`,
+    out: `${modifier}+-`,
+    actual: `${modifier}+0`,
+    fit: "Shift+1"
+  };
+}
+function ariaProblems(facts, host) {
+  const problems = [];
+  if (host === "embedded") {
+    if (!facts.rootLang)
+      problems.push("root: an embedded shell root carries the tool's lang itself (guide \xA72, \xA712)");
+  } else if (!facts.documentLang) {
+    problems.push("<html> has no lang (guide \xA72)");
+  }
+  const trigger = facts.trigger;
+  if (!trigger) {
+    problems.push('menu: no [data-chrome="menu"] trigger');
+  } else {
+    if (trigger.tag !== "button")
+      problems.push(`menu: the trigger is a <${trigger.tag}>, expected a <button>`);
+    if (!attribute(trigger, "aria-label")) problems.push("menu: the icon-only trigger has no aria-label");
+    if (attribute(trigger, "aria-haspopup") !== "menu") {
+      problems.push(`menu: aria-haspopup is "${attribute(trigger, "aria-haspopup") ?? ""}", expected "menu"`);
+    }
+    if (attribute(trigger, "aria-expanded") !== "false") {
+      problems.push(
+        `menu: aria-expanded is "${attribute(trigger, "aria-expanded") ?? ""}" while closed, expected "false"`
+      );
+    }
+    if (!attribute(trigger, "aria-controls")) {
+      problems.push("menu: the trigger has no aria-controls");
+    } else if (!facts.controlled) {
+      problems.push(`menu: aria-controls="${attribute(trigger, "aria-controls")}" names no element`);
+    } else if (attribute(facts.controlled, "role") !== "menu") {
+      problems.push(
+        `menu: aria-controls names a ${facts.controlled.description} with role "${attribute(facts.controlled, "role") ?? ""}", expected "menu"`
+      );
+    }
+  }
+  if (!facts.palette) {
+    problems.push('palette: no [data-chrome="palette"]');
+  } else {
+    const toolbar = facts.toolbar;
+    if (!toolbar || attribute(toolbar, "role") !== "toolbar") {
+      problems.push('palette: .djs-palette-entries has no role="toolbar"');
+    } else if (!attribute(toolbar, "aria-label")) {
+      problems.push("palette: the toolbar has no aria-label");
+    }
+    for (const entry of facts.entries) {
+      const action = attribute(entry, "data-action") ?? entry.description;
+      if (attribute(entry, "role") !== "button")
+        problems.push(`palette: entry "${action}" has no role="button"`);
+      if (!attribute(entry, "aria-label"))
+        problems.push(`palette: entry "${action}" has no aria-label (title)`);
+      const tabindex = attribute(entry, "tabindex");
+      if (tabindex !== "0" && tabindex !== "-1") {
+        problems.push(`palette: entry "${action}" has tabindex "${tabindex ?? ""}", expected roving 0/-1`);
+      }
+    }
+    const stops = facts.entries.filter((entry) => attribute(entry, "tabindex") === "0");
+    if (facts.entries.length > 0 && stops.length !== 1) {
+      problems.push(
+        `palette: ${stops.length} entries with tabindex="0", expected exactly one (roving tabindex)`
+      );
+    }
+    const tools = facts.entries.filter(
+      (entry) => entry.group === "tools" && (attribute(entry, "data-action") ?? "").endsWith("-tool")
+    );
+    for (const tool of tools) {
+      const pressed2 = attribute(tool, "aria-pressed");
+      if (pressed2 !== "true" && pressed2 !== "false") {
+        problems.push(`palette: tool "${attribute(tool, "data-action")}" has no aria-pressed`);
+      }
+    }
+    const pressed = tools.filter((tool) => attribute(tool, "aria-pressed") === "true");
+    if (pressed.length > 1) problems.push(`palette: ${pressed.length} tools are aria-pressed at once`);
+  }
+  const zoom = facts.zoom;
+  if (!zoom) {
+    problems.push('zoom: no [data-chrome="zoom"]');
+  } else {
+    if (attribute(zoom, "role") !== "group") problems.push('zoom: the panel has no role="group"');
+    if (!attribute(zoom, "aria-label")) problems.push("zoom: the panel has no aria-label");
+    const shortcuts = expectedKeyShortcuts(facts.platform);
+    for (const button of ["out", "actual", "in", "fit"]) {
+      const control = facts.zoomButtons[button];
+      if (!control) {
+        problems.push(`zoom: no [data-zoom="${button}"] button`);
+        continue;
+      }
+      if (control.tag !== "button") problems.push(`zoom: [data-zoom="${button}"] is a <${control.tag}>`);
+      if (!name(control)) problems.push(`zoom: [data-zoom="${button}"] has no accessible name`);
+      if (attribute(control, "aria-keyshortcuts") !== shortcuts[button]) {
+        problems.push(
+          `zoom: [data-zoom="${button}"] aria-keyshortcuts is "${attribute(control, "aria-keyshortcuts") ?? ""}", expected "${shortcuts[button]}" (${facts.platform})`
+        );
+      }
+      if (control.disabled) {
+        problems.push(
+          `zoom: [data-zoom="${button}"] is natively disabled; aria-disabled keeps the focus (guide \xA75.8)`
+        );
+      }
+    }
+    const readout = facts.zoomButtons.actual;
+    if (readout) {
+      if (!/\d/.test(readout.text))
+        problems.push(`zoom: the readout shows "${readout.text}", expected a percentage`);
+      const label = normalize(attribute(readout, "aria-label") ?? "");
+      if (!label.includes(readout.text)) {
+        problems.push(
+          `zoom: the readout's aria-label "${label}" does not name the current zoom "${readout.text}"`
+        );
+      }
+      if (attribute(readout, "aria-disabled") === "true")
+        problems.push("zoom: the readout is never disabled");
+    }
+  }
+  const present = new Set(facts.order);
+  const expectedOrder = DOM_ORDER.filter((part) => present.has(part));
+  if (facts.order.join() !== expectedOrder.join()) {
+    problems.push(
+      `DOM order is ${facts.order.join(", ")}; expected ${expectedOrder.join(", ")} (guide \xA75.14)`
+    );
+  }
+  if (!present.has("canvas")) problems.push("canvas: no diagram-js <svg> (.djs-container > svg) in the root");
+  const canvas = facts.canvas;
+  if (canvas && !normalize(attribute(canvas, "aria-label") ?? "") && !attribute(canvas, "aria-labelledby")) {
+    problems.push(
+      'canvas: the focusable <svg> has no accessible name (WCAG 4.1.2); shellModule names it role="application" with messages.canvas'
+    );
+  }
+  for (const element of facts.positiveTabindex)
+    problems.push(`positive tabindex on ${element} (guide \xA75.14)`);
+  for (const element of facts.titled) {
+    problems.push(`${element} has a native title; the chrome tooltip replaces it (guide \xA75.6)`);
+  }
+  return problems;
+}
+function optionalIslandProblems(facts, shown) {
+  const problems = [];
+  if (shown.has("problems")) {
+    const pill = facts.problems;
+    if (!pill?.visible) {
+      problems.push("problems: the pill is not visible after show.problems");
+    } else {
+      if (pill.tag !== "button") problems.push(`problems: the pill is a <${pill.tag}>, expected a <button>`);
+      const label = normalize(attribute(pill, "aria-label") ?? "");
+      if (!label) problems.push("problems: the pill has no aria-label (count and errors)");
+      else if (!label.includes(pill.text)) {
+        problems.push(`problems: the aria-label "${label}" does not contain the visible text "${pill.text}"`);
+      }
+    }
+  }
+  if (shown.has("status")) {
+    const status = facts.status;
+    if (!status?.visible) {
+      problems.push("status: the status box is not visible after show.status");
+    } else {
+      const role = attribute(status, "role");
+      const severity = attribute(status, "data-severity");
+      const expected = severity === "danger" ? "alert" : "status";
+      if (role !== expected) {
+        problems.push(
+          `status: role is "${role ?? ""}" for data-severity="${severity ?? ""}", expected "${expected}"`
+        );
+      }
+    }
+  }
+  if (shown.has("legend")) {
+    const legend = facts.legend;
+    if (!legend?.visible) {
+      problems.push("legend: the legend is not visible after show.legend");
+    } else {
+      if (!facts.legendTitle)
+        problems.push("legend: the card is not labelled by its title (aria-labelledby)");
+      if (!facts.legendClose || !attribute(facts.legendClose, "aria-label")) {
+        problems.push("legend: the close button has no aria-label");
+      }
+    }
+  }
+  if (shown.has("inspector")) {
+    const inspector = facts.inspector;
+    if (!inspector?.visible) {
+      problems.push("inspector: the inspector is not visible after show.inspector");
+    } else {
+      if (inspector.tag !== "aside") problems.push(`inspector: a <${inspector.tag}>, expected an <aside>`);
+      if (!attribute(inspector, "aria-label")) problems.push("inspector: the <aside> has no aria-label");
+    }
+  }
+  return problems;
+}
+function tabSequenceProblems(stops) {
+  const [first, second, third] = stops;
+  const sequence = first?.kind === "primary" ? [second, third] : [first, second];
+  const [palette, canvas] = sequence;
+  const problems = [];
+  if (palette?.kind !== "palette") {
+    problems.push(
+      `tab order: Tab from the menu trigger lands on ${palette?.description ?? "nothing"}, expected the palette's roving entry (guide \xA75.14)`
+    );
+  } else if (canvas?.kind !== "canvas") {
+    problems.push(
+      `tab order: Tab from the palette lands on ${canvas?.description ?? "nothing"}, expected the canvas <svg> (an unexpected tab stop, guide \xA75.14)`
+    );
+  }
+  return problems;
+}
+function paletteShortcutProblems(entries) {
+  return entries.filter((entry) => entry.chip && !entry.keyShortcuts).map(
+    (entry) => `palette: entry "${entry.action}" shows the shortcut "${entry.chip}" in its tooltip but has no aria-keyshortcuts (guide \xA75.6)`
+  );
+}
+function menuKeysAtDocumentProblems(pressed, documentKeys) {
+  const reached = new Set(documentKeys.map((key) => key.key));
+  return pressed.filter((key) => reached.has(key)).map(
+    (key) => `menu: ${key} in the open menu reached a keydown listener on document; a modeler's document keyboard acts on it (stop it at the menu, guide \xA75.4)`
+  );
+}
+function menuOpenProblems(facts, focus) {
+  const problems = [];
+  if (facts.expanded !== "true") {
+    problems.push(`menu: aria-expanded is "${facts.expanded ?? ""}" while open, expected "true"`);
+  }
+  const menu = facts.menu;
+  if (!menu) return [...problems, 'menu: no visible role="menu" after opening'];
+  if (!attribute(menu, "aria-label")) problems.push("menu: the dropdown has no aria-label");
+  if (facts.controls && attribute(menu, "id") !== facts.controls) {
+    problems.push(
+      `menu: the visible dropdown is #${attribute(menu, "id") ?? ""}, the trigger controls #${facts.controls}`
+    );
+  }
+  if (facts.items.length === 0) problems.push("menu: the dropdown has no menuitem");
+  facts.items.forEach((item, index) => {
+    const label = item.name || `item ${index + 1}`;
+    if (!item.name) problems.push(`menu: ${label} has no accessible name`);
+    if (item.role !== "menuitem" && item.checked !== "true" && item.checked !== "false") {
+      problems.push(`menu: "${label}" (${item.role}) has aria-checked "${item.checked ?? ""}"`);
+    }
+    if (item.role === "menuitemradio" && !item.group) {
+      problems.push(`menu: radio "${label}" is not in a labelled role="group"`);
+    }
+    if (item.haspopup === "dialog" && !item.name.endsWith("\u2026")) {
+      problems.push(`menu: "${label}" opens a dialog, so its label ends with "\u2026" (U+2026)`);
+    }
+  });
+  if (focus && facts.items.length > 0) {
+    const expected = focus === "first" ? 0 : facts.items.length - 1;
+    if (facts.active !== expected) {
+      problems.push(
+        `menu: focus is on ${facts.active < 0 ? "no entry" : `entry ${facts.active + 1}`}, expected the ${focus} entry`
+      );
+    }
+  }
+  return problems;
+}
+function menuClosedProblems(facts, focusOnTrigger) {
+  const problems = [];
+  if (facts.expanded !== "false")
+    problems.push(`menu: aria-expanded is "${facts.expanded ?? ""}" after closing`);
+  if (facts.menu) problems.push("menu: the dropdown is still visible after Escape");
+  if (focusOnTrigger && !facts.activeIsTrigger)
+    problems.push("menu: Escape did not return the focus to the trigger");
+  return problems;
+}
+function keyReachProblem(press, reach, host, seen) {
+  const shouldPrevent = reach === "handled" || reach === "canvas";
+  if (host === "ide" && reach !== "free") {
+    if (seen.keys.length > 0) {
+      return `${press} reached a keydown listener on window; in the IDE host the shell stops it on document, or VS Code runs it again (guide \xA713.5)`;
+    }
+    const atDocument = seen.documentKeys ?? [];
+    const prevented2 = atDocument.length === 1 ? atDocument[0]?.defaultPrevented : void 0;
+    if (prevented2 === true && !shouldPrevent) {
+      return `${press} was prevented; the shell only stops it, so the field, dialog or browser still acts (guide \xA713.5)`;
+    }
+    if (prevented2 === false && shouldPrevent) {
+      return `${press} was stopped but not prevented; a handled key also calls preventDefault`;
+    }
+    return void 0;
+  }
+  if (seen.keys.length === 0) {
+    return host === "ide" ? `${press} never reached window; keys the webview does not handle must go on to VS Code (guide \xA713.5)` : `${press} never reached window; outside the IDE host the shell never stops propagation`;
+  }
+  if (seen.keys.length > 1) return `${press} reached window ${seen.keys.length} times`;
+  const prevented = seen.keys[0]?.defaultPrevented ?? false;
+  if (prevented && !shouldPrevent) {
+    return `${press} arrived prevented; ${reach === "free" ? "nothing may handle it" : "the browser, the field or the dialog must act"}`;
+  }
+  if (!prevented && shouldPrevent) {
+    return `${press} arrived unprevented; a handled key calls preventDefault (the browser would zoom the page)`;
+  }
+  return void 0;
+}
+function expectedAppearance(requested, themes) {
+  const fallback = themes[0];
+  if (fallback === void 0) throw new Error("@miragon/modeler-shell conformance: harness.themes is empty");
+  const theme = themes.includes(requested.theme) ? requested.theme : fallback;
+  return requested.kontrast ? { theme, kontrast: requested.kontrast } : { theme };
+}
+var describeAppearance = (appearance) => appearance.kontrast ? `${appearance.theme} + ${appearance.kontrast}` : appearance.theme;
+function expectedEmbeddedAppearance(facts, themes) {
+  const fallback = themes[0];
+  if (fallback === void 0) throw new Error("@miragon/modeler-shell conformance: harness.themes is empty");
+  const host = facts.themed.filter((element) => element.relation === "ancestor").at(-1);
+  return host?.kontrast === "hoch" ? { theme: fallback, kontrast: "hoch" } : { theme: fallback };
+}
+function appearanceProblems(facts, host, requested, themes) {
+  const ownDocument = host !== "embedded";
+  const expected = ownDocument ? expectedAppearance(requested, themes) : expectedEmbeddedAppearance(facts, themes);
+  const problems = [];
+  const label = ownDocument ? `requested ${describeAppearance(requested)}, expected ${describeAppearance(expected)}` : `host page ${describeAppearance(requested)}, expected ${describeAppearance(expected)}`;
+  const carrier = ownDocument ? facts.themed.find((element) => element.isDocument && element.theme !== null) : facts.themed.find((element) => element.relation === "self" && element.theme !== null);
+  if (!carrier) {
+    problems.push(
+      ownDocument ? `<html> has no data-cd-theme (${label}); the host always writes it, also "light" (guide \xA713.3)` : `the embedded root has no data-cd-theme (${label}): it takes the host page's mode instead of its own (guide \xA713.3)`
+    );
+  } else {
+    if (carrier.theme !== expected.theme) {
+      problems.push(`${carrier.description} has data-cd-theme="${carrier.theme}" (${label})`);
+    }
+    if ((carrier.kontrast ?? void 0) !== expected.kontrast) {
+      problems.push(
+        `${carrier.description} has ${carrier.kontrast ? `data-cd-kontrast="${carrier.kontrast}"` : "no data-cd-kontrast"} (${label})`
+      );
+    }
+  }
+  for (const element of facts.themed) {
+    if (element === carrier) continue;
+    const stray = ownDocument ? !element.isDocument || element.theme === null : element.relation === "descendant" || element.relation === "self";
+    if (!stray) continue;
+    const values = [
+      element.theme !== null ? `data-cd-theme="${element.theme}"` : "",
+      element.kontrast !== null ? `data-cd-kontrast="${element.kontrast}"` : ""
+    ].filter(Boolean).join(" ");
+    const sameMode = carrier !== void 0 && element.theme === carrier.theme && element.kontrast === carrier.kontrast;
+    problems.push(
+      element.theme === null ? `${element.description} carries ${values} without data-cd-theme on the same element (guide \xA713.3)` : sameMode ? `${element.description} repeats ${values}: in an own document the attributes stand only on <html> (guide \xA713.5)` : `${element.description} carries ${values}: a second mode inside the modeler is half-dark (guide \xA713.5)`
+    );
+  }
+  if (ownDocument && !facts.documentClasses.includes("cd-shell-document")) {
+    problems.push(
+      "<html> lacks cd-shell-document in an own document (the reset of the webview's host styles)"
+    );
+  }
+  if (!ownDocument && facts.documentClasses.includes("cd-shell-document")) {
+    problems.push(
+      "<html> of a foreign page carries cd-shell-document: the own-document reset restyles the host page"
+    );
+  }
+  const reference = facts.parts[0];
+  if (reference && !reference.roles["--cd-ui-text"]) {
+    problems.push(
+      "--cd-ui-text is empty at the shell root: the vendored cd-tokens.generated.css is not loaded"
+    );
+  }
+  for (const part of facts.parts) {
+    const schemes = part.colorScheme.split(/\s+/);
+    const dark = schemes.includes("dark");
+    const light = schemes.includes("light");
+    if (expected.theme === "light" && (dark || carrier && !light)) {
+      problems.push(`${part.name}: color-scheme is "${part.colorScheme}" (${label})`);
+    }
+    if (expected.theme === "dark" && (!dark || light)) {
+      problems.push(`${part.name}: color-scheme is "${part.colorScheme}" (${label})`);
+    }
+    if (reference && part !== reference) {
+      for (const [role, value] of Object.entries(part.roles)) {
+        if (value !== reference.roles[role]) {
+          problems.push(
+            `${part.name}: ${role} resolves to "${value}", the root to "${reference.roles[role] ?? ""}" (half-dark)`
+          );
+        }
+      }
+    }
+  }
+  for (const required of ["dropdown", "tooltip"]) {
+    if (!facts.parts.some((part) => part.name === required)) {
+      problems.push(`${required}: not visible when the kit opened it, so its mode was not checked`);
+    }
+  }
+  return { problems };
+}
+var SHELL_ROOT_ATTRIBUTES = [
+  "data-cd-shell-host",
+  "data-palette",
+  "data-legend",
+  "data-inspector",
+  "data-problems",
+  "data-readonly"
+];
+var EMBEDDED_ROOT_ATTRIBUTES = ["data-cd-theme", "data-cd-kontrast"];
+var BENIGN_ERRORS = /ResizeObserver loop/;
+function leftoverProblems(facts, host) {
+  const problems = [];
+  for (const element of facts.classedElements) problems.push(`${element} is left after destroy`);
+  const ownDocument = host !== "embedded";
+  for (const name2 of facts.documentClasses) {
+    if (ownDocument && name2 === "cd-shell-document") continue;
+    problems.push(`<html> keeps the class ${name2} after destroy`);
+  }
+  for (const element of facts.chromeElements) problems.push(`${element} is left after destroy`);
+  for (const name2 of facts.rootClasses) problems.push(`the root keeps the class ${name2} after destroy`);
+  const written = ownDocument ? SHELL_ROOT_ATTRIBUTES : [...SHELL_ROOT_ATTRIBUTES, ...EMBEDDED_ROOT_ATTRIBUTES];
+  for (const name2 of facts.rootAttributes) {
+    if (written.includes(name2)) problems.push(`the root keeps ${name2} after destroy`);
+  }
+  for (const error of facts.errors) {
+    if (!BENIGN_ERRORS.test(error)) problems.push(`the page reported an error after destroy: ${error}`);
+  }
+  return problems;
+}
+function afterDestroyKeyProblem(press, recorded) {
+  if (recorded.length === 0)
+    return `${press} after destroy never reached window: a shell listener still stops it`;
+  if (recorded.some((key) => key.defaultPrevented)) {
+    return `${press} after destroy arrived prevented: a shell listener is still installed`;
+  }
+  return void 0;
+}
+var ABSENT_ISLANDS = ["legend", "inspector", "problems", "status"];
+function absentIslands(absent) {
+  return ABSENT_ISLANDS.filter((island) => absent?.includes(island));
+}
+function absentIslandProblems(visible, absent) {
+  return absentIslands(absent).filter((island) => visible.has(island)).map((island) => `${island}: visible, but harness.absent says the modeler has no ${island}`);
+}
+function harnessHookProblems(harness, hooks) {
+  return hooks.filter((hook) => harness.absent?.includes(hook) && harness.show?.[hook]).map((hook) => `harness: absent lists "${hook}", but show.${hook} is given`);
+}
+function surroundProblems(facts) {
+  if (!facts.container) return ["canvas surround: no .djs-container in the root to check"];
+  if (!facts.painted) {
+    return [
+      "canvas surround: nothing from .djs-container out to the root paints a background colour; the surround is var(--cd-ui-grund) (guide \xA710.1)"
+    ];
+  }
+  if (facts.painted.color === facts.grund) return [];
+  return [
+    `canvas surround: ${facts.painted.description} paints ${facts.painted.color}, but --cd-ui-grund resolves to ${facts.grund}; the surround follows the mode (guide \xA710.1)`
+  ];
+}
+function isToolEntry(entry) {
+  return entry.group === "tools" || entry.action.endsWith("-tool");
+}
+function paletteEntryState(entry) {
+  if (entry.disabled) return "aria-disabled";
+  if (entry.hovered) return entry.pressed ? "pressed and hovered" : "hovered";
+  return entry.pressed ? "pressed" : "at rest";
+}
+function paletteColorProblems(facts) {
+  const problems = [];
+  for (const entry of facts.entries) {
+    if (!isToolEntry(entry)) continue;
+    const [role, value] = entry.disabled ? ["--cd-ui-text-leise", facts.roles.textLeise] : entry.hovered ? ["--cd-ui-interaktion", facts.roles.interaktion] : ["--cd-ui-text", facts.roles.text];
+    const state = paletteEntryState(entry);
+    if (entry.color !== value) {
+      problems.push(
+        `palette: tool "${entry.action}" ${state} has color ${entry.color}, expected ${role} (${value}) (guide \xA75.5)`
+      );
+    }
+    if (entry.icon && entry.icon.color !== value) {
+      const icon = entry.icon.kind === "svg" ? "<svg> icon" : "::before icon";
+      problems.push(
+        `palette: the ${icon} of tool "${entry.action}" ${state} has color ${entry.icon.color}, expected ${role} (${value}); a renderer rule overrides the skin (guide \xA75.5)`
+      );
+    }
+  }
+  return problems;
+}
+var round2 = (value) => Math.round(value * 10) / 10;
+function createProblems(facts) {
+  const known = new Set(facts.before.map((shape2) => shape2.id));
+  const added = facts.after.filter((shape2) => !known.has(shape2.id));
+  const pressed = `Enter on palette entry "${facts.entry}"`;
+  if (added.length === 0) {
+    return [
+      `create: ${pressed} added no element; Enter on a creating entry places it in the centre of the free rectangle (guide \xA75.5)`
+    ];
+  }
+  if (added.length > 1) {
+    return [
+      `create: ${pressed} added ${added.length} elements (${added.map((shape2) => shape2.id).join(", ")}), expected exactly one`
+    ];
+  }
+  const [shape] = added;
+  const problems = [];
+  if (!shape.selected) problems.push(`create: the new element "${shape.id}" is not selected (guide \xA75.5)`);
+  if (!facts.canvas.focusInCanvas) {
+    problems.push(
+      `create: after ${pressed} the focus is on ${facts.canvas.focused}, expected the canvas (its <svg> or the label editor, guide \xA75.5)`
+    );
+  }
+  const centre = { x: shape.box.left + shape.box.width / 2, y: shape.box.top + shape.box.height / 2 };
+  const { free } = facts;
+  const tolerance = GEOMETRY_TOLERANCE_PX + 1e-6;
+  const inside = centre.x >= free.left - tolerance && centre.x <= free.right + tolerance && centre.y >= free.top - tolerance && centre.y <= free.bottom + tolerance;
+  if (!inside) {
+    problems.push(
+      `create: the new element "${shape.id}" is centred at (${round2(centre.x)}, ${round2(centre.y)})px, outside the free rectangle ${round2(free.left)}\u2013${round2(free.right)} \xD7 ${round2(free.top)}\u2013${round2(free.bottom)}px (guide \xA75.5, \xA75.9)`
+    );
+  }
+  return problems;
+}
+function readOnlyStateProblems(facts) {
+  const problems = [];
+  const after = `${INVALID_STATUS_DELAY_MS}ms after show.invalid`;
+  if (!facts.readOnly) problems.push(`read-only: the root has no data-readonly ${after}`);
+  const status = facts.status;
+  if (!status?.visible) {
+    problems.push(`read-only: the status box is not visible ${after} (guide \xA75.12)`);
+  } else if (status.attributes.role !== "alert") {
+    problems.push(
+      `read-only: the status box of an invalid file has role "${status.attributes.role ?? ""}", expected "alert" (guide \xA713.5)`
+    );
+  }
+  return problems;
+}
+var READ_ONLY_PALETTE_ACTIONS = ["lasso-tool", "hand-tool"];
+function readOnlyPaletteProblems(entries) {
+  return entries.flatMap((entry) => {
+    const staysActive = READ_ONLY_PALETTE_ACTIONS.includes(entry.action);
+    if (staysActive && entry.disabled) {
+      return [
+        `palette: "${entry.action}" is aria-disabled on the read-only canvas; Lasso and Hand stay active (guide \xA713.5)`
+      ];
+    }
+    if (!staysActive && !entry.disabled) {
+      return [`palette: "${entry.action}" is not aria-disabled on the read-only canvas (guide \xA713.5)`];
+    }
+    return [];
+  });
+}
+var LEGEND_MENU_ID = "legend";
+function readOnlyMenuProblems(before, after) {
+  const problems = [];
+  const key = (entry) => `${entry.menuId ?? ""}\0${entry.name}`;
+  const enabledBefore = new Set(before.filter((entry) => !entry.disabled).map(key));
+  for (const entry of after) {
+    if (!entry.disabled) continue;
+    if (entry.menuId === LEGEND_MENU_ID && entry.role === "menuitemcheckbox") {
+      problems.push(
+        "menu: the Legend toggle is aria-disabled on the read-only canvas; a view-only toggle stays usable (guide \xA713.5)"
+      );
+    } else if (entry.group !== "model" && enabledBefore.has(key(entry))) {
+      problems.push(
+        `menu: "${entry.name}" is aria-disabled on the read-only canvas; export and help stay usable (guide \xA713.5)`
+      );
+    }
+  }
+  return problems;
+}
+function lockedShapeProblems(facts) {
+  const problems = [];
+  const { before, after } = facts.dragged;
+  if (facts.contextPadEntries.length > 0) {
+    problems.push(
+      `read-only: selecting "${before.id}" shows the context pad (${facts.contextPadEntries.join(", ")}) (guide \xA713.5)`
+    );
+  }
+  if (!after) {
+    problems.push(`read-only: a 40px drag removed "${before.id}" from the canvas (guide \xA713.5)`);
+  } else if (after.transform !== before.transform || Math.abs(after.size.width - before.size.width) > 0.5 || Math.abs(after.size.height - before.size.height) > 0.5) {
+    problems.push(
+      `read-only: a 40px drag changed "${before.id}" (transform "${before.transform}" \u2192 "${after.transform}", ${round2(before.size.width)} \xD7 ${round2(before.size.height)} \u2192 ${round2(after.size.width)} \xD7 ${round2(after.size.height)}) (guide \xA713.5)`
+    );
+  }
+  if (facts.textFields.length > 0) {
+    problems.push(
+      `read-only: a double-click on "${before.id}" opens a text field (${facts.textFields.join(", ")}) (guide \xA713.5)`
+    );
+  }
+  for (const key of ["Delete", "Backspace"]) {
+    if (!facts.kept[key])
+      problems.push(`read-only: ${key} on the canvas deleted "${before.id}" (guide \xA713.5)`);
+  }
+  return problems;
+}
+
+// src/testing/cases.ts
+var DEFAULT_SIZES = [
+  { width: 1280, height: 900 },
+  { width: 720, height: 700 },
+  { width: 420, height: 700 }
+];
+var LIGHT = { theme: "light" };
+var SHOWN_ISLANDS = ["legend", "problems", "status", "inspector"];
+var LOCKED_DRAG_PX = 40;
+var CREATE_WAIT_MS = 1e3;
+var READ_ONLY_WAIT_MS = 1e3;
+var COLOR_WAIT_MS = 600;
+var POLL_MS = 50;
+var REQUESTED_APPEARANCES = [
+  { theme: "dark" },
+  { theme: "dark", kontrast: "hoch" },
+  { theme: "light", kontrast: "hoch" }
+];
+var HOVER_MARGIN_MS = 200;
+var PARK = { x: 1, y: 1 };
+var TEXT_FIELDS = [
+  ["input", "a text field"],
+  ["textarea", "a textarea"],
+  ["contenteditable", "an editable label"]
+];
+var UNDO_REDO_PRESSES = [
+  "Control+KeyZ",
+  "Meta+KeyZ",
+  "Control+Shift+KeyZ",
+  "Meta+Shift+KeyZ",
+  "Control+KeyY"
+];
+var ONE_STEP_UP = 135;
+var TWO_STEPS_UP = 182;
+var ZOOM_LIMIT_MAX = 400;
+var ZOOM_LIMIT_MIN = 20;
+function sizeLabel(size) {
+  return `${size.width} \xD7 ${size.height}`;
+}
+function appearanceLabel(appearance) {
+  return appearance.kontrast ? `${appearance.theme} + ${appearance.kontrast}` : appearance.theme;
+}
+function fail(caseName, host, problems) {
+  const unique = [...new Set(problems)];
+  throw new Error(
+    `@miragon/modeler-shell conformance: ${caseName} (${host} host)
+${unique.map((problem) => `- ${problem}`).join("\n")}`
+  );
+}
+function finish(caseName, host, problems, skipped) {
+  if (problems.length > 0) fail(caseName, host, problems);
+  const seen = /* @__PURE__ */ new Set();
+  const unique = [...skipped].filter((skip) => !seen.has(skip.reason) && seen.add(skip.reason));
+  return unique.length > 0 ? { skipped: unique } : void 0;
+}
+function assertHooksConsistent(caseName, harness, hooks) {
+  const problems = harnessHookProblems(harness, hooks);
+  if (problems.length > 0) fail(caseName, harness.host, problems);
+}
+function unfed(harness, hook) {
+  return !harness.show?.[hook] && !harness.absent?.includes(hook);
+}
+function missingHooks(harness, what) {
+  return SHOWN_ISLANDS.filter((island) => unfed(harness, island)).map((island) => ({
+    hook: island,
+    reason: `show.${island} is undefined: ${what} of the ${island} island not verified`
+  }));
+}
+async function pollUntil(page, read, done, timeoutMs) {
+  let value = await read();
+  for (let waited = 0; !done(value) && waited < timeoutMs; waited += POLL_MS) {
+    await page.waitForTimeout(POLL_MS);
+    value = await read();
+  }
+  return value;
+}
+function visibleIslands(facts) {
+  const islands = /* @__PURE__ */ new Set();
+  for (const island of SHOWN_ISLANDS) if (facts[island]?.visible) islands.add(island);
+  return islands;
+}
+async function hover(page, root, target) {
+  const anchor = await findTarget(page, root, target);
+  if (!anchor) return null;
+  await page.mouse.move(PARK.x, PARK.y);
+  await page.mouse.move(anchor.client.x, anchor.client.y);
+  await page.waitForTimeout(TOOLTIP_DELAY_MS + HOVER_MARGIN_MS);
+  await settle(page);
+  return anchor;
+}
+async function openMenuByClick(page, root) {
+  const trigger = await findTarget(page, root, "menu");
+  if (!trigger) return false;
+  await page.mouse.click(trigger.client.x, trigger.client.y);
+  await settle(page);
+  return true;
+}
+async function closeByEscape(page) {
+  await page.keyboard.press("Escape");
+  await settle(page);
+}
+async function popupGeometry(page, root, measurement) {
+  const problems = [];
+  if (!await openMenuByClick(page, root)) return ["dropdown: no visible menu trigger to open it"];
+  const dropdown = await findOverlay(page, root, "menu");
+  if (!dropdown) problems.push('dropdown: no visible role="menu" after clicking the trigger');
+  else problems.push(...dropdownProblems(dropdown.box, measurement.container));
+  await closeByEscape(page);
+  const rows = [
+    ["menu", "top"],
+    ["palette-entry", measurement.paletteRow === "second-row" ? "second-row" : "top"],
+    ["zoom-in", "bottom"]
+  ];
+  for (const [target, row] of rows) {
+    const anchor = await hover(page, root, target);
+    if (!anchor) {
+      problems.push(`tooltip: no visible ${target} to hover`);
+      continue;
+    }
+    const tooltip = await findOverlay(page, root, "tooltip");
+    if (!tooltip) {
+      problems.push(`tooltip: none visible ${TOOLTIP_DELAY_MS + HOVER_MARGIN_MS}ms after hovering ${target}`);
+      continue;
+    }
+    if (tooltip.count > 1) problems.push(`tooltip: ${tooltip.count} tooltips visible at once`);
+    if (anchor.label && !tooltip.text.startsWith(anchor.label)) {
+      problems.push(`tooltip: hovering ${target} ("${anchor.label}") shows "${tooltip.text}"`);
+    }
+    problems.push(
+      ...tooltipProblems(tooltip.box, anchor.box, row, measurement.container).map(
+        (problem) => `${problem} (on ${target})`
+      )
+    );
+  }
+  await page.mouse.move(PARK.x, PARK.y);
+  return problems;
+}
+var geometryCase = {
+  name: "geometry",
+  async run(page, harness) {
+    assertHooksConsistent("geometry", harness, SHOWN_ISLANDS);
+    const root = harness.root ?? DEFAULT_ROOT;
+    const problems = [];
+    for (const size of harness.sizes ?? DEFAULT_SIZES) {
+      const at = sizeLabel(size);
+      await harness.open(page, { size, requested: LIGHT });
+      await settle(page);
+      const check = async (state) => {
+        const measurement = await measureChrome(page, root);
+        problems.push(
+          ...[
+            ...geometryProblems(measurement, harness.host),
+            ...absentIslandProblems(new Set(Object.keys(measurement.islands)), harness.absent)
+          ].map((problem) => `[${at}, ${state}] ${problem}`)
+        );
+        return measurement;
+      };
+      const opened = await check("as opened");
+      problems.push(...(await popupGeometry(page, root, opened)).map((problem) => `[${at}] ${problem}`));
+      for (const island of SHOWN_ISLANDS) {
+        const show = harness.show?.[island];
+        if (!show) continue;
+        await show(page);
+        await settle(page);
+        await check(`after show.${island}`);
+      }
+    }
+    return finish("geometry", harness.host, problems, missingHooks(harness, "the geometry"));
+  }
+};
+async function menuState(page, root) {
+  const facts = await inPage(page, menuProbe, { root });
+  if (!facts) throw new Error(`@miragon/modeler-shell conformance: no element matches "${root}"`);
+  return facts;
+}
+async function menuKeyboardProblems(page, root) {
+  const problems = [];
+  const openWith = async (key, focus) => {
+    if (!await focusTarget(page, root, "menu")) {
+      problems.push("menu: the trigger cannot take focus");
+      return void 0;
+    }
+    await page.keyboard.press(key);
+    await settle(page);
+    const opened2 = await menuState(page, root);
+    problems.push(...menuOpenProblems(opened2, focus).map((problem) => `${key} on the trigger: ${problem}`));
+    return opened2;
+  };
+  const close = async (key) => {
+    await closeByEscape(page);
+    problems.push(
+      ...menuClosedProblems(await menuState(page, root), true).map(
+        (problem) => `${key}, then Escape: ${problem}`
+      )
+    );
+  };
+  const opened = await openWith("Enter", "first");
+  if (opened && opened.items.length > 1) {
+    const moves = [
+      ["ArrowUp", (count) => count - 1],
+      ["ArrowDown", () => 0],
+      ["End", (count) => count - 1],
+      ["Home", () => 0]
+    ];
+    await inPage(page, clearKeysProbe, null);
+    for (const [key, target] of moves) {
+      await page.keyboard.press(key);
+      const moved = await menuState(page, root);
+      const expected = target(moved.items.length);
+      if (moved.active !== expected) {
+        problems.push(
+          `menu: ${key} moves the focus to entry ${moved.active + 1}, expected entry ${expected + 1} of ${moved.items.length}`
+        );
+      }
+    }
+    const { documentKeys } = await inPage(page, afterPressProbe, { root });
+    problems.push(
+      ...menuKeysAtDocumentProblems(
+        moves.map(([key]) => key),
+        documentKeys
+      )
+    );
+  }
+  if (opened) await close("Enter");
+  if (await openWith("ArrowDown", "first")) await close("ArrowDown");
+  if (await openWith("ArrowUp", "last")) await close("ArrowUp");
+  return problems;
+}
+async function paletteKeyboardProblems(page, root) {
+  const before = await inPage(page, paletteFocusProbe, { root });
+  if (!before || before.entries.length < 2) return [];
+  if (!await focusTarget(page, root, "palette-tab-stop")) {
+    return ['palette: no entry with tabindex="0" takes the focus'];
+  }
+  const problems = [];
+  const start = before.entries.indexOf(before.tabStops[0] ?? "");
+  const step = start < before.entries.length - 1 ? 1 : -1;
+  const moves = [
+    [step === 1 ? "ArrowRight" : "ArrowLeft", start + step],
+    ["End", before.entries.length - 1],
+    ["Home", 0]
+  ];
+  for (const [key, index] of moves) {
+    await page.keyboard.press(key);
+    const after = await inPage(page, paletteFocusProbe, { root });
+    const expected = before.entries[index];
+    if (!after || after.active !== expected) {
+      problems.push(`palette: ${key} focuses "${after?.active ?? "nothing"}", expected "${expected}"`);
+    } else if (after.tabStops.length !== 1 || after.tabStops[0] !== expected) {
+      problems.push(
+        `palette: after ${key} tabindex="0" is on ${after.tabStops.join(", ") || "no entry"}, expected "${expected}"`
+      );
+    }
+  }
+  return problems;
+}
+async function paletteShortcutWalk(page, root) {
+  const before = await inPage(page, paletteFocusProbe, { root });
+  if (!before || before.entries.length === 0) return [];
+  if (!await focusTarget(page, root, "palette-tab-stop")) return [];
+  if (before.entries.length > 1) await page.keyboard.press("End");
+  await page.keyboard.press("Home");
+  const seen = [];
+  for (let index = 0; index < before.entries.length; index++) {
+    const facts = await inPage(page, paletteShortcutProbe, { root });
+    if (facts) seen.push(facts);
+    await page.keyboard.press("ArrowRight");
+  }
+  return paletteShortcutProblems(seen);
+}
+async function tabSequenceFromMenu(page, root) {
+  if (!await focusTarget(page, root, "menu")) return [];
+  const stops = [];
+  for (let step = 0; step < 3; step++) {
+    await page.keyboard.press("Tab");
+    const stop = await inPage(page, activeStopProbe, { root });
+    stops.push({ description: stop.description, kind: stop.kind });
+  }
+  return tabSequenceProblems(stops);
+}
+async function zoomLimitProblems(page, root) {
+  const problems = [];
+  const limits = [
+    ["in", "zoom-in", ZOOM_LIMIT_MAX, 12, "out"],
+    ["out", "zoom-out", ZOOM_LIMIT_MIN, 16, "in"]
+  ];
+  for (const [button, target, limit, maxClicks, other] of limits) {
+    const control = await findTarget(page, root, target);
+    if (!control) continue;
+    let buttons = await inPage(page, zoomButtonsProbe, { root });
+    for (let click = 0; click < maxClicks && buttons[button]?.attributes["aria-disabled"] !== "true"; click++) {
+      await page.mouse.click(control.client.x, control.client.y);
+      await settle(page);
+      buttons = await inPage(page, zoomButtonsProbe, { root });
+    }
+    const { zoom } = await inPage(page, afterPressProbe, { root });
+    const reached = buttons[button];
+    if (reached?.attributes["aria-disabled"] !== "true") {
+      problems.push(
+        `zoom: [data-zoom="${button}"] is not aria-disabled after ${maxClicks} clicks (readout ${zoom ?? "?"}%)`
+      );
+    } else {
+      if (zoom !== limit) {
+        problems.push(`zoom: [data-zoom="${button}"] is disabled at ${zoom ?? "?"}%, expected at ${limit}%`);
+      }
+      if (reached.disabled) problems.push(`zoom: [data-zoom="${button}"] is natively disabled at the limit`);
+    }
+    if (buttons[other]?.attributes["aria-disabled"] === "true") {
+      problems.push(`zoom: [data-zoom="${other}"] is aria-disabled at ${zoom ?? "?"}%`);
+    }
+    if (buttons.actual?.attributes["aria-disabled"] === "true") {
+      problems.push("zoom: the readout is disabled at a limit");
+    }
+  }
+  await page.mouse.move(PARK.x, PARK.y);
+  return problems;
+}
+var ariaCase = {
+  name: "aria",
+  async run(page, harness) {
+    assertHooksConsistent("aria", harness, SHOWN_ISLANDS);
+    const root = harness.root ?? DEFAULT_ROOT;
+    const size = (harness.sizes ?? DEFAULT_SIZES)[0] ?? DEFAULT_SIZES[0];
+    await harness.open(page, { size, requested: LIGHT });
+    await settle(page);
+    const facts = await inPage(page, ariaProbe, { root });
+    if (!facts) fail("aria", harness.host, [`no element matches the shell root selector "${root}"`]);
+    const problems = ariaProblems(facts, harness.host);
+    problems.push(...await menuKeyboardProblems(page, root));
+    problems.push(...await paletteKeyboardProblems(page, root));
+    problems.push(...await paletteShortcutWalk(page, root));
+    problems.push(...await tabSequenceFromMenu(page, root));
+    problems.push(...await zoomLimitProblems(page, root));
+    const shown = /* @__PURE__ */ new Set();
+    for (const island of SHOWN_ISLANDS) {
+      const show = harness.show?.[island];
+      if (!show) continue;
+      await show(page);
+      shown.add(island);
+    }
+    let final = facts;
+    if (shown.size > 0) {
+      await settle(page);
+      const withIslands = await inPage(page, ariaProbe, { root });
+      if (withIslands) {
+        final = withIslands;
+        problems.push(...optionalIslandProblems(withIslands, shown));
+        const known = new Set(problems);
+        problems.push(
+          ...ariaProblems(withIslands, harness.host).filter((problem) => !known.has(problem)).map((problem) => `with every island shown: ${problem}`)
+        );
+      }
+    }
+    problems.push(...absentIslandProblems(visibleIslands(final), harness.absent));
+    return finish("aria", harness.host, problems, missingHooks(harness, "the roles and names"));
+  }
+};
+var keysCase = {
+  name: "keys",
+  async run(page, harness) {
+    const root = harness.root ?? DEFAULT_ROOT;
+    const host = harness.host;
+    const size = (harness.sizes ?? DEFAULT_SIZES)[0] ?? DEFAULT_SIZES[0];
+    await harness.open(page, { size, requested: LIGHT });
+    await settle(page);
+    const problems = [];
+    if (!await focusTarget(page, root, "canvas")) {
+      fail("keys", host, ["canvas: the diagram-js <svg> (.djs-container > svg) cannot take focus"]);
+    }
+    await inPage(page, clearKeysProbe, null);
+    let current = (await inPage(page, afterPressProbe, { root })).zoom;
+    if (current === null) fail("keys", host, ['zoom: no readout [data-zoom="actual"] showing a percentage']);
+    const press = async (key, reach, zoom, context = "on the canvas") => {
+      const before = current;
+      await page.keyboard.press(key);
+      let after = await inPage(page, afterPressProbe, { root });
+      const where = `${key} ${context}`;
+      if (reach) {
+        const problem = keyReachProblem(where, reach, host, after);
+        if (problem) problems.push(problem);
+      }
+      if (zoom === void 0) return;
+      const expected = zoom === "unchanged" ? before : zoom;
+      for (let poll = 0; after.zoom === before && expected !== before && poll < 10; poll++) {
+        await page.waitForTimeout(50);
+        after = await inPage(page, afterPressProbe, { root });
+      }
+      if (after.zoom !== expected) {
+        problems.push(
+          zoom === "unchanged" ? `${where} changed the zoom from ${before}% to ${after.zoom ?? "?"}%; it must not act` : `${where} zoomed to ${after.zoom ?? "?"}% from ${before}%, expected ${expected}% (exactly one step)`
+        );
+      }
+      current = after.zoom ?? current;
+    };
+    const inside = async (kind, context, steps) => {
+      if (await inPage(page, injectProbe, { root, kind })) await steps();
+      else problems.push(`cannot focus ${context} stand-in inside the root`);
+      await inPage(page, removeInjectedProbe, null);
+    };
+    await press("Control+Digit0", "handled", 100);
+    const pairs = [
+      ["Control+Equal", "Control+Minus"],
+      ["Control+Shift+Equal", "Control+Shift+Minus"],
+      ["Meta+Equal", "Meta+Minus"],
+      ["Meta+Shift+Equal", "Meta+Shift+Minus"],
+      ["Control+NumpadAdd", "Control+NumpadSubtract"],
+      ["Meta+NumpadAdd", "Meta+NumpadSubtract"]
+    ];
+    for (const [zoomIn, zoomOut] of pairs) {
+      await press(zoomIn, "handled", ONE_STEP_UP);
+      await press(zoomOut, "handled", 100);
+    }
+    for (const zoomToActual of ["Meta+Digit0", "Control+Numpad0"]) {
+      await press("Control+Equal", "handled", ONE_STEP_UP);
+      await press(zoomToActual, "handled", 100);
+    }
+    for (const key of ["Equal", "Minus", "Shift+Equal", "Shift+Minus", "NumpadAdd", "NumpadSubtract"]) {
+      await press(key, "free", "unchanged", "on the canvas without Cmd/Ctrl");
+    }
+    for (const key of ["Digit0", "Control+Alt+Equal", "Control+Alt+Minus", "Control+Shift+Digit1"]) {
+      await press(key, void 0, "unchanged");
+    }
+    await press("F1", "free", void 0);
+    await press("Escape", "free", void 0, "on the canvas without a menu or dialog");
+    if (await inPage(page, canvasHandlesProbe, { root, key: "F9" })) {
+      await press("F9", "canvas", void 0, "handled by the canvas");
+    }
+    await inPage(page, removeInjectedProbe, null);
+    if (host === "ide") {
+      for (const key of UNDO_REDO_PRESSES) {
+        await press(key, "free", void 0, "on the canvas (undo and redo belong to the VS Code document)");
+      }
+    }
+    for (const key of ["Control+KeyA", "Meta+KeyA"]) {
+      await press(key, "canvas", void 0, "on the canvas (select all acts on the canvas only)");
+    }
+    await press("Control+Equal", "handled", ONE_STEP_UP);
+    for (const [kind, field] of TEXT_FIELDS) {
+      await inside(kind, field, async () => {
+        await press("Control+Equal", "blocked", "unchanged", `in ${field}`);
+        await press("Control+Minus", "blocked", "unchanged", `in ${field}`);
+        await press("Shift+Digit1", "free", "unchanged", `in ${field}`);
+        await press("Control+KeyZ", "blocked", void 0, `in ${field}`);
+        await press("Meta+Shift+KeyZ", "blocked", void 0, `in ${field}`);
+        await press("Control+KeyY", "blocked", void 0, `in ${field}`);
+      });
+    }
+    await inside("modal", "a modal dialog", async () => {
+      await press("Control+Equal", "blocked", "unchanged", "with a modal dialog open");
+      await press("Shift+Digit1", "free", "unchanged", "with a modal dialog open");
+      await press("Escape", "blocked", void 0, "with a modal dialog open");
+    });
+    await inside("popover", "a popover", async () => {
+      await press("Control+Minus", "handled", 100, "in a popover");
+      await press("Control+Equal", "handled", ONE_STEP_UP, "in a popover");
+      await press("Escape", "blocked", void 0, "with a popover open");
+    });
+    if (await openMenuByClick(page, root)) {
+      await inPage(page, clearKeysProbe, null);
+      await press("Escape", "handled", void 0, "with the menu open");
+      if (await findOverlay(page, root, "menu")) problems.push("Escape with the menu open did not close it");
+    }
+    await focusTarget(page, root, "canvas");
+    await press("Control+Equal", "handled", TWO_STEPS_UP);
+    await page.keyboard.press("Shift+Digit1");
+    let fitted = await inPage(page, afterPressProbe, { root });
+    const reachProblem = keyReachProblem("Shift+Digit1 on the canvas", "handled", host, fitted);
+    if (reachProblem) problems.push(reachProblem);
+    for (let poll = 0; (fitted.zoom === null || fitted.zoom > 100) && poll < 20; poll++) {
+      await page.waitForTimeout(50);
+      fitted = await inPage(page, afterPressProbe, { root });
+    }
+    if (fitted.zoom === null || fitted.zoom > 100) {
+      problems.push(
+        `Shift+Digit1 on the canvas left the zoom at ${fitted.zoom ?? "?"}%, expected a fit (at most 100%)`
+      );
+    }
+    return finish("keys", host, problems, []);
+  }
+};
+async function appearanceFacts(page, root) {
+  const probe = () => inPage(page, appearanceProbe, { root, roles: MODE_ROLES });
+  await hover(page, root, "zoom-in");
+  const withTooltip = await probe();
+  const opened = await openMenuByClick(page, root);
+  const withMenu = await probe();
+  if (opened) await closeByEscape(page);
+  await page.mouse.move(PARK.x, PARK.y);
+  if (!withTooltip || !withMenu) return withTooltip ?? withMenu;
+  const names = new Set(withTooltip.parts.map((part) => part.name));
+  return {
+    ...withMenu,
+    parts: [...withTooltip.parts, ...withMenu.parts.filter((part) => !names.has(part.name))]
+  };
+}
+async function paletteColors(page, root) {
+  const read = async () => {
+    const facts = await inPage(page, paletteColorProbe, { root });
+    return facts ? paletteColorProblems(facts) : [];
+  };
+  return pollUntil(page, read, (problems) => problems.length === 0, COLOR_WAIT_MS);
+}
+async function paletteColorWalk(page, root) {
+  const problems = [];
+  await page.mouse.move(PARK.x, PARK.y);
+  problems.push(...await paletteColors(page, root));
+  const tools = (await inPage(page, paletteEntriesProbe, { root })).filter(
+    (entry) => isToolEntry(entry) && !entry.disabled
+  );
+  for (const tool of tools) {
+    await page.mouse.move(tool.client.x, tool.client.y);
+    problems.push(...await paletteColors(page, root));
+    await page.mouse.move(PARK.x, PARK.y);
+  }
+  const armed = tools.find((tool) => tool.action === "lasso-tool") ?? tools.find((tool) => tool.action.endsWith("-tool"));
+  if (armed) {
+    await page.mouse.click(armed.client.x, armed.client.y);
+    await settle(page);
+    const pressed = (await inPage(page, paletteEntriesProbe, { root })).find(
+      (entry) => entry.action === armed.action
+    );
+    if (!pressed?.pressed) {
+      problems.push(`palette: clicking tool "${armed.action}" does not set aria-pressed="true" (guide \xA75.5)`);
+    }
+    problems.push(...await paletteColors(page, root));
+    await page.mouse.move(PARK.x, PARK.y);
+    problems.push(...await paletteColors(page, root));
+    await closeByEscape(page);
+  }
+  return [...new Set(problems)];
+}
+var appearanceCase = {
+  name: "appearance",
+  async run(page, harness) {
+    const root = harness.root ?? DEFAULT_ROOT;
+    const size = (harness.sizes ?? DEFAULT_SIZES)[0] ?? DEFAULT_SIZES[0];
+    const problems = [];
+    for (const requested of REQUESTED_APPEARANCES) {
+      const at = `[requested ${appearanceLabel(requested)}]`;
+      await harness.open(page, { size, requested });
+      if (harness.host === "embedded") {
+        await inPage(page, hostPageModeProbe, {
+          theme: requested.theme,
+          kontrast: requested.kontrast ?? null
+        });
+      }
+      await settle(page);
+      const facts = await appearanceFacts(page, root);
+      if (!facts) {
+        problems.push(`${at} no element matches the shell root selector "${root}"`);
+        continue;
+      }
+      const verdict = appearanceProblems(facts, harness.host, requested, harness.themes);
+      problems.push(...verdict.problems.map((problem) => `${at} ${problem}`));
+      const surround = await inPage(page, surroundProbe, { root });
+      if (surround) problems.push(...surroundProblems(surround).map((problem) => `${at} ${problem}`));
+      problems.push(...(await paletteColorWalk(page, root)).map((problem) => `${at} ${problem}`));
+    }
+    return finish("appearance", harness.host, problems, []);
+  }
+};
+function shapes(page, root) {
+  return inPage(page, shapesProbe, { root });
+}
+async function focusPaletteEntry(page, root, action) {
+  const before = await inPage(page, paletteFocusProbe, { root });
+  if (!before || !before.entries.includes(action)) return false;
+  if (!await focusTarget(page, root, "palette-tab-stop")) return false;
+  await page.keyboard.press("Home");
+  for (let step = 0; step <= before.entries.length; step++) {
+    if ((await inPage(page, paletteFocusProbe, { root }))?.active === action) return true;
+    await page.keyboard.press("ArrowRight");
+  }
+  return false;
+}
+function firstCreatingEntry(entries) {
+  return entries.find((entry) => !isToolEntry(entry));
+}
+async function enterOnEntry(page, root, entry, before) {
+  if (!await focusPaletteEntry(page, root, entry)) return void 0;
+  await page.keyboard.press("Enter");
+  await settle(page);
+  const known = new Set(before.map((shape) => shape.id));
+  return pollUntil(
+    page,
+    () => shapes(page, root),
+    (after) => after.some((shape) => !known.has(shape.id)),
+    CREATE_WAIT_MS
+  );
+}
+var createCase = {
+  name: "create",
+  async run(page, harness) {
+    const root = harness.root ?? DEFAULT_ROOT;
+    const size = (harness.sizes ?? DEFAULT_SIZES)[0] ?? DEFAULT_SIZES[0];
+    await harness.open(page, { size, requested: LIGHT });
+    await settle(page);
+    const entry = firstCreatingEntry(await inPage(page, paletteEntriesProbe, { root }));
+    if (!entry) return void 0;
+    await page.mouse.move(PARK.x, PARK.y);
+    const free = freeRectangle(await measureChrome(page, root), harness.host);
+    const before = await shapes(page, root);
+    const after = await enterOnEntry(page, root, entry.action, before);
+    if (!after) {
+      fail("create", harness.host, [`create: the palette's roving focus does not reach "${entry.action}"`]);
+    }
+    const canvas = await inPage(page, canvasStateProbe, { root });
+    const problems = createProblems({ entry: entry.action, before, after, canvas, free });
+    await closeByEscape(page);
+    return finish("create", harness.host, problems, []);
+  }
+};
+async function menuEntries(page, root) {
+  if (!await openMenuByClick(page, root)) return [];
+  const entries = await inPage(page, menuEntriesProbe, { root }) ?? [];
+  await closeByEscape(page);
+  return entries;
+}
+async function reachableShape(page, root, id) {
+  const all = await shapes(page, root);
+  return id === void 0 ? all.find((shape) => shape.hit) : all.find((shape) => shape.id === id);
+}
+async function lockedShapeChecks(page, root, shape) {
+  await page.mouse.click(shape.client.x, shape.client.y);
+  await settle(page);
+  const selected = await inPage(page, canvasStateProbe, { root });
+  const before = await reachableShape(page, root, shape.id) ?? shape;
+  await page.mouse.move(before.client.x, before.client.y);
+  await page.mouse.down();
+  for (let step = 1; step <= 4; step++) {
+    await page.mouse.move(before.client.x + LOCKED_DRAG_PX * step / 4, before.client.y);
+  }
+  await page.mouse.up();
+  await settle(page);
+  const dragged = await reachableShape(page, root, shape.id);
+  const target = dragged ?? before;
+  await page.mouse.dblclick(target.client.x, target.client.y);
+  await settle(page);
+  const { textFields } = await inPage(page, canvasStateProbe, { root });
+  await closeByEscape(page);
+  const kept = { Delete: true, Backspace: true };
+  for (const key of ["Delete", "Backspace"]) {
+    const current = await reachableShape(page, root, shape.id);
+    if (!current) break;
+    if (!current.selected) await page.mouse.click(current.client.x, current.client.y);
+    await focusTarget(page, root, "canvas");
+    await page.keyboard.press(key);
+    await settle(page);
+    kept[key] = await reachableShape(page, root, shape.id) !== void 0;
+  }
+  await page.mouse.move(PARK.x, PARK.y);
+  return lockedShapeProblems({
+    contextPadEntries: selected.contextPadEntries,
+    dragged: { before, after: dragged },
+    textFields,
+    kept
+  });
+}
+var readOnlyCase = {
+  name: "readOnly",
+  async run(page, harness) {
+    assertHooksConsistent("readOnly", harness, ["invalid"]);
+    const invalid = harness.show?.invalid;
+    if (!invalid) {
+      if (harness.absent?.includes("invalid")) return void 0;
+      return {
+        skipped: [
+          {
+            hook: "invalid",
+            reason: "show.invalid is undefined: the read-only canvas of an invalid file was not verified"
+          }
+        ]
+      };
+    }
+    const root = harness.root ?? DEFAULT_ROOT;
+    const size = (harness.sizes ?? DEFAULT_SIZES)[0] ?? DEFAULT_SIZES[0];
+    const problems = [];
+    const skipped = [];
+    await harness.open(page, { size, requested: LIGHT });
+    await settle(page);
+    const menuBefore = await menuEntries(page, root);
+    await invalid(page);
+    await page.waitForTimeout(INVALID_STATUS_DELAY_MS);
+    const state = await pollUntil(
+      page,
+      () => inPage(page, readOnlyStateProbe, { root }),
+      (facts) => facts === null || readOnlyStateProblems(facts).length === 0,
+      READ_ONLY_WAIT_MS
+    );
+    if (!state) fail("readOnly", harness.host, [`no element matches the shell root selector "${root}"`]);
+    await settle(page);
+    problems.push(...readOnlyStateProblems(state));
+    const entries = await inPage(page, paletteEntriesProbe, { root });
+    problems.push(...readOnlyPaletteProblems(entries));
+    problems.push(...await paletteColors(page, root));
+    const creating = firstCreatingEntry(entries);
+    if (creating) {
+      const before = await shapes(page, root);
+      const after = await enterOnEntry(page, root, creating.action, before);
+      const known = new Set(before.map((shape2) => shape2.id));
+      const added = (after ?? []).filter((shape2) => !known.has(shape2.id));
+      if (added.length > 0) {
+        problems.push(
+          `read-only: Enter on palette entry "${creating.action}" added ${added.map((shape2) => `"${shape2.id}"`).join(", ")} (guide \xA713.5)`
+        );
+      }
+      await closeByEscape(page);
+    }
+    problems.push(...readOnlyMenuProblems(menuBefore, await menuEntries(page, root)));
+    const shape = await reachableShape(page, root);
+    if (shape) {
+      problems.push(...await lockedShapeChecks(page, root, shape));
+    } else {
+      skipped.push({
+        hook: "open",
+        reason: "the opened document shows no shape a pointer reaches: context pad, move, delete and label editor of the read-only canvas not verified"
+      });
+    }
+    return finish("readOnly", harness.host, problems, skipped);
+  }
+};
+var cleanupCase = {
+  name: "cleanup",
+  async run(page, harness) {
+    if (!harness.destroy) {
+      return {
+        skipped: [
+          {
+            hook: "destroy",
+            reason: "harness.destroy is undefined: the cleanup after destroy was not verified"
+          }
+        ]
+      };
+    }
+    const root = harness.root ?? DEFAULT_ROOT;
+    const size = (harness.sizes ?? DEFAULT_SIZES)[0] ?? DEFAULT_SIZES[0];
+    await harness.open(page, { size, requested: LIGHT });
+    await settle(page);
+    const armed = await inPage(page, armCleanupProbe, { root });
+    if (!armed) fail("cleanup", harness.host, [`no element matches the shell root selector "${root}"`]);
+    const problems = [];
+    const zoomIn = await findTarget(page, root, "zoom-in");
+    if (zoomIn) {
+      await page.mouse.move(PARK.x, PARK.y);
+      await page.mouse.move(zoomIn.client.x, zoomIn.client.y);
+    }
+    try {
+      await harness.destroy(page);
+    } catch (error) {
+      problems.push(`destroy threw: ${error instanceof Error ? error.message : String(error)}`);
+    }
+    await page.waitForTimeout(Math.max(INVALID_STATUS_DELAY_MS, TOOLTIP_DELAY_MS) + HOVER_MARGIN_MS);
+    await page.mouse.move(PARK.x, PARK.y);
+    await page.setViewportSize({ width: size.width - 40, height: size.height - 40 });
+    await settle(page);
+    await inPage(page, injectProbe, { root, kind: "focus-target" });
+    await inPage(page, clearKeysProbe, null);
+    for (const key of ["Control+Equal", "Control+Minus", "Control+Digit0", "Shift+Digit1"]) {
+      await page.keyboard.press(key);
+      const { keys } = await inPage(page, afterPressProbe, { root });
+      const problem = afterDestroyKeyProblem(key, keys);
+      if (problem) problems.push(problem);
+    }
+    await inPage(page, removeInjectedProbe, null);
+    problems.push(...leftoverProblems(await inPage(page, leftoverProbe, null), harness.host));
+    return finish("cleanup", harness.host, problems, []);
+  }
+};
+function createCases() {
+  return [geometryCase, ariaCase, keysCase, createCase, readOnlyCase, appearanceCase, cleanupCase];
+}
+
+// src/testing/harness.ts
+function shellConformanceCases() {
+  return createCases();
+}
+function vsCodeStubSearch(requested, extra = {}) {
+  const query = new URLSearchParams({ theme: requested.theme });
+  if (requested.kontrast) query.set("kontrast", requested.kontrast);
+  if (extra.colorTheme) query.set("colorTheme", extra.colorTheme);
+  if (extra.reduceMotion) query.set("reduceMotion", "");
+  return query.toString();
+}
+function registerShellConformance(harness, test, options = {}) {
+  const onSkip = options.onSkip ?? ((caseName, skips) => {
+    console.warn(
+      `@miragon/modeler-shell conformance: SKIPPED "${caseName}" (${harness.host} host): ${skips.map((skip) => skip.reason).join("; ")}`
+    );
+  });
+  for (const conformanceCase of shellConformanceCases()) {
+    test(`shell conformance: ${conformanceCase.name}`, async ({ page }) => {
+      const outcome = await conformanceCase.run(page, harness);
+      if (outcome?.skipped && outcome.skipped.length > 0) onSkip(conformanceCase.name, outcome.skipped);
+    });
+  }
+}
+export {
+  GEOMETRY_TOLERANCE_PX,
+  expectedChromeBoxes,
+  measureChrome,
+  registerShellConformance,
+  shellConformanceCases,
+  vsCodeStubSearch
+};
+//# sourceMappingURL=testing.js.map