LMArena | Collapsible Code Blocks

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

目前為 2025-12-30 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

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

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

作者
piknockyou
評價
0 0 0
版本
3.9
建立日期
2025-12-29
更新日期
2025-12-30
尺寸
65.6 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.