Summary
Nested scrollbox content isn’t clipped: an inner scrollbox’s text draws outside its border and into the outer scrollbox (and even into the header area in our app). Layout sizes/borders render correctly, but overflow clipping doesn’t apply.
Steps to Reproduce
- Render an outer
scrollbox with a fixed height (e.g., 15), border: true, overflow: "hidden", scrollY: true.
- Inside it, render a single child: an inner
scrollbox with a fixed height (e.g., 8), border: true, overflow: "hidden", scrollY: true, containing 20+ <text> lines.
- Scroll the inner (and/or outer).
Expected
Inner scrollbox content is clipped to its viewport; no text is drawn outside its border or the outer scrollbox.
Actual
Inner scrollbox text overdraws past its border and bleeds into the outer scrollbox (and other UI). Clipping appears to be ignored for nested scrollboxes.
Notes
- Observed via the React renderer on macOS/iTerm2/kitty; outer scrollbox also had
overflow: "hidden".
- A screenshot showing the bleed is available; happy to attach if helpful.
- A minimal repro should be possible with the steps above; this looks like a renderer clipping issue rather than a layout sizing issue.