# 5-44 Block menu 打开后泄露 Material Symbols ligature 文本

> 创建时间：2026-07-08
> 状态：`done`
> Owner：`05-editor-mainline`

## 现象

在 mnote 主编辑器中 hover 到块手柄并点开块菜单后，菜单项图标位置直接显示 `auto_awesome`、`autorenew`、`chevron_right`、`content_copy`、`format_align_center` 等英文 ligature 文本，导致菜单宽度和排版明显错乱。

复现路径：

1. 打开本地主编辑器文档。
2. hover 到正文块左侧手柄。
3. 点击手柄打开块菜单。
4. 观察块菜单内图标列。

失败证据：

- `tmp/block-handle-menu-display-diagnostic/after-click.png`
- `tmp/block-handle-menu-display-diagnostic/metrics.json`

## 根因

主编辑器 island 的 icon helper 和部分动态菜单项只输出了 `class="material-symbols-outlined"` 加 ligature 文本，没有输出 `data-icon`。当前 mnote 主壳使用本地 SVG mask 作为 Material Symbols fallback，fallback CSS 只对带 `data-icon` 的节点生效；缺少 `data-icon` 时，浏览器没有 Material Symbols 字体可用，就直接把 ligature 文本当普通文本显示出来。

## 修复

- `material_icon()` 改为输出 `data-icon=<name>`，并移除可见 ligature 文本。
- block transform 子菜单和 slash 菜单动态图标同步输出 `data-icon`，不再把 ligature 作为可见文本。
- 补齐主壳 CSS 中块菜单常用 icon 的本地 fallback，确保无外部 Material Symbols 字体时仍能显示为稳定图标。
- 重新执行 wasm release build 与 `wasm-bindgen`，更新 `rust/spikes/leptos-tiptap-spike/generated/island/*` 产物。

## 验收

- `cargo check --manifest-path rust/spikes/leptos-tiptap-spike/Cargo.toml` 通过，只有既有 warning。
- `cargo build --manifest-path rust/spikes/leptos-tiptap-spike/Cargo.toml --target wasm32-unknown-unknown --release` 通过，只有既有 warning。
- `wasm-bindgen rust/spikes/leptos-tiptap-spike/target/wasm32-unknown-unknown/release/mnote_leptos_tiptap_spike.wasm --target web --out-dir rust/spikes/leptos-tiptap-spike/generated/island --out-name mnote-leptos-tiptap-spike-island` 通过。
- `node scripts/task489-block-menu-delete-undo-smoke.js` 通过。
- 浏览器诊断确认块菜单 `leaked=false`，12 个菜单项正常渲染，图标节点宽高恢复为 `20x20`。
- 修复后截图：`tmp/block-handle-menu-display-diagnostic/after-click-fixed.png`。

## 未覆盖

- 本轮只修复手柄菜单与 editor runtime 图标文本泄露；没有扩大到全站所有未带 `data-icon` 的历史图标节点。