# 13 — 下拉框自绘，以及热更新暴露出的两个调试服 bug

Status: resolved
Type: task

## 需求

> 把下拉选项框的样式同步一下

上一轮我说过："官方那个深色高亮当前项的下拉，用 `color-scheme: dark` 让原生 select 的弹出层走深色就够了……如果你觉得弹出层样式还是差得多，我再换成自绘的。" —— 现在换成自绘了。

## 为什么必须自绘

原生 `<select>` 的**弹出列表由操作系统绘制**，CSS 完全够不着。`color-scheme: dark` 只能把它整体变暗，
做不出官方那种"当前项高亮 + 悬停高亮"的列表——那需要控制每一行。

自绘之后闭合态与展开态都归自己管：

- 闭合态：`#2a2a2e` 底、`#3a3a40` 边、当前项文字 + 右侧 `▼`
- 展开态：`#232327` 底、当前项 `#3c3c46` 高亮、悬停 `#34343a`
- 键盘 Esc 收起、点外面收起、下方放不下就翻到上方

弹层挂在 `documentElement` 下（同面板与取色器）：挂在面板里会被 `paintProps` 重画时销毁，
挂在 body 里会被翻转/颜色选项的 `transform`/`filter` 波及。

## 顺带修掉的两个调试服 bug

做这一轮验证时撞出来的，都不是新引入的，是**一直都在**：

### ① `pnpm dev --with-sim` 根本起不来

`parseArgs` 把 `--with-sim` 当未知参数拒掉，而 `main()` 里那段
`process.argv.includes("--with-sim")` 永远走不到——**这个开关一直是死代码**。
现在显式放行并写进 HELP。

### ② 热更新重建会丢掉 `--with-sim`

初始构建带了 `--with-sim`，重建那一行没带。于是 `pnpm dev --with-sim` 在**第一次保存后**
会被悄悄换成干净构建——产物里的模拟器没了，而没人会想到是"保存"干的。
现在两处共用同一份 `buildFlags`。

## 一次差点混过去的空验证

第 ② 条我第一次是这么"验证"的：起调试服、改个 CSS、数一下模拟器还在不在 —— 结果是 4，看起来修好了。

其实**调试服因为参数不认识根本没起来**（就是 bug ①）。没有重建，当然还是 4。

> 一个不检查前置条件的验证，等于没有验证。

重写成 `tools/checks/verify-dev-flags.mts`：第一件事就是 `fetch("/")` 断言服务活着，不活就直接抛；
第二件事用"调试服已经能取到新 CSS"作为重建完成的判据，而不是干等固定秒数。

并且**证明它会红**：不带 `--with-sim` 启动、产物里先放好模拟器，跑同一个脚本 →
`✗ --with-sim 在热更新重建后仍然生效 → 4 → 0`。红了才说明它真的在测这件事。

## 验证

- `tools/checks/verify-panel.mts` 第 ⑨ 组：点开下拉 → 两个预设都在、当前项恰好一个高亮、
  弹层在 `documentElement` 下、选完收起、值下发给壁纸（`preset=kv37`）、按钮文字跟着换
- `tools/checks/verify-dev-flags.mts`：见上（含变红验证）
- 其余回归全绿：`pnpm check`、调试服与浏览器冒烟、热更新、四档自包含包 `file://`、
  静态托管预览、发布产物差异仅来自 `use_custom_audio`、6 组渲染与重构前逐像素相同

出图：`tools/checks/shot-panel.mts` 现在出三张——面板、取色器、下拉展开。

## 一处没查清的抖动

同一批里 `verify-panel` 曾失败过一次（连续跑两次 smoke 之后），单独跑与再跑两次都通过，
错误输出被 `Select-Object -Last 1` 截掉了，没留下现场。**不确定是测试自身的问题还是环境抖动**，
记在这里而不是当作没发生。再出现的话先保留完整输出。