@jbrowse/capture 5.0.0-beta.8 → 5.0.0-beta.9

package/esm/waits.js

@@ -1,9 +1,5 @@
-import { describePendingDisplays, pendingDisplayStatesInPage, } from './sessionGate.js';
-// Fixed-duration sleep. Shared by the browser-test suites and the website
-// screenshot generator so the helper isn't redefined per consumer.
-export const delay = (ms) => new Promise(resolve => {
-    setTimeout(resolve, ms);
-});
+import { holdTrue } from './poll.js';
+import { describePendingDisplays, pendingDisplayStatesInPage, tooLargeDisplaysInPage, } from './sessionGate.js';
 // Every best-effort wait below runs through this. They swallow their own timeout
 // on purpose — a slow-but-finishing page should not be failed for being slow,
 // and a display in a terminal state publishes no attribute to wait on at all —
@@ -37,6 +33,14 @@ export const LOADING_OVERLAY = '[data-testid="loading-overlay"]';
  * capture taken in it is a picture of an empty browser.
  */
 export const APP_READY = '[data-app-phase="ready"]';
+/**
+ * A display drawing a transition between two settled pictures: canvas's row
+ * morph, a multi-way lane re-aligning. The app is finished working and every
+ * display reads `ready`, so neither the marker nor the phase can say so; the
+ * display publishes it itself, and a frame taken while it reads `true` is a
+ * picture no settled state ever shows.
+ */
+export const ANIMATING_DISPLAYS = '[data-display-animating="true"]';
 /**
  * How long `ready` has to HOLD before an interaction's work counts as finished.
  *
@@ -123,11 +127,8 @@ export const PENDING_DISPLAYS = '[data-display-drawn="false"]';
  * finished badly and is showing a banner, and `ready` is a display claiming it
  * finished without drawing — a bug in the display rather than in the wait.
  *
- * An EMPTY census is the other answer, and `tooLarge` / `renderError` are why it
- * is not good news. Those two replace the display's subtree outright, so they
- * publish neither attribute and appear here as nothing at all: a wait on such a
- * display can never resolve and can never be reported. Nothing pending means
- * either that, or a selector that was never a display's.
+ * A display showing "too much data" is not pending, and a wait on its body
+ * can never resolve, so the census names those too.
  */
 export async function waitForSelectorAttributed(page, selector, timeoutMs) {
     try {
@@ -148,9 +149,18 @@ export async function waitForSelectorAttributed(page, selector, timeoutMs) {
 export async function describePendingDisplaysNow(page) {
     try {
         const pending = await page.evaluate(pendingDisplayStatesInPage);
-        return pending.length
-            ? `${pending.length} display(s) had not painted: ${describePendingDisplays(pending)}`
-            : 'no display reported itself unpainted, so either the selector was not on a display or the display is in a terminal phase that publishes nothing (tooLarge, renderError)';
+        const tooLarge = await page.evaluate(tooLargeDisplaysInPage);
+        const found = [
+            pending.length
+                ? `${pending.length} display(s) had not painted: ${describePendingDisplays(pending)}`
+                : undefined,
+            tooLarge.length
+                ? `${tooLarge.length} display(s) show "too much data" in place of their features: ${describePendingDisplays(tooLarge)}`
+                : undefined,
+        ].filter(Boolean);
+        return found.length
+            ? found.join('; ')
+            : 'no display reported itself unpainted, so the selector was not on a display';
     }
     catch {
         return 'the page could not be queried afterwards (context gone)';
@@ -176,8 +186,6 @@ export const displayPainted = (testid) => `[data-testid="${testid}"][data-displa
  * on the phase instead.
  */
 export const displaySettled = (testid) => `[data-testid="${testid}"][data-display-phase="ready"]`;
-/** One display, by its config's `displayId` rather than by type. */
-export const displayById = (displayId) => `[data-display-id="${displayId}"]`;
 // Wait until no display is still pending its first paint AND could still reach
 // it: a pending display publishing `loading`, or publishing no phase at all (a
 // build older than the attribute), is still coming; a terminal phase is not. The
@@ -210,10 +218,8 @@ export function waitForDisplaysDone(page, timeoutMs) {
 // DisplayPhase, whose `loading` term covers the entire fetch, so "nothing is
 // loading" is a direct read rather than an inference.
 //
-// Terminal phases (`tooLarge`, `renderError`) replace the display subtree and
-// publish no attribute, so they resolve immediately here — correct, since they
-// are finished, not pending. They're caught as *content* by the caller's own
-// settled check, not by this wait.
+// Terminal phases (`tooLarge`, `renderError`) resolve immediately here, since
+// they are finished, not pending. The caller's census reports them.
 //
 // Best-effort like its neighbours: a display that never leaves `loading` should
 // fail loudly through that settled check, with the frame to look at, rather than
@@ -221,26 +227,25 @@ export function waitForDisplaysDone(page, timeoutMs) {
 export function waitForDisplayPhases(page, timeoutMs) {
     return settled(page.waitForFunction(() => document.querySelector('[data-display-phase="loading"]') === null, { timeout: timeoutMs, polling: 'mutation' }));
 }
+/**
+ * A view whose MODEL is initialized but whose lazily-imported React component
+ * has not arrived: ViewWrapper's Suspense spinner. The app marker cannot see
+ * it, since the model it reads is finished, so a view clicked into existence
+ * reads `ready` for as long as its chunk takes to load.
+ */
+const VIEW_COMPONENT_PENDING = '[data-view-component-pending]';
 // The view-level counterpart: ViewContainer publishes `data-view-phase` from the
 // view model's own phase, and `loading` means the view is still waiting on its
 // assembly (or on init's navigation) and has mounted no displays at all. Every
 // display-level wait above is silent in that state — there is nothing to be
 // loading yet — so a capture taken then lands on a bare spinner.
 //
-// The `data-view-component-pending` half is the case the phase attribute cannot
-// report: a view whose MODEL is initialized but whose lazily-imported React
-// component has not arrived, so ViewContainer publishes a non-loading phase over
-// a body that is still ViewWrapper's Suspense spinner. A session loaded at page
-// load has usually won that race by the time anything else settles; a view
-// CLICKED into existence fetches its chunk only then, and its frame is the one a
-// launch-dialog figure is about.
-//
 // NOT best-effort, unlike its neighbours: a view that never leaves `loading` has
 // no content to fall through to, so the timeout IS the diagnosis and the caller
 // should surface it.
 export function waitForViewPhases(page, timeoutMs) {
-    return page.waitForFunction(() => document.querySelector('[data-view-phase="loading"]') === null &&
-        document.querySelector('[data-view-component-pending]') === null, { timeout: timeoutMs, polling: 'mutation' });
+    return page.waitForFunction((pending) => document.querySelector('[data-view-phase="loading"]') === null &&
+        document.querySelector(pending) === null, { timeout: timeoutMs, polling: 'mutation' }, VIEW_COMPONENT_PENDING);
 }
 /**
  * Everything the app publishes to say it is working, as one selector.
@@ -255,12 +260,14 @@ export function waitForViewPhases(page, timeoutMs) {
  *                          wherever it tells a user it is working
  *   `data-display-phase`   one display's own fetch, newer builds
  *   `data-view-phase`      a view still resolving its assembly, newer builds
+ *   `data-display-animating`  a display drawing a morph, newer builds
  */
 export const BUSY_SELECTOR = [
     LOADING_OVERLAY,
     '[data-busy="true"]',
     '[data-display-phase="loading"]',
     '[data-view-phase="loading"]',
+    ANIMATING_DISPLAYS,
 ].join(', ');
 /**
  * Is the app doing anything right now?
@@ -294,33 +301,12 @@ export function isPageBusyInPage(busySelector) {
  * "nothing is in flight right now", which is what a probe or a benchmark wants
  * between two measured actions.
  *
- * Polled from node rather than in-page: chrome throttles in-page timers and rAF
- * once the tab is not visible, which is the state a headless capture sits in.
- *
  * Returns false on timeout rather than throwing, like its neighbours.
  */
-export async function waitForQuietPeriod(page, { quietMs = 1500, timeout = 30000, pollMs = 250, } = {}) {
-    const deadline = Date.now() + timeout;
-    let quietSince;
-    while (Date.now() < deadline) {
-        // A page that navigates or closes under us fails the evaluate; treat that
-        // as busy and let the deadline decide, rather than reporting quiet.
-        const busy = await page
-            .evaluate(isPageBusyInPage, BUSY_SELECTOR)
-            .catch(() => true);
-        const now = Date.now();
-        if (busy) {
-            quietSince = undefined;
-        }
-        else {
-            quietSince ??= now;
-            if (now - quietSince >= quietMs) {
-                return true;
-            }
-        }
-        await delay(pollMs);
-    }
-    return false;
+export function waitForQuietPeriod(page, { quietMs = 1500, timeout = 30000, pollMs = 250, } = {}) {
+    // a page that navigates or closes under us fails the evaluate, which reads
+    // as busy and leaves the deadline to decide
+    return holdTrue(() => page.evaluate(isPageBusyInPage, BUSY_SELECTOR).then(busy => !busy, () => false), { holdMs: quietMs, timeout, pollMs });
 }
 /**
  * Wait for the FIRST frame the app says it has finished.
@@ -336,8 +322,7 @@ export async function waitForQuietPeriod(page, { quietMs = 1500, timeout = 30000
 export function waitForAppReady(page, { timeout = 30000 } = {}) {
     return settled(page.waitForSelector(APP_READY, { timeout, visible: false }));
 }
-/** Whether this build publishes the app-level readiness marker at all. */
-export function hasAppReadyMarker(page) {
+function hasAppReadyMarker(page) {
     return page.evaluate(() => document.querySelector('[data-app-phase]') !== null);
 }
 /**
@@ -364,9 +349,8 @@ export function hasAppReadyMarker(page) {
  * replaced. Requiring the idle to HOLD costs the hold and no more, and catches
  * the same late-starting work.
  *
- * Polled from Node rather than by `page.waitForSelector`, for the reason
- * `waitForQuietPeriod` is: chrome throttles in-page timers and rAF once the tab
- * is not visible, which is exactly the state a headless capture sits in.
+ * The hold also requires no view body to be waiting on its lazy component and
+ * no display to be animating, neither of which the marker can see.
  *
  * Throws on a build too old for the marker rather than falling back — see the
  * body.
@@ -382,25 +366,9 @@ export async function waitForAppSettled(page, { timeout = 30000, holdMs = APP_SE
             'to wait for — every other readiness attribute is an absence an app ' +
             'that has not started also satisfies.');
     }
-    const deadline = Date.now() + timeout;
-    let readySince;
-    while (Date.now() < deadline) {
-        // a page that navigates or closes under us fails the evaluate; treat that as
-        // not-ready and let the deadline decide
-        const ready = await page
-            .evaluate(selector => document.querySelector(selector) !== null, APP_READY)
-            .catch(() => false);
-        const now = Date.now();
-        if (ready) {
-            readySince ??= now;
-            if (now - readySince >= holdMs) {
-                return true;
-            }
-        }
-        else {
-            readySince = undefined;
-        }
-        await delay(pollMs);
-    }
-    return false;
+    return holdTrue(() => page
+        .evaluate((ready, pending, animating) => document.querySelector(ready) !== null &&
+        document.querySelector(pending) === null &&
+        document.querySelector(animating) === null, APP_READY, VIEW_COMPONENT_PENDING, ANIMATING_DISPLAYS)
+        .catch(() => false), { holdMs, timeout, pollMs });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbrowse/capture",
-  "version": "5.0.0-beta.8",
+  "version": "5.0.0-beta.9",
   "description": "Drive a JBrowse 2 instance with Puppeteer and screenshot it once it has actually finished rendering",
   "keywords": [
     "jbrowse",
@@ -31,10 +31,10 @@
   ],
   "sideEffects": false,
   "dependencies": {
-    "puppeteer": "^25.10.0"
+    "puppeteer": "^25.11.0"
   },
   "devDependencies": {
-    "@jbrowse/core": "^5.0.0-beta.8"
+    "@jbrowse/core": "^5.0.0-beta.9"
   },
   "publishConfig": {
     "access": "public"