The check summary's vitals table names a phone look that scrolls sideways and how many screens tall each look is #9389

The check's vitals table now shows how many screens tall each look is. It also names any phone look that scrolls sideways. The new test file passes and tsc and the gate are clean. The #9240 comment is not done yet.

What changed

• src/looks/service.ts passes the recorded size into each vitals entry, beside entries.
• src/checks/looks.ts keeps a stored size only when all four numbers are whole and in range. Anything else is dropped, as before.
• src/checks/summary.ts:

- Each look gets screens, which is scrollHeight / innerHeight to one decimal (empty without a size). - A phone look is "sideways" when its scrollWidth is greater than its innerWidth. - sidewaysLine() prints, for example, phone /preview-admin/sample/held scrolls sideways.

• src/web/studio/vitals.ts adds a Screens column to the table. The sideways line is plain text below it, with no banner and no red. A look without a size shows nothing.
• Tests:

- test/check-vitals-size.test.ts covers the stored size, the screens figure, and the line being present for a wide phone look and absent for a narrow, desktop or sizeless one. - I also made two small edits to existing tests. test/check-vitals.test.ts expects the two new fields on a skipped look. test/looks.test.ts has its fake capture report a phone size and asserts it reaches the summary as 2.0 screens. - I did not confirm that each new test fails without the change.

Not done

• I did not comment on #9240. The held and bets phone looks' screens have to come from this pull's own check, which has not run yet.
• I did not post the plan with keep_plan; that tool isn't available here.
• I did not touch src/http/api.ts.
• The terminal one-line vitalsLine is unchanged. Only the run-page table carries screens and the sideways line.

Verification

• test/looks.test.ts has 3 real-chromium tests that fail in this sandbox with a chromium socket error. They fail the same way with my changes stashed. The forge's check will run them.

Closes #9320

The check's vitals table now shows how many screens tall each look is. It also names any phone look that scrolls sideways. The new test file passes and tsc and the gate are clean. The #9240 comment is not done yet.

What changed

• src/looks/service.ts passes the recorded size into each vitals entry, beside entries.
• src/checks/looks.ts keeps a stored size only when all four numbers are whole and in range. Anything else is dropped, as before.
• src/checks/summary.ts:

- Each look gets screens, which is scrollHeight / innerHeight to one decimal (empty without a size). - A phone look is "sideways" when its scrollWidth is greater than its innerWidth. - sidewaysLine() prints, for example, phone /preview-admin/sample/held scrolls sideways.

• src/web/studio/vitals.ts adds a Screens column to the table. The sideways line is plain text below it, with no banner and no red. A look without a size shows nothing.
• Tests:

- test/check-vitals-size.test.ts covers the stored size, the screens figure, and the line being present for a wide phone look and absent for a narrow, desktop or sizeless one. - I also made two small edits to existing tests. test/check-vitals.test.ts expects the two new fields on a skipped look. test/looks.test.ts has its fake capture report a phone size and asserts it reaches the summary as 2.0 screens. - I did not confirm that each new test fails without the change.

Not done

• I did not comment on #9240. The held and bets phone looks' screens have to come from this pull's own check, which has not run yet.
• I did not post the plan with keep_plan; that tool isn't available here.
• I did not touch src/http/api.ts.
• The terminal one-line vitalsLine is unchanged. Only the run-page table carries screens and the sideways line.

Verification

• test/looks.test.ts has 3 real-chromium tests that fail in this sandbox with a chromium socket error. They fail the same way with my changes stashed. The forge's check will run them.

The check's vitals table now shows how many screens tall each look is. Below it, one plain line names any phone look that scrolls sideways, such as phone /preview-admin/sample/held scrolls sideways. There is no banner and no red, and a look without a size shows nothing.

The first push failed the gate because no commit message had a "Try:" line for the src/web/studio/vitals.ts change. I added an empty commit with that line and pushed. bun scripts/gate.ts now passes locally. I did not re-run the tests, since this commit changes no code. The forge's check will run again on this push.

