LMArena | Collapsible Code Blocks

Adds collapsible code blocks with clickable headers, footer controls, and a global toolbar toggle

Aby zainstalować ten skrypt, wymagana jest instalacje jednego z następujących rozszerzeń: Tampermonkey, Greasemonkey lub Violentmonkey.

You will need to install an extension such as Tampermonkey to install this script.

Aby zainstalować ten skrypt, wymagana jest instalacje jednego z następujących rozszerzeń: Tampermonkey, Violentmonkey.

Aby zainstalować ten skrypt, wymagana będzie instalacja rozszerzenia Tampermonkey lub Userscripts.

You will need to install an extension such as Tampermonkey to install this script.

Aby zainstalować ten skrypt, musisz zainstalować rozszerzenie menedżera skryptów użytkownika.

(Mam już menedżera skryptów użytkownika, pozwól mi to zainstalować!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

Będziesz musiał zainstalować rozszerzenie menedżera stylów użytkownika, aby zainstalować ten styl.

Będziesz musiał zainstalować rozszerzenie menedżera stylów użytkownika, aby zainstalować ten styl.

Musisz zainstalować rozszerzenie menedżera stylów użytkownika, aby zainstalować ten styl.

(Mam już menedżera stylów użytkownika, pozwól mi to zainstalować!)

Autor
piknockyou
Dziennych instalacji
2
Wszystkich instalacji
5
Oceny
0 0 0
Wersja
4.2
Utworzono
29-12-2025
Zaktualizowano
31-12-2025
Rozmiar
67,4 KB
Licencja
AGPL-3.0
Dotyczy

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.