cline/docs/tools-reference/browser-automation.mdx

---
title: "Browser Automation"
sidebarTitle: "Browser Automation"
description: "Interact with websites through Cline's controlled browser instance."
---

Browser automation allows Cline to interact with web content directly through a controlled Chrome instance. It can view websites, test applications, fill forms, and capture screenshots.

## Capabilities

- Visit websites and view content
- Test locally running web applications
- Fill out forms and click elements
- Capture screenshots
- Monitor console logs and errors
- Scroll through pages

## Basic Commands

Ask Cline to use the browser with simple instructions:

```text
Use the browser to check https://example.com
```

```text
Click the login button
```

```text
Type 'Hello world' in the search box
```

```text
Scroll down to see more content
```

```text
Close the browser
```

## Example Workflows

### Testing a Web Application

```text
Start my React app with "npm start" and check if it's working at http://localhost:3000
```

### Analyzing a Website

```text
Visit https://example.com and tell me about its design and layout
```

### Form Testing

```text
Go to https://example.com/contact, fill out the form with test data, and submit
```

## Important Details

### One Browser at a Time

Cline can only run one browser at a time. To visit a different site:
- Navigate to a new URL in the same session
- Or close the browser and open a new one

### Close Before Other Tools

Close the browser before editing files or running commands:

```text
Close the browser and update the CSS to fix the alignment issue we saw
```

### Fixed Viewport

The browser has a fixed 900x600 pixel viewport. Cline shares screenshots after each action so you see exactly what it sees.

### Console Logs

Cline captures browser console logs, which is helpful for debugging. These are included with each screenshot.

## Common Use Cases

- **Web Development**: Test websites and applications
- **UI/UX Review**: Get feedback on design and usability
- **Content Research**: Browse to gather information
- **Form Testing**: Verify forms work correctly
- **Responsive Testing**: Check appearance at different sizes

## Troubleshooting

| Issue | Solution |
|-------|----------|
| Website doesn't load | Use full URL with http:// or https:// |
| Click doesn't work | Describe element location more precisely |
| Browser seems stuck | Close browser and try again |

## WSL Configuration

When running VS Code in WSL, configure Windows to allow WSL to connect to Chrome:

### Allow Connection (PowerShell as Admin)

```powershell
New-NetFirewallRule -DisplayName "WSL Chrome Debug" -Direction Inbound -LocalPort 9222 -Protocol TCP -Action Allow
```

### Configure Cline

1. Open VS Code settings
2. Search for "Cline: Chrome Executable Path"
3. Set to your Chrome path (e.g., `C:\Program Files\Google\Chrome\Application\chrome.exe`)