@reticlehq/browser 3.8.0 → 3.8.1

package/dist/actions/action-report.js

@@ -10,13 +10,15 @@ export function visibleCanvases(doc) {
     const height = doc.defaultView?.innerHeight ?? 0;
     let count = 0;
     for (const canvas of doc.querySelectorAll(CANVAS_SELECTOR)) {
-        if (isReticleUi(canvas))
+        if (isReticleUi(canvas)) {
             continue;
+        }
         const box = canvas.getBoundingClientRect();
         const sized = box.width > 0 && box.height > 0;
         const onScreen = box.bottom > 0 && box.right > 0 && box.top < height && box.left < width;
-        if (sized && onScreen)
+        if (sized && onScreen) {
             count += 1;
+        }
     }
     return count;
 }
@@ -27,22 +29,28 @@ export function anchorOf(el) {
     if (testid !== undefined) {
         out.testid = testid;
         const shared = elementsMatching({ by: QueryBy.TESTID, value: testid }).length;
-        if (1 < shared)
+        if (1 < shared) {
             out.testidOf = shared;
+        }
     }
     const component = info?.componentStack[0];
-    if (component !== undefined)
+    if (component !== undefined) {
         out.component = component;
-    if (info?.source !== undefined)
+    }
+    if (info?.source !== undefined) {
         out.source = info.source;
+    }
     const role = getRole(el);
     const name = getAccessibleName(el);
-    if (role.length > 0)
+    if (role.length > 0) {
         out.role = role;
-    if (name.length > 0)
+    }
+    if (name.length > 0) {
         out.name = name;
-    if (isSensitiveField(el))
+    }
+    if (isSensitiveField(el)) {
         out.secret = true;
+    }
     if (role.length > 0 && name.length > 0) {
         const same = elementsMatching({ by: QueryBy.ROLE, value: role, name });
         const at = same.indexOf(el);
@@ -63,25 +71,35 @@ export const result = (ref, action, effect, settled, settleReason, anchor, warni
         settleReason,
         effect,
     };
-    if (anchor.testid !== undefined)
+    if (anchor.testid !== undefined) {
         base.testid = anchor.testid;
-    if (anchor.testidOf !== undefined)
+    }
+    if (anchor.testidOf !== undefined) {
         base.testidOf = anchor.testidOf;
-    if (anchor.component !== undefined)
+    }
+    if (anchor.component !== undefined) {
         base.component = anchor.component;
-    if (anchor.source !== undefined)
+    }
+    if (anchor.source !== undefined) {
         base.source = anchor.source;
-    if (anchor.role !== undefined)
+    }
+    if (anchor.role !== undefined) {
         base.role = anchor.role;
-    if (anchor.name !== undefined)
+    }
+    if (anchor.name !== undefined) {
         base.name = anchor.name;
-    if (anchor.nth !== undefined)
+    }
+    if (anchor.nth !== undefined) {
         base.nth = anchor.nth;
-    if (anchor.of !== undefined)
+    }
+    if (anchor.of !== undefined) {
         base.of = anchor.of;
-    if (anchor.secret !== undefined)
+    }
+    if (anchor.secret !== undefined) {
         base.secret = anchor.secret;
-    if (warning !== undefined)
+    }
+    if (warning !== undefined) {
         base.warning = warning;
+    }
     return base;
 };

package/dist/actions/actions.js

@@ -1,11 +1,12 @@
 import { ActionType, ActionWarning, clampHoldMs, DANGEROUS_ACTION_CONFIRM_ARG, ElementState, NATIVE_INPUT_ARG, SettleReason, } from '@reticlehq/core';
-import { isHiddenNativeOption } from '../dom/query.js';
+import { isHiddenNativeOption } from '../dom/query-finders.js';
 import { isReticleUi } from '../dom/dom-ignore.js';
 import { asSyntheticInput } from './synthetic/synthetic-input.js';
 import { echoRef, refs } from '../dom/addressing/refs.js';
 import { requiresDangerousConfirmation, assertOutwardAllowed, assertPaymentEntryAllowed, submitControlFor, } from './danger-context.js';
 import { assertEditable, assertNotRichText, isAutofillSafeTarget, setNativeValue, } from './value-input.js';
-import { isVisible, getStates } from '../dom/a11y.js';
+import { getStates } from '../dom/a11y.js';
+import { isVisible } from '../dom/visibility.js';
 import { elementHasHoverHandlers } from '../registry/stores/adapters.js';
 import { isActionTarget, isForm, isInput, isSelect, isTextArea, } from '../dom/realm.js';
 import { asSettleBudget, nativeSetTimeout, settle } from '../timers/native/native-timers.js';
@@ -19,10 +20,12 @@ function asString(value, fallback = '') {
 }
 function requireElement(ref) {
     const el = refs.resolve(ref);
-    if (null === el)
+    if (null === el) {
         throw new Error(`ref '${echoRef(ref)}' no longer resolves to an element`);
-    if (!isActionTarget(el))
+    }
+    if (!isActionTarget(el)) {
         throw new Error(`ref '${echoRef(ref)}' is not an HTML or SVG element`);
+    }
     return el;
 }
 const FILL_LIKE = new Set([
@@ -51,8 +54,9 @@ const GENERIC_ACTION_ARG_KEYS = new Set([
 function assertUploadArgs(args) {
     const keys = Object.keys(args);
     const dropped = keys.filter((k) => !UPLOAD_ARG_KEYS.has(k) && !GENERIC_ACTION_ARG_KEYS.has(k));
-    if (0 === dropped.length && keys.some((k) => UPLOAD_ARG_KEYS.has(k)))
+    if (0 === dropped.length && keys.some((k) => UPLOAD_ARG_KEYS.has(k))) {
         return;
+    }
     const detail = 0 === dropped.length
         ? 'no file was described'
         : `upload does not read ${dropped.join(', ')}, so it would be dropped`;
@@ -70,10 +74,12 @@ function assertActionAllowed(el, action, args) {
         (action === ActionType.PRESS && 'Enter' === pressKey(args));
     const dragTarget = action === ActionType.DRAG ? refs.resolve(dragTargetRef(args)) : null;
     const submitter = action === ActionType.PRESS && 'Enter' === pressKey(args) ? submitControlFor(el) : null;
-    if (canTrigger)
+    if (canTrigger) {
         assertOutwardAllowed([el, submitter, isActionTarget(dragTarget) ? dragTarget : null]);
-    if (action === ActionType.FILL || action === ActionType.TYPE)
+    }
+    if (action === ActionType.FILL || action === ActionType.TYPE) {
         assertPaymentEntryAllowed(el);
+    }
     const sourceDangerous = requiresDangerousConfirmation(el) ||
         (submitter !== null && requiresDangerousConfirmation(submitter));
     const targetDangerous = isActionTarget(dragTarget) && requiresDangerousConfirmation(dragTarget);
@@ -87,8 +93,9 @@ function assertActionAllowed(el, action, args) {
     }
 }
 function optionValueFor(options, named) {
-    if (options.some((option) => option.value === named))
+    if (options.some((option) => option.value === named)) {
         return named;
+    }
     const byLabel = options.filter((option) => option.label.trim() === named.trim());
     return 1 === byLabel.length ? (byLabel[0]?.value ?? named) : named;
 }
@@ -106,8 +113,9 @@ function valueOf(el) {
 }
 function activeRef(el) {
     const active = el.ownerDocument.activeElement;
-    if (null === active || active === el.ownerDocument.body)
+    if (null === active || active === el.ownerDocument.body) {
         return null;
+    }
     return refs.refFor(active);
 }
 async function dispatchFor(el, action, args) {
@@ -143,8 +151,9 @@ async function dispatchOther(el, action, args) {
             firePointer(el, 'pointermove', from);
             const moved = el.dispatchEvent(mouseEventFor(el, 'mousemove', { bubbles: true, cancelable: true }));
             const holdMs = clampHoldMs(args['holdMs']);
-            if (holdMs > 0)
+            if (holdMs > 0) {
                 await sleep(holdMs);
+            }
             return !moved;
         }
         case ActionType.FOCUS:
@@ -168,8 +177,9 @@ async function dispatchOther(el, action, args) {
                         'To empty a field on purpose use the `clear` action, or fill with an explicit "".');
                 }
                 assertEditable(el, 'fill');
-                if (!isAutofillSafeTarget(el))
+                if (!isAutofillSafeTarget(el)) {
                     el.focus();
+                }
                 return setNativeValue(el, args['value']);
             }
             assertNotRichText(el, 'fill');
@@ -221,8 +231,9 @@ async function dispatchOther(el, action, args) {
             if ('radio' === el.type && action === ActionType.UNCHECK) {
                 throw new Error('cannot uncheck a radio button — a real user could not; select another radio in the group');
             }
-            if (alreadyAtCheckedState(el, action))
+            if (alreadyAtCheckedState(el, action)) {
                 return false;
+            }
             const event = mouseEventFor(el, 'click', {
                 bubbles: true,
                 cancelable: true,
@@ -233,25 +244,29 @@ async function dispatchOther(el, action, args) {
         }
         case ActionType.SUBMIT: {
             const form = isForm(el) ? el : el.closest('form');
-            if (null === form)
+            if (null === form) {
                 throw new Error('no form to submit');
+            }
             form.requestSubmit();
             return false;
         }
         case ActionType.PRESS: {
             const mods = pressModifiers(args);
             const combo = pressKeys(args);
-            if (combo.length > 0)
+            if (combo.length > 0) {
                 return await pressCombo(el, combo, mods, clampHoldMs(args['holdMs']));
+            }
             const key = pressKey(args);
             const code = pressCode(args, key);
             const down = asSyntheticInput(() => el.dispatchEvent(keyboardEvent('keydown', { key, code, bubbles: true, cancelable: true, ...mods })));
             closeModalOnEscape(el, key, down);
-            if (down)
+            if (down) {
                 dispatchKeypress(el, key, code, mods);
+            }
             const hold = clampHoldMs(args['holdMs']);
-            if (hold > 0)
+            if (hold > 0) {
                 await holdKey(el, key, code, mods, hold);
+            }
             asSyntheticInput(() => el.dispatchEvent(keyboardEvent('keyup', { key, code, bubbles: true, ...mods })));
             return !down;
         }
@@ -277,8 +292,9 @@ async function dispatchOther(el, action, args) {
             if (true === args['__base64']) {
                 const bin = atob(rawContent);
                 const arr = new Uint8Array(bin.length);
-                for (let i = 0; i < bin.length; i++)
+                for (let i = 0; i < bin.length; i++) {
                     arr[i] = bin.charCodeAt(i);
+                }
                 fileBody = arr.buffer.slice(0);
             }
             const file = new File([fileBody], asString(args['name'], 'file.txt'), {
@@ -293,8 +309,9 @@ async function dispatchOther(el, action, args) {
         }
         case ActionType.DRAG: {
             const toRef = dragTargetRef(args);
-            if ('' === toRef)
+            if ('' === toRef) {
                 return await dragElement(el, null, args['data']);
+            }
             const resolved = refs.resolve(toRef);
             if (!isActionTarget(resolved)) {
                 throw new Error(`drag target '${echoRef(toRef)}' did not resolve to an element — pass a ref from ` +
@@ -309,10 +326,12 @@ async function dispatchOther(el, action, args) {
 export async function executeAction(ref, action, args = {}) {
     const named = 0 < ref.length;
     const el = isReflessDocumentPress(ref, action, args) ? focusedOrDocument() : requireElement(ref);
-    if (named)
+    if (named) {
         assertActionAllowed(el, action, args);
-    if (named)
+    }
+    if (named) {
         assertNotLeaving(el);
+    }
     const anchor = named ? anchorOf(el) : {};
     const visible = isVisible(el);
     const enabled = enabledOf(el);
@@ -376,15 +395,19 @@ export async function executeAction(ref, action, args = {}) {
         ...(alreadyAtValue ? { alreadyAtValue: true } : {}),
         ...canvasesOnScreen(),
     };
-    const warning = !named
-        ? ActionWarning.GLOBAL_PRESS
-        : geometry.occluded
-            ? ActionWarning.CLICK_OCCLUDED
-            : action === ActionType.HOVER && elementHasHoverHandlers(el)
-                ? ActionWarning.HOVER_NATIVE_ENTER_LEAVE
-                : hitsNoControl
-                    ? ActionWarning.CLICK_NOT_A_CONTROL
-                    : undefined;
+    let warning;
+    if (!named) {
+        warning = ActionWarning.GLOBAL_PRESS;
+    }
+    else if (geometry.occluded) {
+        warning = ActionWarning.CLICK_OCCLUDED;
+    }
+    else if (action === ActionType.HOVER && elementHasHoverHandlers(el)) {
+        warning = ActionWarning.HOVER_NATIVE_ENTER_LEAVE;
+    }
+    else if (hitsNoControl) {
+        warning = ActionWarning.CLICK_NOT_A_CONTROL;
+    }
     const done = result(ref, action, effect, settled, settleReason, anchor, warning);
     return isReticleUi(el) ? { ...done, reticleUi: true } : done;
 }
@@ -406,20 +429,27 @@ export async function executeSequence(steps) {
             settled: res.settled,
             settleReason: res.settleReason,
         };
-        if (res.testid !== undefined)
+        if (res.testid !== undefined) {
             stepBase.testid = res.testid;
-        if (res.component !== undefined)
+        }
+        if (res.component !== undefined) {
             stepBase.component = res.component;
-        if (res.role !== undefined)
+        }
+        if (res.role !== undefined) {
             stepBase.role = res.role;
-        if (res.name !== undefined)
+        }
+        if (res.name !== undefined) {
             stepBase.name = res.name;
-        if (res.source !== undefined)
+        }
+        if (res.source !== undefined) {
             stepBase.source = res.source;
-        if (res.secret !== undefined)
+        }
+        if (res.secret !== undefined) {
             stepBase.secret = res.secret;
-        if (res.warning !== undefined)
+        }
+        if (res.warning !== undefined) {
             stepBase.warning = res.warning;
+        }
         stepResults.push(stepBase);
     }
     return { ok: true, count: steps.length, effects, steps: stepResults };

package/dist/actions/danger-context.js

@@ -1,4 +1,4 @@
-import { OutwardAction, isDangerousActionText, isInertHref, isDangerousNavigation, isPaymentField, outwardActionOf, outwardRefusal, } from '@reticlehq/core';
+import { OutwardAction, isDangerousActionText, isDangerousNavigation, isInertHref, isPaymentField, outwardActionOf, outwardRefusal, withoutFilenameTokens, } from '@reticlehq/core';
 import { getAccessibleName, getRole } from '../dom/a11y.js';
 import { isHtmlElement } from '../dom/realm.js';
 const LABEL_VALUED_INPUT_TYPES = new Set([
@@ -8,34 +8,39 @@ const LABEL_VALUED_INPUT_TYPES = new Set([
     'image',
 ]);
 function holdsUserText(el) {
-    if (isHtmlElement(el) && el.isContentEditable)
+    if (isHtmlElement(el) && el.isContentEditable) {
         return true;
-    if (el instanceof HTMLTextAreaElement)
+    }
+    if (el instanceof HTMLTextAreaElement) {
         return true;
-    if (el instanceof HTMLInputElement)
+    }
+    if (el instanceof HTMLInputElement) {
         return !LABEL_VALUED_INPUT_TYPES.has(el.type.toLowerCase());
+    }
     return false;
 }
 const ANCHOR_TAG = 'A';
 function navigatingHref(el) {
-    if (ANCHOR_TAG !== el.tagName)
+    if (ANCHOR_TAG !== el.tagName) {
         return undefined;
+    }
     const href = el.getAttribute('href');
     return null === href || isInertHref(href) ? undefined : href;
 }
 export function dangerousActionContext(el) {
     const href = navigatingHref(el);
-    if (href !== undefined)
+    if (href !== undefined) {
         return href;
+    }
     const form = el.closest('form');
     const ownText = holdsUserText(el)
         ? ['', '']
         : [el.textContent ?? '', el.getAttribute('value') ?? ''];
     return [
-        getAccessibleName(el),
-        ...ownText,
-        el.getAttribute('title') ?? '',
-        el.getAttribute('aria-label') ?? '',
+        withoutFilenameTokens(getAccessibleName(el)),
+        withoutFilenameTokens(ownText.join(' ')),
+        withoutFilenameTokens(el.getAttribute('title') ?? ''),
+        withoutFilenameTokens(el.getAttribute('aria-label') ?? ''),
         el.getAttribute('href') ?? '',
         form?.getAttribute('action') ?? '',
     ].join(' ');
@@ -47,8 +52,9 @@ export function submitControlFor(el) {
 }
 export function requiresDangerousConfirmation(el) {
     const href = navigatingHref(el);
-    if (href !== undefined)
+    if (href !== undefined) {
         return isDangerousNavigation(href);
+    }
     return isDangerousActionText(dangerousActionContext(el), getRole(el));
 }
 let outwardAllowed;
@@ -56,19 +62,23 @@ export function setOutwardPolicy(allowed) {
     outwardAllowed = allowed;
 }
 export function assertOutwardAllowed(targets) {
-    if (outwardAllowed === undefined)
+    if (outwardAllowed === undefined) {
         return;
+    }
     for (const el of targets) {
-        if (null === el)
+        if (null === el) {
             continue;
+        }
         const kind = outwardActionOf(dangerousActionContext(el), getRole(el));
-        if (kind !== undefined && !outwardAllowed.includes(kind))
+        if (kind !== undefined && !outwardAllowed.includes(kind)) {
             throw new Error(outwardRefusal(kind));
+        }
     }
 }
 export function assertPaymentEntryAllowed(el) {
-    if (outwardAllowed === undefined || outwardAllowed.includes(OutwardAction.PAY))
+    if (outwardAllowed === undefined || outwardAllowed.includes(OutwardAction.PAY)) {
         return;
+    }
     const facts = {
         autocomplete: el.getAttribute('autocomplete') ?? undefined,
         name: el.getAttribute('name') ?? undefined,
@@ -76,6 +86,7 @@ export function assertPaymentEntryAllowed(el) {
         inputMode: el.getAttribute('inputmode') ?? undefined,
         label: `${getAccessibleName(el)} ${el.getAttribute('placeholder') ?? ''}`,
     };
-    if (isPaymentField(facts))
+    if (isPaymentField(facts)) {
         throw new Error(outwardRefusal(OutwardAction.PAY));
+    }
 }

package/dist/actions/scroll.d.ts

@@ -11,6 +11,8 @@ interface ScrollResult {
     atLeftEnd: boolean;
     atRightEnd: boolean;
 }
+export declare const SCROLL_FRACTION_RANGE_ERROR_PREFIX = "scroll fraction must be between 0 and 1, got ";
+export declare function fractionOutOfRangeMessage(fraction: number): string;
 export declare function scrollContainer(ref: string | undefined, dy: number | undefined, fraction?: number, dx?: number): ScrollResult;
 export declare function scrollFrom(base: Element | undefined, dy: number | undefined, fraction?: number, dx?: number): ScrollResult;
 export {};

package/dist/actions/scroll.js

@@ -1,6 +1,10 @@
 import { refs } from '../dom/addressing/refs.js';
 const FALLBACK_STEP_PX = 400;
 const VIEWPORT_FRACTION = 0.8;
+export const SCROLL_FRACTION_RANGE_ERROR_PREFIX = 'scroll fraction must be between 0 and 1, got ';
+export function fractionOutOfRangeMessage(fraction) {
+    return `${SCROLL_FRACTION_RANGE_ERROR_PREFIX}${fraction}`;
+}
 function nearestScrollable(el, axis) {
     let cur = el;
     while (cur !== null && cur !== document.body) {
@@ -18,18 +22,22 @@ export function scrollContainer(ref, dy, fraction, dx) {
     return scrollFrom(base instanceof Element ? base : undefined, dy, fraction, dx);
 }
 export function scrollFrom(base, dy, fraction, dx) {
+    if (fraction !== undefined && (fraction < 0 || fraction > 1 || Number.isNaN(fraction))) {
+        throw new RangeError(fractionOutOfRangeMessage(fraction));
+    }
     const axis = dx !== undefined && dx !== 0 && (dy === undefined || 0 === dy) ? 'x' : 'y';
     const target = base !== undefined
         ? nearestScrollable(base, axis)
         : (document.scrollingElement ?? document.documentElement);
     const before = target.scrollTop;
     const beforeLeft = target.scrollLeft;
-    if (fraction !== undefined && fraction >= 0 && fraction <= 1) {
+    if (fraction !== undefined) {
         target.scrollTop = Math.round(target.scrollHeight * fraction);
     }
     else {
-        if (dx !== undefined && dx !== 0)
+        if (dx !== undefined && dx !== 0) {
             target.scrollLeft = beforeLeft + dx;
+        }
         if (dx === undefined || (dy !== undefined && 0 !== dy)) {
             const step = dy ?? (Math.round(target.clientHeight * VIEWPORT_FRACTION) || FALLBACK_STEP_PX);
             target.scrollTop = before + step;

package/dist/dom/a11y.d.ts

@@ -4,8 +4,4 @@ export declare function getAccessibleName(el: Element): string;
 export declare function getStates(el: Element, visible?: boolean): ElementState[];
 export declare function isSensitiveField(el: Element): boolean;
 export declare function getValue(el: Element): string | undefined;
-export declare function isHiddenByAriaOnly(el: Element): boolean;
-export declare function isRenderedOutsideAriaHidden(el: Element): boolean;
-export declare function isInViewport(el: Element, memo?: Map<Element, boolean>): boolean;
-export declare function isVisible(el: Element, memo?: Map<Element, boolean>): boolean;
 export declare function describe(el: Element, memo?: Map<Element, boolean>): ElementDescriptor;