See screenshots at the bottom

LMArena | Code Block Collapse

Adds clean collapse controls to code blocks (header toggle + footer bar) and a global toolbar control for collapsing/expanding all blocks. Ideal for long conversations with lots of code.

Why You Need This

Long AI responses with multiple code blocks make conversations hard to navigate:

• Scrolling fatigue: Endless scrolling past code you've already reviewed.
• Context lost: Hard to see the conversation flow buried under walls of code.
• No native solution: LMArena has no built-in way to collapse code blocks.

This script lets you collapse code blocks down to their header and expand them when needed.

Key Features

• Per-Block Footer Bar (No Overlay): Each code block gets a bottom “Collapse” bar that never covers code when you’re at the bottom of the block.
• Smart Fixed Footer (When Needed): If a code block is tall and its footer would be obscured by the input area, a single global fixed footer appears above the input so you can still collapse it—without covering the code block header.
• Clickable Headers: Click any code block header to toggle collapse/expand.
• Global Toolbar Controls: A compact dual button is added to the input toolbar:
  • Collapse all
  • Expand all
• Hold-to-Toggle Auto-Collapse: Hold the Collapse toolbar button to enable/disable persistent auto-collapse for code blocks.
• Smart Scroll Anchoring: Prevents jarring scroll jumps when collapsing large blocks by preserving your visual position.
• Instant Performance: Uses instant toggling (no slow animations) so the UI stays snappy even with many blocks.
• Persisted Settings: Auto-collapse preference is saved locally.

How to Use

Action	Result
Click footer bar on a code block	Collapse that specific code block
Click code block header	Toggle collapse/expand for that block
Click toolbar “Collapse”	Collapse all code blocks
Click toolbar “Expand”	Expand all code blocks
Hold toolbar “Collapse”	Toggle persistent auto-collapse ON/OFF

Performance Notes

• Incremental detection: Uses MutationObserver to only process newly added code blocks (no full-page rescans on every update).
• Synchronous toggling: Collapses/expands instantly to avoid UI flicker and layout thrash.
• Efficient updates: The global fixed footer updates are throttled via requestAnimationFrame during scroll/resize.

Installation

1. Install Violentmonkey, Tampermonkey, or Greasemonkey.
2. Install this script.
3. Visit lmarena.ai.

Works immediately. The toolbar buttons appear next to the Submit button in the input area.

Keyboard Accessibility

• Code block headers are focusable via Tab.
• Code block footer bars are focusable via Tab.
• Enter or Space toggles/collapses depending on the focused control.