LMArena | Collapsible Code Blocks

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

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

作者
piknockyou
日安装量
1
总安装量
2
评分
0 0 0
版本
4.2
创建于
2025-12-29
更新于
2025-12-31
大小
67.4 KB
许可证
AGPL-3.0
适用于

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.