From afe4362bb275bbe6a2fc537359bdd17eb96941f0 Mon Sep 17 00:00:00 2001
From: stroblme <stroblme@posteo.de>
Date: Thu, 15 Oct 2026 08:36:38 +0200
Subject: [PATCH] Verify shoots the flow canvas and media tile from the Demo,
 not the media example

The canvas shot opens the Demo's music flow; the media shot reads the Demo's
Media screen, so neither needs the `camera` dashboard.
---
 frontend/scripts/capture-screenshots.mjs | 25 ++++++++++++++----------
 1 file changed, 15 insertions(+), 10 deletions(-)

diff --git a/frontend/scripts/capture-screenshots.mjs b/frontend/scripts/capture-screenshots.mjs
index 831baba..615bfa5 100644
--- a/frontend/scripts/capture-screenshots.mjs
+++ b/frontend/scripts/capture-screenshots.mjs
@@ -223,10 +223,11 @@ async function capturePanels(page, dir) {
 }
 
 /**
- * A media tile drawing what a camera published, where there is one.
+ * A media tile drawing what a camera published: the Demo's Media screen,
+ * whose house is drawn by a node as heat.
  *
- * Skipped unless the media example is seeded (root `make seed-example-media`),
- * since it is the one shot that needs a source of frames. The bytes arrive as
+ * Skipped unless the Demo is seeded (root `make seed-hosted-demo`), since it
+ * is the one shot that needs a source of frames. The bytes arrive as
  * a blob — pushed down the socket, or fetched with the session's credential,
  * which no `img` could carry on its own — so a `blob:` source is the proof the
  * whole path ran rather than that a picture is merely present.
@@ -237,25 +238,23 @@ async function capturePanels(page, dir) {
  * where idleness only ever said the page stopped asking.
  */
 async function captureMedia(page, dir) {
-  const answer = await page.goto(`${APP_URL}/view/camera`, {
+  const answer = await page.goto(`${APP_URL}/view/media`, {
     waitUntil: "domcontentloaded",
   })
   if (!answer?.ok()) return
 
-  const picture = page.locator("img[alt='Test camera']")
+  const picture = page.locator("img[alt='The house, as heat']")
   try {
     await picture.waitFor({ timeout: 15000 })
     await page.waitForFunction(
       () =>
         document
-          .querySelector("img[alt='Test camera']")
+          .querySelector("img[alt='The house, as heat']")
           ?.src?.startsWith("blob:") ?? false,
       { timeout: 15000 },
     )
   } catch {
-    console.warn(
-      "  media tile drew nothing — is `make seed-example-media` run?",
-    )
+    console.warn("  media tile drew nothing — is the Demo seeded?")
     return
   }
   await page.waitForTimeout(500)
@@ -296,7 +295,13 @@ async function captureWorkers(page, dir) {
 async function captureFlows(page, dir) {
   await page.goto(`${APP_URL}/flows`, { waitUntil: "networkidle" })
 
-  if (await page.getByTestId("flow-card").count()) {
+  // The Demo's music flow, where it is seeded: two nodes, live values on the
+  // edges and the tiles at both ends, all still legible once fitted. The house
+  // has fifteen nodes, which fitted to the screen read as dots.
+  const demo = page.locator("[data-testid=flow-card][href$='/flows/music']")
+  if (await demo.count()) {
+    await demo.click()
+  } else if (await page.getByTestId("flow-card").count()) {
     await page.getByTestId("flow-card").first().click()
   } else {
     await page.getByTestId("new-flow").click()