mirror of
https://github.com/cline/cline.git
synced 2026-09-11 05:47:07 +08:00
Compare commits
4
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
86df86444d | ||
|
|
e81b9d096f | ||
|
|
f907749c2c | ||
|
|
99acc2247a |
@@ -47,7 +47,7 @@ memory-bank/
|
||||
- **"initialize memory bank"** - Creates the initial structure for a new project
|
||||
- **"update memory bank"** - Triggers a full documentation review and update
|
||||
|
||||
These work alongside Cline's built-in [slash commands](/core-workflows/using-commands). In particular, [`/newtask`](/core-workflows/using-commands#newtask) and [`/smol`](/core-workflows/using-commands#smol) help you manage context windows without losing progress.
|
||||
These work alongside Cline's built-in [slash commands](/core-workflows/using-commands). In particular, [`/newtask`](/core-workflows/using-commands#newtask) and [`/compact`](/core-workflows/using-commands#compact) help you manage context windows without losing progress.
|
||||
|
||||
## Managing Context Windows
|
||||
|
||||
|
||||
@@ -8,6 +8,10 @@ Checkpoints let you undo code changes without losing your conversation. Every ti
|
||||
|
||||
This changes how you work with Cline. Instead of carefully reviewing every change before approving, you can let Cline move fast and roll back if something goes wrong. The cost of a mistake drops to nearly zero.
|
||||
|
||||
<Warning>
|
||||
Checkpoints are unavailable in VSCode Extension 4.0 with the new harness migration. The Cline team is working on improving the checkpoint experience in upcoming versions.
|
||||
</Warning>
|
||||
|
||||
<Tip>
|
||||
Checkpoints are enabled by default. See [Enable or Disable Checkpoints](#enable-or-disable-checkpoints) if you need to turn them off.
|
||||
</Tip>
|
||||
|
||||
@@ -80,17 +80,6 @@ When enabled, switching between Plan and Act mode automatically switches to the
|
||||
| Maximum quality | Claude Opus | Claude Sonnet |
|
||||
| Speed-focused | Gemini 3 Flash | Cerebras |
|
||||
|
||||
## Using `/deep-planning`
|
||||
|
||||
For complex tasks that need thorough analysis, use the `/deep-planning` slash command. This triggers an extended planning session where Cline:
|
||||
|
||||
1. Explores the codebase systematically
|
||||
2. Identifies all affected files and dependencies
|
||||
3. Creates a detailed implementation plan
|
||||
4. Asks clarifying questions before proceeding
|
||||
|
||||
The deep planning prompt is optimized for each model family, so it adapts to the strengths of whatever model you're using. See [/deep-planning](/core-workflows/using-commands#deep-planning) for more details.
|
||||
|
||||
## Choosing the Right Approach by Task Size
|
||||
|
||||
### Small tasks: Act mode only
|
||||
@@ -105,9 +94,9 @@ For most development work, start in Plan mode to understand the scope and approa
|
||||
|
||||
**Examples:** Add a new API endpoint, implement a UI component, fix a bug that requires investigation, refactor a single module.
|
||||
|
||||
### Large tasks: Use `/deep-planning`
|
||||
### Large tasks: Plan → Act with multiple cycles
|
||||
|
||||
For complex features that span multiple files, require architectural decisions, or will take multiple sessions to complete, use the `/deep-planning` slash command. This creates a detailed implementation plan that Cline can reference throughout the work.
|
||||
For complex features that span multiple files, require architectural decisions, or will take multiple sessions to complete, start in Plan mode to map out the full scope. Break the work into manageable chunks, and cycle between Plan and Act modes as needed. Use `/newtask` to hand off progress when your context gets full.
|
||||
|
||||
**Examples:** Add a new feature across frontend and backend, major refactoring across the codebase, implementing a new system or integration, multi-step migrations.
|
||||
|
||||
|
||||
@@ -17,7 +17,7 @@ Type `/` in the chat input to see available slash commands:
|
||||
| Command | What It Does |
|
||||
|---------|--------------|
|
||||
| `/newtask` | Start fresh task with distilled context from current conversation |
|
||||
| `/smol` | Compress conversation history while preserving essential context |
|
||||
| `/compact` | Compress conversation history while preserving essential context |
|
||||
| `/newrule` | Create a rule file to teach Cline your preferences |
|
||||
| `/deep-planning` | Investigate codebase, plan thoroughly, then create implementation task |
|
||||
| `/reportbug` | Report a bug with diagnostic info |
|
||||
@@ -28,11 +28,11 @@ Type `/` in the chat input to see available slash commands:
|
||||
|
||||
I use `/newtask` when working through complex implementations. If I've completed 3 steps of a 10-step process and my context is already 75% full, I use `/newtask` to extract key decisions, file changes, and progress without all the noise.
|
||||
|
||||
### /smol
|
||||
### /compact
|
||||
|
||||
`/smol` (or its alias `/compact`) compresses your conversation history while preserving essential context. Unlike `/newtask` which creates a new task, `/smol` condenses your current conversation into a comprehensive summary, freeing up context window space while allowing you to continue working in the same task.
|
||||
`/compact` compresses your conversation history while preserving essential context. Unlike `/newtask` which creates a new task, `/compact` condenses your current conversation into a comprehensive summary, freeing up context window space while allowing you to continue working in the same task.
|
||||
|
||||
Use `/smol` when you're deep into a debugging session or brainstorming and need to continue in the same task without losing the insights you've gained. For more details, see [Smol Command](#smol).
|
||||
Use `/compact` when you're deep into a debugging session or brainstorming and need to continue in the same task without losing the insights you've gained. For more details, see [Compact Command](#compact).
|
||||
|
||||
### /newrule
|
||||
|
||||
|
||||
+11
-6
@@ -154,7 +154,8 @@
|
||||
"core-workflows/using-commands",
|
||||
"core-workflows/checkpoints",
|
||||
"cli/agent-teams",
|
||||
"features/subagents"
|
||||
"features/subagents",
|
||||
"features/using-browser"
|
||||
]
|
||||
},
|
||||
{
|
||||
@@ -458,11 +459,11 @@
|
||||
},
|
||||
{
|
||||
"source": "/customization/focus-chain",
|
||||
"destination": "/core-workflows/using-commands#deep-planning"
|
||||
"destination": "/core-workflows/plan-and-act"
|
||||
},
|
||||
{
|
||||
"source": "/features/deep-planning",
|
||||
"destination": "/core-workflows/using-commands#deep-planning"
|
||||
"destination": "/core-workflows/plan-and-act"
|
||||
},
|
||||
{
|
||||
"source": "/customization/auto-approve",
|
||||
@@ -650,11 +651,15 @@
|
||||
},
|
||||
{
|
||||
"source": "/features/slash-commands/deep-planning",
|
||||
"destination": "/core-workflows/using-commands#deep-planning"
|
||||
"destination": "/core-workflows/plan-and-act"
|
||||
},
|
||||
{
|
||||
"source": "/features/slash-commands/compact",
|
||||
"destination": "/core-workflows/using-commands#compact"
|
||||
},
|
||||
{
|
||||
"source": "/features/slash-commands/smol",
|
||||
"destination": "/core-workflows/using-commands#smol"
|
||||
"destination": "/core-workflows/using-commands#compact"
|
||||
},
|
||||
{
|
||||
"source": "/features/slash-commands/new-rule",
|
||||
@@ -666,7 +671,7 @@
|
||||
},
|
||||
{
|
||||
"source": "/features/focus-chain",
|
||||
"destination": "/core-workflows/using-commands#deep-planning"
|
||||
"destination": "/core-workflows/plan-and-act"
|
||||
},
|
||||
{
|
||||
"source": "/features/skills",
|
||||
|
||||
@@ -35,10 +35,6 @@ Cline emits events across several categories, each prefixed with a namespace:
|
||||
Hook discovery, execution, and context modification
|
||||
</Card>
|
||||
|
||||
<Card title="worktree.*" icon="code-branch">
|
||||
Git worktree operations and merge handling
|
||||
</Card>
|
||||
|
||||
<Card title="host.*" icon="computer">
|
||||
Host environment detection
|
||||
</Card>
|
||||
@@ -160,13 +156,6 @@ Core events tracking task lifecycle, conversation turns, tool usage, and executi
|
||||
|
||||
| Event | Description | Key Attributes |
|
||||
|-------|-------------|----------------|
|
||||
| `task.focus_chain_enabled` | Focus chain feature enabled | task_id |
|
||||
| `task.focus_chain_disabled` | Focus chain feature disabled | task_id |
|
||||
| `task.focus_chain_progress_first` | First focus-chain checklist/progress emitted | items_count |
|
||||
| `task.focus_chain_progress_update` | Subsequent focus-chain checklist/progress updates | items_total, items_completed |
|
||||
| `task.focus_chain_incomplete_on_completion` | Task completed while focus-chain checklist still incomplete | items_remaining |
|
||||
| `task.focus_chain_list_opened` | Focus-chain markdown/list opened by user | task_id |
|
||||
| `task.focus_chain_list_written` | Focus-chain markdown/list written/saved | task_id |
|
||||
| `task.subagent_enabled` | Subagents feature enabled | task_id |
|
||||
| `task.subagent_disabled` | Subagents feature disabled | task_id |
|
||||
| `task.subagent_started` | Subagent execution started | subagent_id, prompt_length |
|
||||
@@ -287,31 +276,6 @@ The `hooks.execution` event tracks the complete lifecycle with a `status` attrib
|
||||
}
|
||||
```
|
||||
|
||||
## Worktree Events
|
||||
|
||||
Events related to Git worktree operations.
|
||||
|
||||
| Event | Description | Key Attributes |
|
||||
|-------|-------------|----------------|
|
||||
| `worktree.view_opened` | Worktree view opened | user_id |
|
||||
| `worktree.created` | Worktree create event | success, branch_name, duration_ms |
|
||||
| `worktree.merge_attempted` | Worktree merge attempt event | has_conflicts, delete_option_chosen |
|
||||
|
||||
### Example: worktree.created
|
||||
|
||||
```json
|
||||
{
|
||||
"event": "worktree.created",
|
||||
"timestamp": "2026-03-05T14:22:00Z",
|
||||
"attributes": {
|
||||
"success": true,
|
||||
"branch_name_hash": "abc123",
|
||||
"duration_ms": 1250,
|
||||
"parent_branch": "main"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## Host Events
|
||||
|
||||
Events related to host environment detection.
|
||||
@@ -378,7 +342,7 @@ Sensitive information is hashed or anonymized:
|
||||
- **File paths**: Hashed to preserve privacy
|
||||
- **Command content**: Hashed, not logged verbatim
|
||||
- **User identifiers**: Anonymized tokens
|
||||
- **Branch names**: Hashed in worktree events
|
||||
- **Branch names**: Hashed to preserve privacy
|
||||
|
||||
<Warning>
|
||||
File paths, command arguments, and code content are **never** included in raw form. Only hashes or anonymized identifiers are used.
|
||||
|
||||
@@ -0,0 +1,211 @@
|
||||
---
|
||||
title: "Using Browser"
|
||||
sidebarTitle: "Using Browser"
|
||||
description: "Automate web browsers with the Agent Browser plugin — navigate pages, fill forms, click elements, take screenshots, and extract data."
|
||||
---
|
||||
|
||||
The Agent Browser plugin gives Cline the ability to drive a real Chrome/Chromium browser via the Chrome DevTools Protocol (CDP). Instead of parsing raw HTML, it uses accessibility-tree snapshots with compact element references (`@e1`, `@e2`, …) so Cline can interact with pages efficiently — typically in 200–400 tokens per snapshot.
|
||||
|
||||
## Installing the Agent Browser Plugin
|
||||
|
||||
<Steps>
|
||||
<Step title="Install Node.js">
|
||||
Ensure you have Node.js 20+ installed (22 recommended).
|
||||
</Step>
|
||||
<Step title="Install the plugin">
|
||||
```bash
|
||||
cline plugin install npm:agent-browser
|
||||
```
|
||||
This installs the plugin globally so it is available in all Cline sessions.
|
||||
</Step>
|
||||
<Step title="Install Chrome for Testing">
|
||||
The plugin bundles a managed Chrome download. Run the install command once to fetch it:
|
||||
```bash
|
||||
agent-browser install
|
||||
```
|
||||
On Linux, use `agent-browser install --with-deps` to also install required system libraries.
|
||||
</Step>
|
||||
<Step title="Verify installation">
|
||||
Run `agent-browser doctor` to diagnose any issues with the environment, Chrome binary, or daemon. You can also check that the plugin is loaded with `cline config`.
|
||||
</Step>
|
||||
</Steps>
|
||||
|
||||
<Note>
|
||||
If the managed Chrome for Testing download fails or the binary is corrupted, you can connect to a system-installed Google Chrome instead. Launch Chrome with remote debugging enabled and pass `--executable-path` or `--cdp <port>` to point agent-browser at it. See [Troubleshooting](#troubleshooting) below.
|
||||
</Note>
|
||||
|
||||
## How the Plugin Mechanism Works
|
||||
|
||||
Cline plugins are modular extensions that add new tools, hooks, or capabilities to the agent. The Agent Browser plugin follows the same [plugin system](/customization/plugins) used by all Cline extensions:
|
||||
|
||||
1. **Installation** — The plugin is installed globally (available in all sessions) or per-project via the `cline plugin install` command. It is stored under `~/.cline/plugins/` (global) or `.cline/plugins/` (project-scoped).
|
||||
|
||||
2. **Registration** — When Cline starts a session, it loads installed plugins and registers any tools they expose. The Agent Browser plugin registers browser-related tools (open, snapshot, click, fill, screenshot, etc.) that Cline can call during a task.
|
||||
|
||||
3. **Skill Discovery** — The plugin also ships a [skill](/customization/skills) that teaches Cline _how_ to use the browser tools effectively. At startup, only the skill's metadata (name + description, ~100 tokens) is loaded. When your request matches the skill — for example, "open a website" or "take a screenshot" — Cline activates the skill and loads the full workflow instructions on demand.
|
||||
|
||||
4. **Execution** — Cline issues browser commands as shell calls to the `agent-browser` CLI. The CLI communicates with Chrome over CDP, performs the action (navigate, click, fill, etc.), and returns the result. The browser persists across commands so a multi-step interaction feels like a single session.
|
||||
|
||||
```
|
||||
You: "open google.com"
|
||||
↓
|
||||
Cline activates the agent-browser skill
|
||||
↓
|
||||
Cline calls: agent-browser open https://google.com
|
||||
↓
|
||||
agent-browser CLI → Chrome (via CDP)
|
||||
↓
|
||||
Result returned to Cline → Cline responds
|
||||
```
|
||||
|
||||
## The Core Workflow
|
||||
|
||||
Once installed, Cline can drive the browser through a simple loop:
|
||||
|
||||
```bash
|
||||
agent-browser open <url> # 1. Open a page
|
||||
agent-browser snapshot -i # 2. See what's on it (interactive elements only)
|
||||
agent-browser click @e3 # 3. Act on refs from the snapshot
|
||||
agent-browser snapshot -i # 4. Re-snapshot after any page change
|
||||
```
|
||||
|
||||
Element references (`@e1`, `@e2`, …) are assigned fresh on every snapshot. They become **stale the moment the page changes** — after clicks that navigate, form submits, or dynamic re-renders. Always re-snapshot before your next interaction.
|
||||
|
||||
## Sample Prompts
|
||||
|
||||
Here are example prompts you can use with Cline to trigger the Agent Browser plugin:
|
||||
|
||||
### Open a page
|
||||
|
||||
```
|
||||
can you use the agent browser skill to open a new page for me
|
||||
```
|
||||
|
||||
Cline will activate the agent-browser skill, install the CLI if needed, and open a blank page in a headless Chrome session.
|
||||
|
||||
### Navigate to a website
|
||||
|
||||
```
|
||||
help me navigate to google.com
|
||||
```
|
||||
|
||||
Cline runs `agent-browser open https://google.com` and confirms the page loaded.
|
||||
|
||||
### Take a screenshot
|
||||
|
||||
```
|
||||
can you take a screenshot and save locally
|
||||
```
|
||||
|
||||
Cline runs `agent-browser screenshot /path/to/file.png` and saves the image to your workspace. This is especially useful because the browser runs headless by default — screenshots let you see what's on the page.
|
||||
|
||||
### Search and interact
|
||||
|
||||
```
|
||||
open duckduckgo.com, search for "cline ai", and take a screenshot of the results
|
||||
```
|
||||
|
||||
Cline will:
|
||||
1. Open the page with `agent-browser open`
|
||||
2. Snapshot the interactive elements to find the search box
|
||||
3. Fill the search box with `agent-browser fill`
|
||||
4. Press Enter with `agent-browser press`
|
||||
5. Wait for results to load
|
||||
6. Take a screenshot with `agent-browser screenshot`
|
||||
|
||||
### Fill out a form
|
||||
|
||||
```
|
||||
go to the login page at https://example.com/login and fill in the email field with user@example.com
|
||||
```
|
||||
|
||||
Cline snapshots the page to locate form fields by their `@eN` refs, then uses `agent-browser fill` to enter values.
|
||||
|
||||
## Common Commands
|
||||
|
||||
| Command | Purpose |
|
||||
|---------|---------|
|
||||
| `agent-browser open <url>` | Navigate to a URL |
|
||||
| `agent-browser snapshot -i` | List interactive elements with refs |
|
||||
| `agent-browser click @e1` | Click an element by ref |
|
||||
| `agent-browser fill @e1 "text"` | Enter text into an input |
|
||||
| `agent-browser press Enter` | Press a keyboard key |
|
||||
| `agent-browser screenshot file.png` | Capture a screenshot |
|
||||
| `agent-browser get text @e1` | Extract visible text from an element |
|
||||
| `agent-browser get url` | Get the current page URL |
|
||||
| `agent-browser close` | Close the current tab |
|
||||
| `agent-browser close --all` | Close the browser session |
|
||||
|
||||
## Global Flags
|
||||
|
||||
| Flag | Description |
|
||||
|------|-------------|
|
||||
| `--headed` | Show the browser window (default is headless) |
|
||||
| `--cdp <port>` | Connect to a Chrome instance on a specific CDP port |
|
||||
| `--auto-connect` | Auto-discover and connect to a running Chrome |
|
||||
| `--executable-path <path>` | Use a custom Chrome executable |
|
||||
| `--session <name>` | Use an isolated browser session |
|
||||
| `--profile <name>` | Use a Chrome profile (login state persists) |
|
||||
| `--json` | Output results as JSON for programmatic parsing |
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
<AccordionGroup>
|
||||
<Accordion title="Chrome for Testing binary is corrupted or won't launch">
|
||||
The managed Chrome download can be truncated by network issues or proxies. If you see `dlopen` errors about load commands extending beyond the end of a file, the binary is corrupted.
|
||||
|
||||
**Fix:** Delete the corrupted binary and reinstall:
|
||||
|
||||
```bash
|
||||
rm -rf ~/.agent-browser/browsers/chrome-*/
|
||||
agent-browser install
|
||||
```
|
||||
|
||||
Alternatively, use your system-installed Google Chrome:
|
||||
|
||||
```bash
|
||||
# Launch Chrome with remote debugging
|
||||
"/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" \
|
||||
--remote-debugging-port=9222 \
|
||||
--user-data-dir=/tmp/agent-browser-chrome-profile \
|
||||
--no-first-run \
|
||||
--headless=new &
|
||||
|
||||
# Connect agent-browser to it
|
||||
agent-browser --executable-path "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" open about:blank
|
||||
```
|
||||
</Accordion>
|
||||
|
||||
<Accordion title="Browser runs but I can't see the window">
|
||||
By default, agent-browser launches Chrome in **headless mode** — there is no visible window. This is normal and intended for automation.
|
||||
|
||||
To see the browser window, either:
|
||||
- Pass `--headed` when opening a page: `agent-browser open https://example.com --headed`
|
||||
- Or ask Cline to take a screenshot: `agent-browser screenshot page.png`
|
||||
</Accordion>
|
||||
|
||||
<Accordion title="Element refs (@e1, @e2) are not working">
|
||||
Refs are assigned fresh on every snapshot and become stale after any page change (navigation, click, form submit, dynamic re-render). Always re-snapshot before your next interaction:
|
||||
|
||||
```bash
|
||||
agent-browser snapshot -i # get fresh refs
|
||||
agent-browser click @e5 # act immediately
|
||||
```
|
||||
</Accordion>
|
||||
|
||||
<Accordion title="Diagnosing general issues">
|
||||
Run the built-in diagnostic tool for a full environment check:
|
||||
|
||||
```bash
|
||||
agent-browser doctor # full diagnosis
|
||||
agent-browser doctor --fix # also attempt repairs (reinstall Chrome, purge state)
|
||||
agent-browser doctor --offline # fast, local-only check
|
||||
```
|
||||
</Accordion>
|
||||
</AccordionGroup>
|
||||
|
||||
## Learn More
|
||||
|
||||
- [Plugins](/customization/plugins) — How the Cline plugin system works
|
||||
- [Skills](/customization/skills) — How Cline loads instructions on demand
|
||||
- [MCP Overview](/mcp/mcp-overview) — Model Context Protocol for external tool integration
|
||||
@@ -258,5 +258,4 @@ These same patterns work for any project, from simple scripts to full applicatio
|
||||
## Need Help?
|
||||
|
||||
- **Start a fresh conversation**: Type `/new` in the chat input to begin a new task
|
||||
- **Report issues**: Use `/reportbug` to help us improve
|
||||
- **Get support**: Join our [Discord community](https://discord.gg/cline)
|
||||
|
||||
Reference in New Issue
Block a user