Skip to main content

dev-command

Interact with the running VSCode extension via Playwright. Use when automating, testing, or debugging the OpenCode webview UI.

Jump to install

Source facts

Repository
cashew-labs/opencode-gui
Last source activity
March 3, 2026 at 02:53
Detected SKILL.md language
English
Stars
58
Forks
20

Install options

The review-first prompt is selected by default. You can switch to a direct command or download a local copy.

Review the source files

Read SKILL.md and any companion files shown by SkillsMP before deciding whether to install.

Showing SKILL.md

SKILL.md
Source instructions · Read-only preview
name
dev-command
description
Interact with the running VSCode extension via Playwright. Use when automating, testing, or debugging the OpenCode webview UI.
# Dev Command Launch and interact with the VSCode extension using `pnpm dev`. ## Commands ```bash pnpm dev # Launch VSCode in background tmux session pnpm dev exec "<code>" # Execute JS in the webview (frame/page/browser available) pnpm dev snapshot # Screenshot the VSCode window pnpm dev stop # Stop the session ``` ## Exec environment The `exec` command provides three objects: - **`frame`** — the webview `active-frame` (SolidJS UI). Use this for most interactions. - **`page`** — the top-level VSCode Electron page. Use for screenshots or VSCode-level actions. - **`browser`** — the Playwright Browser instance. ## Common selectors All selectors below target elements inside `frame`. ### Input ```bash # Type a message pnpm dev exec "await frame.locator('[contenteditable]').pressSequentially('hello world')" # Submit (Cmd+Enter) pnpm dev exec "await frame.locator('[contenteditable]').press('Meta+Enter')" # Clear and retype pnpm dev exec "await frame.locator('[contenteditable]').fill(''); await frame.locator('[contenteditable]').pressSequentially('new text')" ``` ### Buttons ```bash # Stop generation pnpm dev exec "await frame.locator('.shortcut-button--stop').click()" # Submit button pnpm dev exec "await frame.locator('.shortcut-button--secondary').click()" # New session pnpm dev exec "await frame.locator('.new-session-button').click()" # Session switcher pnpm dev exec "await frame.locator('.session-switcher-button').click()" ``` ### Permissions ```bash # Allow once pnpm dev exec "await frame.locator('.permission-button--primary').click()" # Allow always pnpm dev exec "await frame.locator('button[aria-label=\"Allow always\"]').click()" # Reject pnpm dev exec "await frame.locator('button[aria-label=\"Reject\"]').click()" # Allow all visible permissions pnpm dev exec "const btns = await frame.locator('.permission-button--primary').all(); for (const b of btns) await b.click()" ``` ### Messages ```bash # Get all message texts pnpm dev exec "const msgs = await frame.locator('.message-text').allTextContents(); return msgs" # Get last assistant message pnpm dev exec "const msgs = await frame.locator('.message--assistant .message-text').allTextContents(); return msgs[msgs.length - 1]" # Wait for assistant response pnpm dev exec "await frame.locator('.message--assistant').last().waitFor()" # Check if thinking pnpm dev exec "return await frame.locator('.loading-indicator').isVisible()" ``` ### Reading state ```bash # Get input text pnpm dev exec "return await frame.locator('[contenteditable]').textContent()" # Count messages pnpm dev exec "return await frame.locator('.message').count()" # Get session error pnpm dev exec "return await frame.locator('.session-error').textContent()" ``` ## Important notes - Do NOT pass `undefined` as a second argument to `frame.evaluate(() => ...)` — it causes "Too many arguments" errors. Just call with one arg. - Screenshots must be taken from `page`, not `frame` — CDP screenshot only works on top-level targets. - The webview frame takes ~10-15s to appear after VSCode starts. The `exec` command handles this automatically. - The input uses Tiptap (ProseMirror), so use `pressSequentially` instead of `fill` for realistic typing. `fill` works for clearing.
View on GitHub