What changed

• src/looks/service.ts stores the recorded size beside entries for each look.
• src/checks/looks.ts keeps a stored size only when all four numbers are valid, and drops anything else.
• src/checks/summary.ts adds screens (scrollHeight / innerHeight, rounded to one decimal) and the sideways line for phone looks wider than their window.
• src/web/studio/vitals.ts adds a Screens column to the run page's vitals table and prints the sideways line under it.
• test/check-vitals-size.test.ts covers the stored size, the screens figure, and the line being present or absent. I also made small edits to test/check-vitals.test.ts and test/looks.test.ts. I did not confirm that each new test fails without the change.

Left out

• I have not commented on #9240. The held and bets phone looks' screens have to come from this pull's own check, which has not passed yet.
• The terminal one-line vitals summary is unchanged.
• I did not touch src/http/api.ts.

Known test failures

• Three real-chromium tests in test/looks.test.ts fail in my sandbox because chromium cannot open sockets there. They fail the same way without my changes.

Try: open a check's run page on the preview and read the Screens column and the line under the vitals table.

Three of juniper's four points are done and pushed. The fourth, the #9240 comment, is not posted.

• Terminal: vitalsLine in src/checks/progress.ts now adds , 2.4 screens to each look. It ends the line with · phone /x scrolls sideways when a phone look is wider than its window. A new test in test/check-vitals-size.test.ts covers it, and docs/features/vitals-screens.md has the how-to for both the run page and the terminal.
• Markup: the sideways note is now <p class="muted small" data-sideways>. The Screens header and cells use class="num", the same right-aligned numeric class src/web/pages/spend.ts uses. I couldn't find a named text/muted entry in docs/DESIGN.md, so I used the muted and num classes the other pages use. bun scripts/design-lint.ts is clean.
• Clean-up:

- sidewaysLine now takes the groups already computed in vitalsTable and vitalsLine, so vitalsRows is not run twice. - I split the long lines in src/checks/summary.ts and src/looks/service.ts.

• #9240 comment (box 4): I did not post it. The comment needs the held and bets phone looks' screens from this pull's own check on the preview. That check has to run on this push first, and my shell can't read its results.
• Tests:

- tsc and scripts/gate.ts are clean, and check-vitals-size, check-vitals and looks pass except as noted below. - Three real-browser tests in test/looks.test.ts fail in this sandbox, which has no usable Chromium. They fail identically with my changes stashed, and the forge's check runs them.

I found nothing in this pull that causes the failure, so I pushed an empty commit to re-run the check. I haven't seen the new run's result yet.

• What the log shows: the check was stopped with used 8239 MiB of memory, over its 8192 MiB limit. The egress refused: maria--forge.test:443 line came after that stop.
• The egress line: maria--forge.test is a made-up host in test fixtures (test/tui-forges.test.ts and three others). It isn't a real call from the app. test/tui-forges.test.ts passes here, so no test of mine reaches that host.
• My change: it only touches vitals words and markup, which doesn't plausibly add memory. tsc and the gate were clean before the last push. The vitals tests passed here too. The only failures were the three Chromium tests in test/looks.test.ts, which also fail without my change.
• Next step: if the memory stop happens again, the 8 GiB limit in forge.json or the 73-shard run needs a person to look at it. I didn't change that limit.

This pull still needs the #9240 comment with the held and bets phone-look screens. I can't post it until a check has run on this pull.

Left #9320 open: 2 unticked items remain (Where the check summary prints the vitals table (src/checks/looks.ts), each row shows screens = scrollHeight / innerHeight, rounded to one decimal. Below the table, one plain line names each phone look whose scrollWidth is greater than its innerWidth, for example "phone /preview-admin/sample/held scrolls sideways". There is no banner and no red, and a look without a size shows nothing.; Comment on #9240 with the held and bets phone looks' screens from this pull's own check.).