Repository navigation
Description
Context: I've been using HyperFrames every day for the past two weeks to make Korean Shorts and long-form videos, and it's been great to work with. This is one of a batch of things I ran into along the way (most came as small PRs from me today) — sorry for the pile-up, and thanks for your patience.
What happens
A scene header is a positioned wrapper with no size, holding a small kicker line in flow and two absolutely positioned, white-space: nowrap titles stacked on top of each other (one crossfades into the other):
#head { position: absolute; left: 130px; top: 104px; } /* no width, no paint, no overflow */
#kicker { font: 600 27px sans-serif; }
.title { position: absolute; left: 0; top: 46px; white-space: nowrap; font: 800 74px sans-serif; }<div id="head">
<div id="kicker">Anthropic S-1 · first half</div>
<div class="title" id="t1">Revenue and net loss, first half</div>
</div>hyperframes check --no-cache (main affa03b6, CLI 0.9.43):
⚠ t=0.667 … 3.778s container_overflow #t1 inside #head overflowed right 786.29px — Nowrap text is wider than its container.
Fix: Resize/reposition the child or container, or mark intentional overflow with data-layout-allow-overflow.
On the original project, the same thing happened with #ch-t1/#ch-t2 (598 px wide) inside #ch-head. #ch-head measured 458 × 31 px, which is just the kicker's line, and the titles sit entirely below it (top: 150 vs a container bottom of 135). Nothing on screen is cut or misplaced: the frame shows the kicker and the full title. The warning went away only after giving the wrapper an arbitrary width: 1100px; height: 150px, which changes nothing visible.
Why I think this is a design question, not a bug
#4379 deliberately extended the nowrap branch of container_overflow to containers that do not clip ("Nowrap text wider than its own container is the same overflow whether or not the container clips it"), and its test uses an unpainted #box with an in-flow <span>. So "require the container to clip" would undo a decision. The case here is narrower. The nowrap child is out of flow (position: absolute), so the container's width never laid it out, and the container's width comes from unrelated in-flow content (shrink-to-fit around the kicker). The "container" has no edge on screen to overflow.
Proposal
In containerOverflowIssues (packages/cli/src/commands/layout-audit.browser.js), when the container does not clip (the !checksEveryChild branch), skip nowrap children whose computed position is absolute or fixed. Their box is sized by their own text, not by the container. Clipping containers and data-layout-boundary keep checking every child. An in-flow nowrap child (the #4379 case) still warns. Off-canvas and collision problems of such titles are already covered by text_off_canvas / content_overlap.
An alternative, if absolutely positioned children should stay in scope: only treat a non-clipping container as a constraint when it paints (background, border, shadow) or has an authored width, so an invisible auto-sized wrapper is never the reference box.
Repro project and main output are kept (index.html above).
Activity