@letsrunit/playwright 0.4.1 → 0.5.0

package/README.md

@@ -1,4 +1,6 @@
-# Playwright Package (`@letsrunit/playwright`)
+![letsrunit](https://cdn.jsdelivr.net/gh/letsrunit-hq/letsrunit@main/docs/.gitbook/assets/logo-light.svg)
+
+# Playwright functions
 
 ## Installation
 

package/dist/index.js

@@ -226,7 +226,8 @@ async function elementKind(target) {
 // src/field/calendar.ts
 async function getDialog(root, options) {
   const role = await root.getAttribute("role", options).catch(() => null);
-  if (role !== "combobox") return null;
+  const hasPopup = await root.getAttribute("aria-haspopup", options).catch(() => null);
+  if (role !== "combobox" && !hasPopup) return null;
   const ariaControls = await root.getAttribute("aria-controls", options).catch(() => null);
   if (!ariaControls) return null;
   const calendar = root.page().locator(`#${ariaControls}`);
@@ -905,6 +906,30 @@ async function setNativeInput({ el, tag }, value, options) {
   return false;
 }
 
+// src/field/aria-select.ts
+async function selectAria({ el }, value, options) {
+  if (typeof value !== "string" && typeof value !== "number") return false;
+  const role = await el.getAttribute("role", options).catch(() => null);
+  if (role !== "combobox") return false;
+  const ariaControls = await el.getAttribute("aria-controls", options).catch(() => null);
+  if (!ariaControls) return false;
+  const ariaExpanded = await el.getAttribute("aria-expanded", options).catch(() => null);
+  if (ariaExpanded !== "true") await el.click(options);
+  const stringValue = String(value);
+  const listbox = el.page().locator(`#${ariaControls}`);
+  const byValue = listbox.locator(`[role="option"][value="${stringValue}"]`);
+  if (await byValue.count() >= 1) {
+    await byValue.first().click(options);
+    return true;
+  }
+  const byName = listbox.getByRole("option", { name: stringValue });
+  if (await byName.count() >= 1) {
+    await byName.first().click(options);
+    return true;
+  }
+  return false;
+}
+
 // src/field/otp.ts
 async function setOtpValue({ el, tag }, value, options) {
   if (typeof value !== "string") return false;
@@ -929,11 +954,25 @@ async function setRadioGroup({ el }, value, options) {
     await radio.check(options);
     return true;
   }
-  const radioByLabel = el.getByLabel(String(value), { exact: true }).locator("input[type=radio]");
+  const radioByLabel = el.getByLabel(stringValue, { exact: true }).locator("input[type=radio]");
   if (await radioByLabel.count() === 1) {
     await radioByLabel.check(options);
     return true;
   }
+  const ariaRadio = el.locator(`[role="radio"][value="${stringValue}"]`);
+  if (await ariaRadio.count() >= 1) {
+    const item = ariaRadio.first();
+    const ariaChecked = await item.getAttribute("aria-checked", options).catch(() => null);
+    if (ariaChecked !== "true") await item.click(options);
+    return true;
+  }
+  const ariaRadioByLabel = el.getByLabel(stringValue, { exact: true }).locator('[role="radio"]');
+  if (await ariaRadioByLabel.count() >= 1) {
+    const item = ariaRadioByLabel.first();
+    const ariaChecked = await item.getAttribute("aria-checked", options).catch(() => null);
+    if (ariaChecked !== "true") await item.click(options);
+    return true;
+  }
   return false;
 }
 
@@ -951,12 +990,22 @@ async function setSliderValue({ el, tag }, value, options) {
   if (initialValue === value) return true;
   const { centerX, centerY } = await prepareMouse(slider, options);
   const page = slider.page();
+  let unresponsive = false;
   try {
     const ratio = await calculateRatio(slider, initialValue, value, centerX, centerY, orientation, options);
     await seekValue(slider, initialValue, value, centerX, centerY, orientation, ratio, options);
+  } catch (e) {
+    if (e instanceof Error && e.message === "Slider appears to be disabled or unresponsive") {
+      unresponsive = true;
+    } else {
+      throw e;
+    }
   } finally {
     await page.mouse.up();
   }
+  if (unresponsive) {
+    return setSliderByKeyboard(slider, initialValue, value, options);
+  }
   return true;
 }
 async function prepareMouse(slider, options) {
@@ -1026,6 +1075,31 @@ async function moveMouse(page, centerX, centerY, orientation, distance) {
     await page.mouse.move(centerX + distance, centerY);
   }
 }
+async function setSliderByKeyboard(slider, initialValue, targetValue, options) {
+  const stepStr = await slider.getAttribute("aria-valuestep", options).catch(() => null);
+  const step = stepStr ? parseFloat(stepStr) : 1;
+  const presses = Math.round(Math.abs(targetValue - initialValue) / step);
+  const key = targetValue > initialValue ? "ArrowRight" : "ArrowLeft";
+  await slider.focus(options);
+  const page = slider.page();
+  for (let i = 0; i < presses; i++) {
+    await page.keyboard.press(key);
+  }
+  const nowStr = await slider.getAttribute("aria-valuenow", options).catch(() => null);
+  const reached = nowStr !== null && Math.abs(parseFloat(nowStr) - targetValue) < 1e-3;
+  return reached;
+}
+
+// src/field/toggle.ts
+async function setToggle({ el }, value, options) {
+  if (typeof value !== "boolean" && value !== null) return false;
+  const role = await el.getAttribute("role", options).catch(() => null);
+  if (role !== "checkbox" && role !== "switch") return false;
+  const ariaChecked = await el.getAttribute("aria-checked", options).catch(() => null);
+  const isChecked = ariaChecked === "true";
+  if (Boolean(value) !== isChecked) await el.click(options);
+  return true;
+}
 
 // src/field/index.ts
 function toString(value) {
@@ -1041,11 +1115,13 @@ async function setFieldValue(el, value, options) {
   const setValue = chain(
     // native
     selectNative,
+    selectAria,
     setNativeCheckbox,
     setRadioGroup,
     setNativeDate,
     setNativeInput,
     // aria / components
+    setToggle,
     setDateTextInput,
     setDateGroup,
     setCalendarDate,