@blario/react-native 0.1.5 → 0.1.6

package/src/snapshot/capture.ts

@@ -12,8 +12,8 @@ import { describeScrollDirections } from './scroll.ts';
 import { groupIntoLines, limitCharacters, type PositionedText } from './text-layout.ts';
 import { orderForReading } from './ordering.ts';
 import { buildView } from './view.ts';
-import { classifyVisibility, keepInTextTree, measureScrollGeometries, type ScrollGeometries } from './visibility.ts';
-import { dropWrapperDuplicates, limitOffscreen, type MeasuredCandidate } from './wrappers.ts';
+import { classifyVisibility, keepInTextTree, markOffscreenText, measureScrollGeometries, type ScrollGeometries } from './visibility.ts';
+import { dropWrapperDuplicates, type MeasuredCandidate } from './wrappers.ts';
 
 export interface Snapshot {
   screen: string;
@@ -27,6 +27,7 @@ export interface SnapshotDependencies {
   getAnchorFiber: () => Fiber | null;
   registry: ElementRegistry;
   getViewport: () => Size;
+  getWindow: () => Size;
   getExtraRoutes: () => string[];
 }
 
@@ -77,7 +78,7 @@ export class SnapshotCapturer {
           return null;
         }
         const visibility = classifyVisibility(rect, viewport, block.scrollContainers, geometries);
-        return keepInTextTree(visibility, rect, viewport, options.viewportOnly) ? { rect, text: block.text, heading: block.heading } : null;
+        return keepInTextTree(visibility, rect, viewport, options.viewportOnly) ? { rect, text: markOffscreenText(visibility, block.text), heading: block.heading } : null;
       }),
     );
     const lines = limitCharacters(groupIntoLines(measured.filter((entry): entry is PositionedText => entry !== null)), options.maxChars);
@@ -91,8 +92,9 @@ export class SnapshotCapturer {
     return root === null ? [] : collect(root).focusedScreens;
   }
 
+  // The whole window, not the part above the keyboard: what the keyboard covers is still pressable.
   private async measureVisible(kept: Candidate[], geometries: ScrollGeometries): Promise<MeasuredCandidate[]> {
-    const viewport = this.dependencies.getViewport();
+    const viewport = this.dependencies.getWindow();
     const measured = await Promise.all(
       kept.map(async (candidate): Promise<MeasuredCandidate | null> => {
         const rect = await measureHost(candidate.host);
@@ -104,10 +106,10 @@ export class SnapshotCapturer {
           return null;
         }
         const offscreen = visibility.kind === 'offscreen' ? visibility : null;
-        return { candidate, rect, offscreen: offscreen?.direction ?? null, distance: offscreen?.distance ?? 0 };
+        return { candidate, rect, offscreen: offscreen?.direction ?? null };
       }),
     );
-    return limitOffscreen(measured.filter((entry): entry is MeasuredCandidate => entry !== null));
+    return measured.filter((entry): entry is MeasuredCandidate => entry !== null);
   }
 
   private assemble(

package/src/snapshot/render.ts

@@ -17,7 +17,7 @@ function flag(name: string, enabled: boolean): Attribute {
 function renderAttributes(attributes: Attribute[]): string {
   return attributes
     .filter((attribute): attribute is readonly [string, string] => attribute[1] !== null)
-    .map(([name, value]) => (value === '' ? name : `${name}=${clip(value, ATTRIBUTE_LIMIT)}`))
+    .map(([name, value]) => (value === '' ? name : `${name}=${name === 'list' ? value : clip(value, ATTRIBUTE_LIMIT)}`))
     .filter((rendered) => rendered.length > 0)
     .join(' ');
 }

package/src/snapshot/visibility.ts

@@ -16,7 +16,7 @@ export type Offscreen = 'above' | 'below' | 'left' | 'right';
 
 export type Visibility =
   | { kind: 'visible' }
-  | { kind: 'offscreen'; direction: Offscreen; distance: number }
+  | { kind: 'offscreen'; direction: Offscreen }
   | { kind: 'hidden' };
 
 const VISIBLE: Visibility = { kind: 'visible' };
@@ -25,13 +25,9 @@ const HIDDEN: Visibility = { kind: 'hidden' };
 function offscreenAgainst(rect: Rect, geometry: ScrollGeometry): Visibility {
   const { viewport, horizontal } = geometry;
   if (horizontal) {
-    return rect.x >= viewport.x + viewport.width
-      ? { kind: 'offscreen', direction: 'right', distance: rect.x - (viewport.x + viewport.width) }
-      : { kind: 'offscreen', direction: 'left', distance: viewport.x - (rect.x + rect.width) };
+    return { kind: 'offscreen', direction: rect.x >= viewport.x + viewport.width ? 'right' : 'left' };
   }
-  return rect.y >= viewport.y + viewport.height
-    ? { kind: 'offscreen', direction: 'below', distance: rect.y - (viewport.y + viewport.height) }
-    : { kind: 'offscreen', direction: 'above', distance: viewport.y - (rect.y + rect.height) };
+  return { kind: 'offscreen', direction: rect.y >= viewport.y + viewport.height ? 'below' : 'above' };
 }
 
 export function classifyVisibility(rect: Rect, window: Size, containers: Fiber[], geometries: ScrollGeometries): Visibility {
@@ -52,10 +48,15 @@ function isBeyondWindowEdge(rect: Rect, window: Size): boolean {
   return rect.x >= window.width || rect.x + rect.width <= 0;
 }
 
+const OFFSCREEN_MARK = '[off-screen]';
+
+// Text off to the side can be another page of a pager or another day of a calendar, so it can't read as what's on screen.
+export function markOffscreenText(visibility: Visibility, text: string): string {
+  const sideways = visibility.kind === 'offscreen' && (visibility.direction === 'left' || visibility.direction === 'right');
+  return sideways ? `${OFFSCREEN_MARK} ${text}` : text;
+}
+
 export function keepInTextTree(visibility: Visibility, rect: Rect, window: Size, viewportOnly: boolean): boolean {
-  if (visibility.kind === 'offscreen' && (visibility.direction === 'left' || visibility.direction === 'right')) {
-    return false;
-  }
   if (visibility.kind === 'hidden' && isBeyondWindowEdge(rect, window)) {
     return false;
   }

package/src/snapshot/wrappers.ts

@@ -7,7 +7,6 @@ export interface MeasuredCandidate {
   candidate: Candidate;
   rect: Rect;
   offscreen: Offscreen | null;
-  distance: number;
 }
 
 const RECT_TOLERANCE = 1;
@@ -56,15 +55,3 @@ export function dropWrapperDuplicates(measured: MeasuredCandidate[]): MeasuredCa
   }
   return measured.filter((entry) => !wrappers.has(entry));
 }
-
-const OFFSCREEN_LIMIT = 30;
-
-export function limitOffscreen(measured: MeasuredCandidate[]): MeasuredCandidate[] {
-  // Every option of a wheel stays listed: one dropped here could never be selected.
-  const hidden = measured.filter((entry) => entry.offscreen !== null && entry.candidate.kind !== 'scroll' && entry.candidate.wheelOption !== true);
-  if (hidden.length <= OFFSCREEN_LIMIT) {
-    return measured;
-  }
-  const dropped = new Set(hidden.sort((left, right) => left.distance - right.distance).slice(OFFSCREEN_LIMIT));
-  return measured.filter((entry) => !dropped.has(entry));
-}

package/src/version.ts

@@ -1 +1 @@
-export const SDK_VERSION = '0.1.5';
+export const SDK_VERSION = '0.1.6';