fix: stop nested scroll regions from chaining to the notebook

[kirangadhave]

📝 Summary

Add overscroll-behavior: contain to the output area, the console output area, the JSON tree output, and the table scroll wrapper. A wheel or trackpad gesture that reaches the edge of one of these regions no longer scrolls the whole notebook.

Closes MO-6579

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
marimo-docs	Ready	Preview	Sep 14, 2026 11:22pm UTC

[github-actions]

All contributors have signed the CLA ✍️ ✅
_{Posted by the CLA Assistant Lite bot.}

[cubic-dev-ai]

No issues found across 4 files

_{Re-trigger cubic}

[github-actions]

Coverage Report for ./frontend

Status	Category	Percentage	Covered / Total
🔵	Lines	57.72%	21973 / 38063
🔵	Statements	57.66%	22359 / 38774
🔵	Functions	50.99%	4971 / 9748
🔵	Branches	51.16%	11450 / 22377

File Coverage

File	Stmts	Branches	Functions	Lines	Uncovered Lines
Changed Files
frontend/src/components/editor/output/Outputs.css	0%	0%	0%	0%
frontend/src/components/ui/table.tsx	91.66%	100%	75%	91.66%	48-53, 102-107
frontend/src/css/app/Cell.css	0%	0%	0%	0%

Generated in workflow #21431 for commit 62ccafc by the Vitest Coverage Report Action

[Copilot]

🔵 Needs a closer look

Two moderate findings remain regarding scratchpad scroll chaining and tooltip positioning under layout containment.

Pull request overview

Improves notebook scrolling stability and isolates cell layout recalculation.

Changes:

• Contains overscroll in outputs, console areas, JSON trees, and tables.
• Reserves stable scrollbar space on #App.
• Adds layout containment to notebook cells.

File summaries

File	Summary
frontend/src/css/app/Cell.css	Adds console overscroll containment and cell layout containment. Two moderate findings remain (1 vote each).
frontend/src/css/app/App.css	Reserves the scrollbar gutter.
frontend/src/components/ui/table.tsx	Prevents table scroll chaining.
frontend/src/components/editor/output/Outputs.css	Contains JSON output overscroll.

Review details

Suppressed comments (2)

frontend/src/css/app/Cell.css:88

• This declaration is nested under .interactive, so it only applies to console output inside an interactive notebook cell. The scratchpad renders ConsoleOutput with its own overflow-auto (components/scratchpad/scratchpad.tsx:287-297) but has no .interactive ancestor, so reaching that pane's edge can still chain the wheel gesture to the parent/notebook. Put overscroll-behavior: contain on the base .console-output-area rule while keeping the edit-mode sizing rules nested here.

      overscroll-behavior: contain;

frontend/src/css/app/Cell.css:18

• contain: layout makes the cell a containing block for positioned descendants. The data-table hover tooltip keeps its fixed trigger in the table subtree (components/data-table/hover-tooltip/hover-tooltip.tsx:37-48) but feeds it viewport getBoundingClientRect() coordinates, so hover tooltips in notebook tables will be offset by the cell's position instead of remaining viewport-fixed. Please either exempt/relocate this containment for such cells or portal the trigger outside the contained cell.

  contain: layout;

• Files reviewed: 4/4 changed files
• Comments generated: 0
• Review effort level: Lite

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.