菜单
Keep frontend markup + WebKit e2e specs in sync. Use when touching component markup, CSS classes, dialogs, or adding UI spec drives — load-bearing selectors, two-mock split (devMock.ts vs mock-backend.mjs), dialog-driving rules. Also when e2e spec times out silently.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
GitHub Actions CI pipeline conventions — job shape, caching, permissions, and action pinning. Use when asked to "set up CI", "add a GitHub Actions workflow", "fix the pipeline", or when creating/reviewing files under .github/workflows/ for Go or Node/TS projects.
Systematic root-cause debugging — reproduce, isolate, fix at the source, prove the fix. Use when the user reports a bug, an error, a crash, flaky behavior, "this doesn't work", "why is this failing", or pastes a stack trace or failing test output.
Production Go service conventions — project layout, config, slog logging, context propagation, graceful shutdown, error wrapping, plain-constructor DI, and table-driven tests. Use when building or reviewing a Go backend service or worker; triggers when the repo contains go.mod plus a long-running-process signal (HTTP/queue/DB usage, cmd/ layout), or when the user asks how to structure a Go service. For TUIs use go-tui; for desktop apps use wails3 — this skill's config/logging/error conventions still apply to their Go code.
Conventions for building Go terminal UIs with Bubble Tea v2, Bubbles v2, and Lip Gloss v2 (charm.land module path). Covers Elm-architecture discipline, tea.Cmd/tea.Msg side effects, sub-model composition, keymaps, styling, and testing. Use when writing or reviewing a Go TUI, terminal UI, or interactive CLI screen; when the user says "bubbletea", "bubbles", "lipgloss", "TUI", "terminal UI", or "charm"; or when go.mod imports charm.land/bubbletea, charm.land/bubbles, charm.land/lipgloss, or github.com/charmbracelet/bubbletea (v1 — flag for migration).
Behavior-preserving restructuring done safely — test net first, small verified steps, no mixed-in feature changes. Use when the user says "refactor", "clean up", "restructure", "extract", "rename", "split this file/function", "reduce duplication", or "make this testable".
Automated releases with conventional commits, release-please, and tag-triggered build workflows. Use when asked to "set up releases", "automate versioning", "add a changelog", "tag a release", "configure release-please", or "publish binaries on tag" — and when touching release-please-config.json, .release-please-manifest.json, .goreleaser.yml, or a CHANGELOG.md maintained by a bot.
| name | e2e-pairing |
| description | Keep frontend markup + WebKit e2e specs in sync. Use when touching component markup, CSS classes, dialogs, or adding UI spec drives — load-bearing selectors, two-mock split (devMock.ts vs mock-backend.mjs), dialog-driving rules. Also when e2e spec times out silently. |
frontend/tests/e2e/)Specs drive real WebKit, match by class, no fallback. Change one side → update other SAME commit.
.tree-leaf .tree-folder .drop-hover — Sidebar rows + drag target..tab-new .tab.active .tab-title .tab.active .tab-dot.on — TabBar.button.method-inline + .method-menu .method-opt — verb picker = custom dropdown, NOT <select>: open button, click .method-opt..url-icon-btn.dirty — dirty/Save reveal..dlg-input .dlg-ok (Cancel = first .dlg-btn) — in-app modal (components/Dialog.tsx via lib/dialog.ts)..tabs button (Docs), .docs-toolbar button (Edit/Preview), .docs-hint, iframe.docs-preview (sandbox="" + srcdoc)..code-editor — CM6 host (Body/Docs)..scm-open .scm-row .scm-badge .scm-section-head .scm-field-label .scm-old .scm-new .scm-raw .scm-diff-empty — source-control modal (SourceControlPanel.tsx).Native window.prompt/confirm/alert gone (commit 0bc185f). Specs must drive .dlg-input/.dlg-ok — page.on("dialog") never fires on custom modal, assert times out silently. New promptDialog/confirmDialog call on tested flow: spec drives <Dialog/>.
frontend/src/lib/devMock.ts (webServer runs bun run dev:mock → vite --mode test → installDevMock). Bound App method spec calls (e.g. PickFile) MUST exist there — missing method NOT error, flow silently no-ops.tests/visual/mock-backend.mjs = separate visual screenshot harness (shoot.mjs, addInitScript). Add methods only if visual harness renders path; Git*/meta methods used by settings modals or SCM panel always need it.WebKit can't pierce sandbox="" srcdoc iframe → assert srcdoc attribute, never frameLocator().locator() inside.
Window must never scroll: .panes needs definite grid-template-rows; html,body stay overflow:hidden. height:100% child (CM6) of indefinite parent overflows shell. Guarded by shell-no-scroll.spec.
cd frontend && bun run test:e2e (needs WebKit deps; CI has them).