libretto 0.5.0 → 0.5.2

package/src/shared/dom-semantics.ts

@@ -0,0 +1,68 @@
+export const TEST_ATTRIBUTE_NAMES = [
+  "data-testid",
+  "data-test",
+  "data-qa",
+  "data-cy",
+] as const;
+
+export const TRUSTED_ATTRIBUTE_NAMES = [
+  "id",
+  "name",
+  "for",
+  "tabindex",
+  "contenteditable",
+  "role",
+  "title",
+  "alt",
+  "type",
+  "value",
+  "placeholder",
+  "autocomplete",
+  "href",
+  "action",
+  "method",
+  "src",
+] as const;
+
+export const INTERACTIVE_TAG_NAMES = [
+  "a",
+  "button",
+  "input",
+  "select",
+  "textarea",
+  "form",
+  "details",
+  "dialog",
+  "label",
+] as const;
+
+export const INTERACTIVE_ROLE_NAMES = [
+  "button",
+  "link",
+  "tab",
+  "menuitem",
+  "checkbox",
+  "radio",
+  "switch",
+  "slider",
+  "combobox",
+] as const;
+
+export function filterSemanticClasses(value: string): string {
+  const classes = value.split(/\s+/).filter(Boolean);
+  const kept = classes.filter((cls) => !isObfuscatedClass(cls));
+  return kept.join(" ");
+}
+
+export function isObfuscatedClass(cls: string): boolean {
+  if (cls.length > 80) return true;
+  if (/^_?[0-9a-f]{6,}$/i.test(cls)) return true;
+  if (/^[a-z]+_[0-9a-f]{4,}$/i.test(cls)) return true;
+  if (/^[a-z]{1,2}[0-9]{2,}$/i.test(cls)) return true;
+
+  const digits = (cls.match(/[0-9]/g) || []).length;
+  const letters = (cls.match(/[a-zA-Z]/g) || []).length;
+  if (cls.length >= 6 && digits >= letters * 0.5 && digits >= 2) return true;
+
+  return false;
+}

package/src/shared/instrumentation/errors.ts

@@ -8,75 +8,77 @@ import type { Page, Locator } from "playwright";
  * Best-effort: if any probe fails, we skip that check silently.
  */
 export async function enrichTimeoutError(
-	err: any,
-	locator: Locator,
-	page: Page,
+  err: any,
+  locator: Locator,
+  page: Page,
 ): Promise<void> {
-	const reasons: string[] = [];
+  const reasons: string[] = [];
 
-	try {
-		const visible = await locator.isVisible().catch(() => null);
-		if (visible === false) {
-			reasons.push("Element is not visible");
-		}
+  try {
+    const visible = await locator.isVisible().catch(() => null);
+    if (visible === false) {
+      reasons.push("Element is not visible");
+    }
 
-		// isInViewport is available in modern Playwright but may not exist in older versions
-		if (typeof (locator as any).isInViewport === "function") {
-			const inViewport = await (locator as any).isInViewport().catch(() => null);
-			if (inViewport === false) {
-				reasons.push("Element is outside of the viewport");
-			}
-		}
+    // isInViewport is available in modern Playwright but may not exist in older versions
+    if (typeof (locator as any).isInViewport === "function") {
+      const inViewport = await (locator as any)
+        .isInViewport()
+        .catch(() => null);
+      if (inViewport === false) {
+        reasons.push("Element is outside of the viewport");
+      }
+    }
 
-		const enabled = await locator.isEnabled().catch(() => null);
-		if (enabled === false) {
-			reasons.push("Element is not enabled (disabled)");
-		}
+    const enabled = await locator.isEnabled().catch(() => null);
+    if (enabled === false) {
+      reasons.push("Element is not enabled (disabled)");
+    }
 
-		// If the element appears visible and in viewport, check for intercepting elements
-		if (reasons.length === 0) {
-			const box = await locator.boundingBox().catch(() => null);
-			if (box) {
-				const centerX = box.x + box.width / 2;
-				const centerY = box.y + box.height / 2;
+    // If the element appears visible and in viewport, check for intercepting elements
+    if (reasons.length === 0) {
+      const box = await locator.boundingBox().catch(() => null);
+      if (box) {
+        const centerX = box.x + box.width / 2;
+        const centerY = box.y + box.height / 2;
 
-				const interceptInfo = await page
-					.evaluate(
-						({ x, y }) => {
-							const els = document.elementsFromPoint(x, y);
-							if (!els || els.length < 2) return null;
-							const topEl = els[0];
-							if (!topEl) return null;
+        const interceptInfo = await page
+          .evaluate(
+            ({ x, y }) => {
+              const els = document.elementsFromPoint(x, y);
+              if (!els || els.length < 2) return null;
+              const topEl = els[0];
+              if (!topEl) return null;
 
-							// Build a brief preview of the intercepting element
-							const tag = topEl.tagName.toLowerCase();
-							const id = topEl.id ? `#${topEl.id}` : "";
-							const cls = topEl.className
-								? `.${String(topEl.className).split(/\s+/).slice(0, 2).join(".")}`
-								: "";
-							const text = (topEl.textContent || "").trim().slice(0, 40);
-							return {
-								tag,
-								preview: `<${tag}${id}${cls}>${text ? ` "${text}"` : ""}`,
-							};
-						},
-						{ x: centerX, y: centerY },
-					)
-					.catch(() => null);
+              // Build a brief preview of the intercepting element
+              const tag = topEl.tagName.toLowerCase();
+              const id = topEl.id ? `#${topEl.id}` : "";
+              const cls = topEl.className
+                ? `.${String(topEl.className).split(/\s+/).slice(0, 2).join(".")}`
+                : "";
+              const text = (topEl.textContent || "").trim().slice(0, 40);
+              return {
+                tag,
+                preview: `<${tag}${id}${cls}>${text ? ` "${text}"` : ""}`,
+              };
+            },
+            { x: centerX, y: centerY },
+          )
+          .catch(() => null);
 
-				if (interceptInfo) {
-					reasons.push(
-						`Element may be intercepted by ${interceptInfo.preview}`,
-					);
-				}
-			}
-		}
-	} catch {
-		// All enrichment is best-effort
-	}
+        if (interceptInfo) {
+          reasons.push(
+            `Element may be intercepted by ${interceptInfo.preview}`,
+          );
+        }
+      }
+    }
+  } catch {
+    // All enrichment is best-effort
+  }
 
-	if (reasons.length > 0) {
-		const enrichment = `\n[libretto diagnostics] ${reasons.join("; ")}`;
-		err.message = (err.message || "") + enrichment;
-	}
+  if (reasons.length > 0) {
+    const enrichment = `\n[libretto diagnostics] ${reasons.join("; ")}`;
+    err.message = (err.message || "") + enrichment;
+  }
 }

package/src/shared/instrumentation/index.ts

@@ -1,9 +1,9 @@
 export {
-	instrumentPage,
-	installInstrumentation,
-	instrumentContext,
-	type InstrumentationOptions,
-	type InstrumentedPage,
+  instrumentPage,
+  installInstrumentation,
+  instrumentContext,
+  type InstrumentationOptions,
+  type InstrumentedPage,
 } from "./instrument.js";
 
 export { enrichTimeoutError } from "./errors.js";