☰

Google AI Studio | Toggle Code Blocks

Toggle all code blocks open/closed in Google AI Studio with lazy loading support.

如何安装

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

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

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

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

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

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

（我已经安装了用户脚本管理器，让我安装！）

如何安装

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

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

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

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

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

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

（我已经安装了用户样式管理器，让我安装！）

作者
piknockyou
日安装量
0
总安装量
2
评分
0 0 0
版本
1.4
创建于
2025-12-21
更新于
2025-12-22
大小
10.2 KB
许可证
AGPL-3.0
适用于

Google AI Studio | Toggle Code Blocks

Introduces the ability to manage code block visibility in Google AI Studio. Adds a toolbar button to instantly collapse or expand all code snippets for a cleaner workspace.

Features

  • Smart Initial Action: The first click always collapses all code blocks to immediately de-clutter the view.
  • Persistent Mode: Your preference (Collapse or Expand) is saved to local storage and persists across page reloads and different chats.
  • Lazy Loading Support: Automatically manages code blocks that appear as you scroll up or as the AI generates them in real-time.
  • Color-Coded Feedback:
    • Gray Icon: Inactive (Click to activate Collapse Mode).
    • Blue Icon: Collapse Mode active (New blocks will auto-collapse).
    • Amber Icon: Expand Mode active (New blocks will auto-expand).
  • Toolbar Integration: Adds a native-style button to the top-right toolbar that matches the Google AI Studio aesthetic.

Installation

Requirements

Steps

  1. Install a userscript manager.
  2. Install this script.
  3. Open any prompt in Google AI Studio.

Usage

  1. Locate the button: Look for the chevron icon in the toolbar next to the "More options" (⋮) button.
  2. First Click: Activates Collapse Mode (Blue). All current and future code blocks will stay closed.
  3. Second Click: Switches to Expand Mode (Amber). All current and future code blocks will stay open.
  4. Third Click: Toggles back to Collapse Mode (Blue).

How It Works

  • Persistence: Uses localStorage to remember your toggle state across page reloads and chat switches.
  • Lazy Load Observer: Watches for new ms-code-block elements being added to the DOM and automatically applies your chosen mode (Collapse/Expand) as they appear.
  • Smart Logic: Includes a per-block debounce (500ms) to prevent flickering during rapid scrolling or AI generation.
  • Toolbar Observer: Uses a MutationObserver to ensure the button persists in the toolbar during SPA navigation between chats.

Technical Details

  • Icon: Uses standard Material Symbols (expand_less, expand_more) natively available in the app resources.
  • Styling: Injects minimal CSS to match the native toolbar layout.