### Install Dependencies
Source: https://github.com/browser-use/cdp-use/blob/main/README.md
Clone the repository and install project dependencies using uv or pip.
```bash
git clone https://github.com/browser-use/cdp-use
cd cdp-use
uv sync # or pip install -r requirements.txt
```
--------------------------------
### start()
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/cdp-client.md
Establishes the WebSocket connection and starts the message handler task. It raises a RuntimeError if the client is already started.
```APIDOC
## start()
### Description
Establish the WebSocket connection and start the message handler task.
### Method
`async start() -> None`
### Raises
- `RuntimeError` - If client is already started
### Example
```python
client = CDPClient("ws://localhost:9222/devtools/browser/...")
await client.start()
try:
await client.send.Page.enable()
finally:
await client.stop()
```
```
--------------------------------
### PageRegistration Example
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/event-system.md
Shows the structure of a domain-specific registration class, using PageRegistration as an example, with methods for various page-related events.
```python
class PageRegistration:
def domContentEventFired(
self,
callback: Callable[[DomContentEventFiredEvent, Optional[str]], None],
) -> None
def fileChooserOpened(
self,
callback: Callable[[FileChooserOpenedEvent, Optional[str]], None],
) -> None
def frameAttached(
self,
callback: Callable[[FrameAttachedEvent, Optional[str]], None],
) -> None
def frameDetached(
self,
callback: Callable[[FrameDetachedEvent, Optional[str]], None],
) -> None
# ... more event methods
```
--------------------------------
### Basic CDPClient Setup
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Establishes a basic connection to the Chrome DevTools Protocol and enables page domain events.
```python
import asyncio
from cdp_use.client import CDPClient
async def main():
async with CDPClient("ws://localhost:9222/devtools/page/...") as client:
await client.send.Page.enable()
print("Ready!")
asyncio.run(main())
```
--------------------------------
### __aenter__()
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/cdp-client.md
Async context manager entry point. This method internally calls `start()` to initiate the client connection and returns the CDPClient instance.
```APIDOC
## __aenter__()
### Description
Async context manager entry. Calls `start()` internally.
### Method
`async __aenter__() -> CDPClient`
### Returns
- The CDPClient instance itself
### Example
```python
async with CDPClient(url) as client:
result = await client.send.Page.navigate(params={"url": "https://example.com"})
```
```
--------------------------------
### Start CDP Client Connection
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/cdp-client.md
Establishes a WebSocket connection to the Chrome DevTools Protocol endpoint and starts the message handler. Ensure the client is stopped afterwards.
```python
client = CDPClient("ws://localhost:9222/devtools/browser/...")
await client.start()
try:
await client.send.Page.enable()
finally:
await client.stop()
```
--------------------------------
### PageRegistration Example
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/event-system.md
An example of the `PageRegistration` class, showing the methods available for registering callbacks for Page domain events. These methods are named according to CDP specifications and accept a callback function.
```APIDOC
## PageRegistration Example
```python
class PageRegistration:
def domContentEventFired(
self,
callback: Callable[[DomContentEventFiredEvent, Optional[str]], None],
) -> None
def fileChooserOpened(
self,
callback: Callable[[FileChooserOpenedEvent, Optional[str]], None],
) -> None
def frameAttached(
self,
callback: Callable[[FrameAttachedEvent, Optional[str]], None],
) -> None
def frameDetached(
self,
callback: Callable[[FrameDetachedEvent, Optional[str]], None],
) -> None
# ... more event methods
```
```
--------------------------------
### CDPClient Setup with Retries
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Implements a robust client connection with retry logic for handling transient network errors or server unavailability.
```python
import asyncio
from cdp_use.client import CDPClient
async def create_client_with_retry(
url: str,
max_retries: int = 3,
retry_delay: float = 1.0
) -> CDPClient:
for attempt in range(max_retries):
try:
client = CDPClient(url)
await client.start()
return client
except (ConnectionError, RuntimeError) as e:
if attempt < max_retries - 1:
await asyncio.sleep(retry_delay)
else:
raise
async def main():
try:
client = await create_client_with_retry(
"ws://localhost:9222/devtools/page/"
)
async with client:
# Use client
pass
except ConnectionError as e:
print(f"Failed to connect: {e}")
asyncio.run(main())
```
--------------------------------
### Type Safety Examples
Source: https://github.com/browser-use/cdp-use/blob/main/README.md
Demonstrates fully typed parameters and return types, and highlights how type errors are caught at development time.
```python
# ✅ Fully typed parameters
await cdp.send.Runtime.evaluate(params={
"expression": "document.title",
"returnByValue": True
})
# ✅ Return types are fully typed
result = await cdp.send.DOM.getDocument(params={"depth": 1})
node_id: int = result["root"]["nodeId"] # Full IntelliSense support
# ❌ Type errors caught at development time
await cdp.send.DOM.getDocument(params={"invalid": "param"}) # Type error!
```
--------------------------------
### Mobile Emulation and Capture with CDPClient
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/page-domain.md
This example demonstrates how to configure the browser to emulate a mobile device, navigate to a URL, capture a screenshot, and print the page to a PDF. Ensure the CDPClient is initialized with a valid URL.
```python
async with CDPClient(url) as client:
# Set mobile device
await client.send.Page.setDeviceMetricsOverride(
params={
"width": 375,
"height": 667,
"deviceScaleFactor": 2,
"mobile": True
}
)
# Navigate
await client.send.Page.navigate(
params={"url": "https://example.com"}
)
# Capture
screenshot = await client.send.Page.captureScreenshot()
# Print to PDF
pdf = await client.send.Page.printToPDF(
params={"landscape": True}
)
```
--------------------------------
### Async Event Handler Example
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/event-system.md
Shows how to define and register an asynchronous event handler for network requests, including awaiting other asynchronous operations within the handler.
```python
async def on_request_will_be_sent(event: RequestWillBeSentEvent, session_id: Optional[str]) -> None:
url = event['request']['url']
print(f"Request: {url}")
# Can await async operations
response = await some_async_operation(url)
print(f"Response: {response}")
client.register.Network.requestWillBeSent(on_request_will_be_sent)
```
--------------------------------
### Log Output Format Example
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Illustrates the typical output format when debugging CDP communication is enabled, showing connection status, sent/received messages, and events.
```text
✅ Connected
🌎 ← #1: Page.navigate({"url": "https://example.com"})
🌎 → #1: {"frameId": "1234", "loaderId": "5678"}
🌎 → Event: Page.frameAttached({"frameId": "5678", "parentFrameId": "1234"})
✔ PING (45.2ms)
🔌 Disconnected
```
--------------------------------
### Send Page Navigate Command
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/cdp-client.md
Use the `send` attribute to access domain-specific command clients. This example shows how to navigate a page to a specified URL.
```python
await client.send.Page.navigate(params={"url": "https://example.com"})
```
--------------------------------
### Quick Start: Connect and Navigate with CDPClient
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/README.md
This snippet demonstrates how to establish a WebSocket connection to the Chrome DevTools Protocol using CDPClient, retrieve browser targets, and navigate to a specified URL. Ensure a Chrome instance is running with the remote debugging port enabled.
```python
import asyncio
from cdp_use.client import CDPClient
async def main():
async with CDPClient("ws://localhost:9222/devtools/browser/...") as cdp:
# Type-safe command with full IntelliSense
targets = await cdp.send.Target.getTargets()
await cdp.send.Page.navigate({"url": "https://example.com"})
```
--------------------------------
### Get Layout Metrics
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/page-domain.md
Retrieves layout and visual viewport metrics for the page. Use this to get information about the page's dimensions, scale, and content size.
```python
metrics = await client.send.Page.getLayoutMetrics()
print(f"Viewport width: {metrics['layoutViewport']['clientWidth']}")
print(f"Viewport height: {metrics['layoutViewport']['clientHeight']}")
print(f"Page scale: {metrics['visualViewport']['scale']}")
```
--------------------------------
### Remote Browsers WebSocket URLs
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Shows example WebSocket URLs for connecting to remote Chrome instances, including examples with and without authentication.
```python
# Remote Chrome instance
ws_url = "ws://remote-host:9222/devtools/page/..."
# With authentication
ws_url = "wss://user:password@remote-host:9222/devtools/page/..."
```
--------------------------------
### Enable Network Domain
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/network-domain.md
Enable the network domain to start receiving network events. You can optionally set limits for buffer sizes and POST data.
```python
await client.send.Network.enable()
```
```python
await client.send.Network.enable(
params={
"maxPostDataSize": 10 * 1024, # 10KB max POST data
"maxResourceBufferSize": 5 * 1024 * 1024 # 5MB max per resource
}
)
```
--------------------------------
### Page Event Registration
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/page-domain.md
Register handlers for various page events. The example demonstrates how to subscribe to navigation, load, and dialog events, and then enable page-related commands and initiate a navigation.
```APIDOC
## Page Event Handlers
Register handlers for page events via `client.register.Page.*`.
### Navigation & Loading Events
- `frameAttached` - Frame attached to parent
- `frameDetached` - Frame detached from parent
- `frameNavigated` - Frame navigated to new document
- `frameScheduledNavigation` - Navigation scheduled
- `frameClearedScheduledNavigation` - Scheduled navigation cleared
- `frameStoppedLoading` - Frame finished loading
- `frameStartedLoading` - Frame started loading
- `frameStartedNavigating` - Frame started navigating
### Lifecycle Events
- `domContentEventFired` - DOM content loaded
- `loadEventFired` - Page fully loaded
### User Interaction Events
- `javascriptDialogOpening` - Alert/confirm/prompt dialog
- `javascriptDialogClosed` - Dialog closed
- `fileChooserOpened` - File chooser opened (if enabled)
### Media Events
- `screencastFrame` - Screencast frame available
- `screencastVisibilityChanged` - Screencast visibility changed
### Example Usage
```python
def on_navigation(event, session_id):
frame = event['frame']
print(f"Frame navigated to: {frame['url']}")
def on_load(event, session_id):
print("Page load complete")
def on_dialog(event, session_id):
dialog_type = event['type'] # "alert", "confirm", "prompt"
message = event['message']
print(f"Dialog: {dialog_type}: {message}")
client.register.Page.frameNavigated(on_navigation)
client.register.Page.loadEventFired(on_load)
client.register.Page.javascriptDialogOpening(on_dialog)
await client.send.Page.enable()
await client.send.Page.navigate(params={"url": "https://example.com"})
```
```
--------------------------------
### Set Custom HTTP Headers for All Requests
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/network-domain.md
This example demonstrates how to set custom HTTP headers that will be included with all subsequent network requests initiated by the browser. This is useful for authentication or tracking purposes.
```python
async with CDPClient(url) as client:
# Set headers for all requests
await client.send.Network.setExtraHTTPHeaders(
params={
"headers": {
"X-Custom": "test",
"X-Request-ID": "12345",
"Authorization": "Bearer token"
}
}
)
await client.send.Network.enable()
# These requests will include custom headers
await client.send.Page.navigate(
params={"url": "https://example.com"}
)
```
--------------------------------
### Use CDP Client with Async Context Manager
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/cdp-client.md
Utilizes the CDPClient within an asynchronous context manager, which automatically handles starting and stopping the client connection.
```python
async with CDPClient(url) as client:
# Use client
pass # stop() called automatically
```
--------------------------------
### Enable Runtime Domain Events
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/runtime-domain.md
Enables runtime domain events and execution context notifications. Use this to start receiving runtime-related events from the browser.
```python
await client.send.Runtime.enable()
```
--------------------------------
### Manage CDP Connection Manually
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Use this method for manual control over the CDP client connection lifecycle. Explicitly start and stop the client connection.
```python
# Manual connection/disconnection
client = CDPClient(url)
await client.start()
try:
await client.send.Page.enable()
finally:
await client.stop()
```
--------------------------------
### enable
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/network-domain.md
Enables the Network domain, allowing the client to start receiving network-related events. Optional parameters can be provided to control buffer sizes for events and POST data.
```APIDOC
## enable
### Description
Enable network domain and start receiving network events. Optional parameters can be provided to control buffer sizes for network events and POST data.
### Method
`enable`
### Parameters
#### Request Body
- **maxTotalBufferSize** (int) - Optional - Maximum total buffer size for network events
- **maxResourceBufferSize** (int) - Optional - Maximum resource buffer size
- **maxPostDataSize** (int) - Optional - Maximum POST data size to include
### Request Example
```python
# Basic enable
await client.send.Network.enable()
# With limits
await client.send.Network.enable(
params={
"maxPostDataSize": 10 * 1024, # 10KB max POST data
"maxResourceBufferSize": 5 * 1024 * 1024 # 5MB max per resource
}
)
```
### Response
None
```
--------------------------------
### Local Chrome/Chromium WebSocket URLs
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Provides example WebSocket URLs for connecting to local Chrome or Chromium instances, distinguishing between browser-level and page-level connections.
```python
# Browser-level connection (controls all tabs)
ws_url = "ws://localhost:9222/devtools/browser/..."
# Page-level connection (controls specific tab)
ws_url = "ws://localhost:9222/devtools/page/..."
```
--------------------------------
### getDocument
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/dom-domain.md
Get the root DOM node of the current document. This can be used to start DOM traversal.
```APIDOC
## getDocument
### Description
Get the root DOM node.
### Method
POST
### Endpoint
/session/{session_id}/dom/get_document
### Parameters
#### Query Parameters
- **session_id** (string) - Optional - Session ID
#### Request Body
- **params** (object) - Optional - Parameters for getting the document.
- **depth** (integer) - Optional - Tree depth (use -1 for full tree). Defaults to 2.
- **pierce** (boolean) - Optional - Include shadow DOM. Defaults to False.
### Request Example
```json
{
"method": "DOM.getDocument",
"params": {
"depth": -1,
"pierce": true
}
}
```
### Response
#### Success Response (200)
- **root** (object) - Root DOM node. See `Node` object for details.
```
--------------------------------
### Send Runtime Evaluate Command
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/cdp-client.md
Use the Runtime domain client to evaluate a JavaScript expression in the browser context, for example, to get the document's title.
```python
await client.send.Runtime.evaluate(params={"expression": "document.title"})
```
--------------------------------
### Evaluate JavaScript Expression
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/domain-clients.md
Use Runtime.evaluate to execute JavaScript code within the browser context. This example shows how to get the document title and log a message to the console.
```python
# Simple evaluation
result = await client.send.Runtime.evaluate(
params={
"expression": "document.title",
"returnByValue": True
}
)
print(f"Title: {result['result']['value']}")
# With console output
await client.send.Runtime.enable()
await client.send.Runtime.evaluate(
params={"expression": "console.log('Hello from CDP')"}
)
```
--------------------------------
### Animation Domain
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/domains-list.md
Enables monitoring of CSS animations. Key methods allow enabling/disabling animation tracking, getting current animation time, pausing animations, and seeking to specific points in animations. Events signal when animations are created, started, or canceled.
```APIDOC
## Animation Domain (`client.send.Animation.*`)
### Description
CSS animation monitoring.
### Methods
- `enable()`
- `disable()`
- `getCurrentTime()`
- `setPaused()`
- `seekAnimations()`
### Events
- `animationCreated`
- `animationStarted`
- `animationCanceled`
```
--------------------------------
### Intercept and Modify Network Requests
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/network-domain.md
This example shows how to intercept network requests, allowing for modification of headers, blocking specific requests (like ads), or allowing them to proceed. It requires enabling request interception patterns.
```python
async with CDPClient(url) as client:
async def on_intercepted(event, session_id):
request = event['request']
interception_id = event['interceptionId']
# Block ads
if 'ads' in request['url'] or 'analytics' in request['url']:
await client.send.Network.continueInterceptedRequest(
params={
"interceptionId": interception_id,
"errorReason": "BlockedByClient"
}
)
# Add custom header to API calls
elif 'api.example.com' in request['url']:
new_headers = {
**request['headers'],
"X-API-Key": "secret",
"X-Source": "automation"
}
await client.send.Network.continueInterceptedRequest(
params={
"interceptionId": interception_id,
"headers": new_headers
}
)
# Allow others
else:
await client.send.Network.continueInterceptedRequest(
params={"interceptionId": interception_id}
)
client.register.Network.requestIntercepted(on_intercepted)
# Enable interception
await client.send.Network.setRequestInterception(
params={"patterns": [{"urlPattern": "*"}]}
)
await client.send.Network.enable()
await client.send.Page.navigate(
params={"url": "https://example.com"}
)
await __import__('asyncio').sleep(10)
```
--------------------------------
### Configure CDPClient with Environment Variables
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Load CDP_URL and CDP_TOKEN from environment variables to configure the CDPClient. Supports authorization tokens.
```python
import os
from cdp_use.client import CDPClient
# Load configuration from environment
CDP_URL = os.getenv("CDP_URL", "ws://localhost:9222/devtools/page/...")
CDP_TOKEN = os.getenv("CDP_TOKEN")
headers = {}
if CDP_TOKEN:
headers["Authorization"] = f"Bearer {CDP_TOKEN}"
client = CDPClient(
url=CDP_URL,
additional_headers=headers if headers else None
)
```
--------------------------------
### Multi-Tab Automation with CDPClient
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Demonstrates how to automate multiple browser tabs concurrently by retrieving target information and attaching to specific pages.
```python
from cdp_use.client import CDPClient
async def automate_tabs(browser_url: str):
async with CDPClient(browser_url) as client:
# Get all tabs
targets = await client.send.Target.getTargets()
pages = [t for t in targets['targetInfos'] if t['type'] == 'page']
# Attach to each tab
for page in pages:
attach = await client.send.Target.attachToTarget(
params={'targetId': page['targetId'], 'flatten': True}
)
session_id = attach['sessionId']
# Run operations on this tab
await client.send.Page.navigate(
params={\"url\": \"https://example.com\"},
session_id=session_id
)
```
--------------------------------
### Basic Event Registration with CDP Client
Source: https://github.com/browser-use/cdp-use/blob/main/README.md
Demonstrates how to register multiple event handlers for Page and Runtime domains and navigate to a URL. Ensure the CDP server is running and accessible at the specified WebSocket endpoint.
```python
import asyncio
from cdp_use.client import CDPClient
from cdp_use.cdp.page.events import FrameAttachedEvent, DomContentEventFiredEvent
from cdp_use.cdp.runtime.events import ConsoleAPICalledEvent
from typing import Optional
def on_frame_attached(event: FrameAttachedEvent, session_id: Optional[str]) -> None:
print(f"Frame {event['frameId']} attached to {event['parentFrameId']}")
def on_dom_content_loaded(event: DomContentEventFiredEvent, session_id: Optional[str]) -> None:
print(f"DOM content loaded at: {event['timestamp']}")
def on_console_message(event: ConsoleAPICalledEvent, session_id: Optional[str]) -> None:
print(f"Console: {event['type']}")
async def main():
async with CDPClient("ws://localhost:9222/devtools/page/...") as client:
# Register event handlers with camelCase method names (matching CDP)
client.register.Page.frameAttached(on_frame_attached)
client.register.Page.domContentEventFired(on_dom_content_loaded)
client.register.Runtime.consoleAPICalled(on_console_message)
# Enable domains to start receiving events
await client.send.Page.enable()
await client.send.Runtime.enable()
# Navigate and receive events
await client.send.Page.navigate({"url": "https://example.com"})
await asyncio.sleep(5) # Keep listening for events
```
--------------------------------
### CDPClient with Authentication Token
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Illustrates how to configure the CDPClient with a WebSocket URL and an Authorization header for authentication.
```python
# With authentication token
client = CDPClient(
url="ws://localhost:9222/devtools/page/",
additional_headers={"Authorization": "Bearer token123"}
)
```
--------------------------------
### Automate Web Navigation with CDPClient
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/INDEX.md
This snippet demonstrates basic web automation using the CDPClient. It enables the Page domain, navigates to a URL, and captures a screenshot.
```python
async with CDPClient(url) as client:
await client.send.Page.enable()
await client.send.Page.navigate(params={\"url\": \"https://example.com\"})
screenshot = await client.send.Page.captureScreenshot()
```
--------------------------------
### Get Object Properties
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/runtime-domain.md
Retrieves properties of a JavaScript object. First, evaluate an expression to get the object's ID, then use that ID to fetch its properties.
```python
result = await client.send.Runtime.evaluate(
params={"expression": "window.location"}
)
location_id = result['result']['objectId']
props = await client.send.Runtime.getProperties(
params={"objectId": location_id}
)
for prop in props['result']:
print(f"{prop['name']}: {prop['value'].get('value')}")
```
--------------------------------
### Get Element Box Model
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/dom-domain.md
Retrieves the box model (content, padding, border, margin) for a given DOM node. Use this to get precise layout dimensions.
```python
result = await client.send.DOM.getBoxModel(
params={"nodeId": node_id}
)
model = result['model']
print(f"Content: {model['content']}") # [[x, y, ...], ...]
print(f"Padding: {model['padding']}")
print(f"Border: {model['border']}")
print(f"Margin: {model['margin']}")
```
--------------------------------
### Execute JavaScript and Get Value
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/INDEX.md
Execute arbitrary JavaScript code within the browser context and retrieve its return value. Set 'returnByValue' to True to get the actual value.
```python
result = await client.send.Runtime.evaluate(
params={
"expression": "your_js_code",
"returnByValue": True # Get actual value, not object reference
}
)
value = result['result']['value']
```
--------------------------------
### Available Development Tasks
Source: https://github.com/browser-use/cdp-use/blob/main/README.md
Lists the available 'task' commands for managing the CDP generation, building, linting, formatting, and cleaning of the project.
```bash
task generate # Regenerate CDP types from protocol definitions
task build # Build the distribution package
task lint # Run ruff linter
task format # Format code with ruff
task format-json # Format JSON protocol files
task example # Run the simple example
task clean # Clean generated files and build artifacts
```
--------------------------------
### Get Element Dimensions
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/dom-domain.md
Retrieves the dimensions of a DOM element, including its content, padding, border, and margin areas.
```APIDOC
### Get Element Dimensions
```python
async with CDPClient(url) as client:
await client.send.DOM.enable()
doc = await client.send.DOM.getDocument()
# Find element
result = await client.send.DOM.querySelector(
params={
"nodeId": doc['root']['nodeId'],
"selector": ".content-box"
}
)
if result['nodeId'] > 0:
# Get box model
box = await client.send.DOM.getBoxModel(
params={"nodeId": result['nodeId']}
)
print(f"Content area: {box['model']['content']}")
print(f"With padding: {box['model']['padding']}")
print(f"With border: {box['model']['border']}")
print(f"With margin: {box['model']['margin']}")
```
```
--------------------------------
### Basic Event Registration and Usage
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/event-system.md
Demonstrates how to register synchronous event handlers for Page events like frameAttached and domContentEventFired, enable page events, and navigate a page.
```python
import asyncio
from cdp_use.client import CDPClient
from cdp_use.cdp.page.events import FrameAttachedEvent, DomContentEventFiredEvent
def on_frame_attached(event: FrameAttachedEvent, session_id: Optional[str]) -> None:
print(f"Frame attached: {event['frameId']}")
def on_dom_content_loaded(event: DomContentEventFiredEvent, session_id: Optional[str]) -> None:
print(f"DOM content loaded")
async def main():
async with CDPClient(url) as client:
# Register handlers
client.register.Page.frameAttached(on_frame_attached)
client.register.Page.domContentEventFired(on_dom_content_loaded)
# Enable page events
await client.send.Page.enable()
# Navigate - events will be logged
await client.send.Page.navigate({"url": "https://example.com"})
# Listen for events
await asyncio.sleep(5)
asyncio.run(main())
```
--------------------------------
### Complete Page Automation with CDPClient
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/page-domain.md
This snippet shows how to enable the Page domain, navigate to a URL, wait for the page to load, retrieve layout metrics, and capture a screenshot. It requires a running Chrome instance accessible via WebSocket.
```python
import asyncio
from cdp_use.client import CDPClient
async def automate_page():
async with CDPClient("ws://localhost:9222/devtools/page/...") as client:
# Enable page domain
await client.send.Page.enable()
# Navigate
nav_result = await client.send.Page.navigate(
params={"url": "https://example.com"}
)
# Wait for content
def on_load(event, session_id):
print("Page loaded!")
client.register.Page.loadEventFired(on_load)
# Get metrics
metrics = await client.send.Page.getLayoutMetrics()
print(f"Viewport: {metrics['layoutViewport']['clientWidth']}x{metrics['layoutViewport']['clientHeight']}")
# Capture screenshot
screenshot = await client.send.Page.captureScreenshot()
with open("screenshot.png", "wb") as f:
f.write(__import__("base64").b64decode(screenshot['data']))
asyncio.run(automate_page())
```
--------------------------------
### enable
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/page-domain.md
Enables notifications and events for the Page domain. This is typically called once at the beginning of a session to start receiving page-related events.
```APIDOC
## enable()
### Description
Enable page domain notifications and events.
### Method
`Page.enable`
### Parameters
#### Request Body
- `enableFileChooserOpenedEvent` (bool) - Optional - Emit `fileChooserOpened` events
### Request Example
```python
await client.send.Page.enable()
# With file chooser events
await client.send.Page.enable(
params={"enableFileChooserOpenedEvent": True}
)
```
### Response
#### Success Response (200)
- None
```
--------------------------------
### Get Navigation History
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/page-domain.md
Fetches the navigation history of the current page, including the current index and a list of navigation entries with their URLs.
```python
history = await client.send.Page.getNavigationHistory()
print(f"Current index: {history['currentIndex']}")
for entry in history['entries']:
print(f" {entry['index']}: {entry['url']}")
```
--------------------------------
### Configure CDPClient with Custom WebSocket Settings
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/cdp-client.md
Initializes CDPClient with custom headers and maximum WebSocket frame size. Useful for large data transfers like screenshots.
```python
client = CDPClient(
url="ws://localhost:9222/devtools/page/...",
additional_headers={"Authorization": "Bearer token"},
max_ws_frame_size=200 * 1024 * 1024 # 200MB for large screenshots
)
async with client:
# Connection established with custom settings
pass
```
--------------------------------
### Get Element Outer HTML
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/dom-domain.md
Retrieves the outer HTML of a specified DOM element. This includes the element's own tags and its content.
```python
result = await client.send.DOM.getOuterHTML(
params={"nodeId": node_id}
)
print(f"HTML: {result['outerHTML']}")
# Output:
```
--------------------------------
### Get Cookies for URLs
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/network-domain.md
Retrieve cookies that match specific URLs. This allows you to fetch cookies relevant to a particular domain or path.
```python
result = await client.send.Network.getCookies(
params={"urls": ["https://example.com"]}
)
for cookie in result['cookies']:
print(f"{cookie['name']}: {cookie['value']}")
```
--------------------------------
### CDP Client and Library Classes
Source: https://github.com/browser-use/cdp-use/blob/main/README.md
Defines the main CDPClient and CDPLibrary classes, illustrating how to send commands and access domain-specific clients.
```python
class CDPClient:
def __init__(self, url: str):
self.send: CDPLibrary # Send commands
self.register: CDPRegistrationLibrary # Register events
# Domain-specific clients
class CDPLibrary:
def __init__(self, client: CDPClient):
self.DOM = DOMClient(client) # DOM operations
self.Network = NetworkClient(client) # Network monitoring
self.Runtime = RuntimeClient(client) # JavaScript execution
# ... 50+ more domains
# Event registration
class CDPRegistrationLibrary:
def __init__(self, registry: EventRegistry):
self.Page = PageRegistration(registry)
self.Runtime = RuntimeRegistration(registry)
# ... all domains with events
```
--------------------------------
### Navigate and Check Function with Type Hinting
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/types.md
Demonstrates how to use type hints for CDP commands, including parameters and return types, within an asynchronous function. It utilizes `TYPE_CHECKING` to prevent runtime import errors.
```python
from typing import TYPE_CHECKING
if TYPE_CHECKING:
from cdp_use.cdp.page.types import Frame, Viewport
from cdp_use.cdp.page.commands import NavigateParameters, NavigateReturns
from cdp_use.cdp.runtime.types import RemoteObject
async def navigate_and_check(
client: CDPClient,
url: str,
) -> 'Frame':
params: 'NavigateParameters' = {"url": url}
result: 'NavigateReturns' = await client.send.Page.navigate(params=params)
return result # Type checker knows this is NavigateReturns
```
--------------------------------
### CDPClient Constructor
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/cdp-client.md
Initializes a CDPClient instance. Requires the WebSocket URL for the CDP connection. Optional parameters include additional headers and maximum WebSocket frame size.
```python
class CDPClient:
def __init__(
self,
url: str,
additional_headers: Optional[Dict[str, str]] = None,
max_ws_frame_size: int = 100 * 1024 * 1024,
) -> None
```
--------------------------------
### Get Frame Tree
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/page-domain.md
Fetches the hierarchical structure of all frames within the page. This is useful for understanding the page's composition, especially with iframes.
```python
tree = await client.send.Page.getFrameTree()
def print_frames(frame_tree, depth=0):
frame = frame_tree['frame']
print(" " * depth + f"Frame: {frame['id']} - {frame['url']}")
for child in frame_tree.get('childFrames', []):
print_frames(child, depth + 1)
print_frames(tree)
```
--------------------------------
### Get Element Dimensions
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/dom-domain.md
Find an element by selector and retrieve its bounding box model, including content, padding, border, and margin dimensions.
```python
async with CDPClient(url) as client:
await client.send.DOM.enable()
doc = await client.send.DOM.getDocument()
# Find element
result = await client.send.DOM.querySelector(
params={
"nodeId": doc['root']['nodeId'],
"selector": ".content-box"
}
)
if result['nodeId'] > 0:
# Get box model
box = await client.send.DOM.getBoxModel(
params={"nodeId": result['nodeId']}
)
print(f"Content area: {box['model']['content']}")
print(f"With padding: {box['model']['padding']}")
print(f"With border: {box['model']['border']}")
print(f"With margin: {box['model']['margin']}")
```
--------------------------------
### Get WebSocket URL from Chrome/Chromium
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Demonstrates how to programmatically retrieve the WebSocket debugger URL for a running Chrome or Chromium instance using httpx.
```python
import httpx
async with httpx.AsyncClient() as client:
version = await client.get("http://localhost:9222/json/version")
url = version.json()["webSocketDebuggerUrl"]
```
--------------------------------
### Accessing Domain Registrations
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/event-system.md
Demonstrates how to access and use domain-specific event registration methods for subscribing to CDP events.
```python
client.register.Page.frameAttached(callback)
client.register.Page.domContentEventFired(callback)
client.register.Runtime.consoleAPICalled(callback)
client.register.Network.requestWillBeSent(callback)
client.register.DOM.attributeModified(callback)
```
--------------------------------
### Enable Domains
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/INDEX.md
Most domains require explicit enabling before they can emit events. Use this pattern to enable specific domains.
```python
await client.send.Page.enable()
await client.send.Runtime.enable()
await client.send.DOM.enable()
```
--------------------------------
### Query DOM Element by Selector
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/INDEX.md
Query for a DOM element using its CSS selector. This involves getting the document root, then performing the query.
```python
doc = await client.send.DOM.getDocument()
root_id = doc['root']['nodeId']
result = await client.send.DOM.querySelector(
params={"nodeId": root_id, "selector": "button"}
)
node_id = result['nodeId']
```
--------------------------------
### Project Directory Structure
Source: https://github.com/browser-use/cdp-use/blob/main/README.md
Provides an overview of the main project directories and their contents, including the core client, generator tools, and generated CDP library.
```tree
cdp-use/
├── cdp_use/
│ ├── client.py # Core CDP WebSocket client
│ ├── generator/ # Code generation tools
│ └── cdp/ # Generated CDP library (auto-generated)
├── simple.py # Example usage
└── README.md
```
--------------------------------
### Input Domain Methods
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/domain-clients.md
Methods for sending keyboard, mouse, and touch input events.
```APIDOC
## Input Domain
### dispatchKeyEvent
**Description**: Dispatch a keyboard event.
### dispatchMouseEvent
**Description**: Dispatch a mouse event.
### dispatchTouchEvent
**Description**: Dispatch a touch event.
### synthesizePinchGesture
**Description**: Synthesize a pinch gesture.
### synthesizeScrollGesture
**Description**: Synthesize a scroll gesture.
```
--------------------------------
### Navigate with Type Safety using Type Hints
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Implement type-safe navigation functions by importing necessary types from cdp_use. Supports optional session IDs.
```python
from typing import Optional
from cdp_use.client import CDPClient
from cdp_use.cdp.page.commands import NavigateParameters, NavigateReturns
async def navigate(
client: CDPClient,
url: str,
session_id: Optional[str] = None
) -> NavigateReturns:
"""Navigate with full type safety."""
params: NavigateParameters = {"url": url}
return await client.send.Page.navigate(
params=params,
session_id=session_id
)
```
--------------------------------
### Get Element Content Quads
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/dom-domain.md
Fetches more accurate content quads for complex layouts compared to the box model. Each quad is represented as a list of coordinates.
```python
result = await client.send.DOM.getContentQuads(
params={"nodeId": node_id}
)
for quad in result['quads']:
# Quad is [x0, y0, x1, y1, x2, y2, x3, y3]
print(f"Quad bounds: {quad}")
```
--------------------------------
### DOMSnapshot Domain
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/domains-list.md
Enables capturing a complete snapshot of the DOM. Methods include enabling and disabling the snapshotting feature, and capturing or getting a DOM snapshot.
```APIDOC
## DOMSnapshot Domain (`client.send.DOMSnapshot.*`)
### Description
Complete DOM snapshot capture.
### Methods
- `disable()`
- `enable()`
- `getSnapshot()`
- `captureSnapshot()`
```
--------------------------------
### CDPRegistrationLibrary Structure
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/event-system.md
Illustrates the structure of the CDPRegistrationLibrary, showing how domain-specific registration interfaces are organized.
```python
class CDPRegistrationLibrary:
def __init__(self, registry: EventRegistry) -> None
# Domain-specific registration interfaces
Accessibility: AccessibilityRegistration
Animation: AnimationRegistration
Audits: AuditsRegistration
Browser: BrowserRegistration
CSS: CSSRegistration
Console: ConsoleRegistration
Debugger: DebuggerRegistration
DOM: DOMRegistration
Emulation: EmulationRegistration
# ... 60+ more domains
```
--------------------------------
### Get Element Attributes
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/dom-domain.md
Retrieve the attributes of a specific DOM node. Attributes are returned as a flat list of [name, value, name, value, ...].
```python
# Assuming we have a node_id from querySelector
attrs_result = await client.send.DOM.getAttributes(
params={"nodeId": node_id}
)
# Convert to dict
attrs = attrs_result['attributes']
attr_dict = dict(zip(attrs[::2], attrs[1::2]))
print(f"Attributes: {attr_dict}")
```
--------------------------------
### Domain Client Method Signature
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/domain-clients.md
Illustrates the standard asynchronous method signature for domain client commands, detailing parameters and return types.
```python
async def methodName(
self,
params: Optional[ParamType] = None,
session_id: Optional[str] = None,
) -> ReturnType
```
--------------------------------
### Manage CDP Connection with Async Context Manager
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/configuration.md
Recommended approach for managing CDP client connections. The `async with` statement ensures automatic connection and cleanup.
```python
# Recommended: automatic connection management
async with CDPClient(url) as client:
await client.send.Page.navigate(params={"url": "https://example.com"})
# Automatic cleanup on exit
```
--------------------------------
### Getting a List of Registered Event Methods
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/event-system.md
Retrieve a list of all CDP method names for which event handlers are currently registered. This can be used for introspection or debugging.
```python
methods = registry.get_registered_methods()
print(methods) # ['Page.frameAttached', 'Runtime.consoleAPICalled', ...]
```
--------------------------------
### Manual Git Branching and PR Creation
Source: https://github.com/browser-use/cdp-use/blob/main/RUNBOOK.md
Use this command sequence as a manual alternative to the automated release helper. It checks out the main branch, pulls the latest changes, creates a new release branch, manually bumps the version in pyproject.toml, commits the changes, pushes the branch, and opens a pull request.
```bash
git checkout main && git pull --ff-only origin main
git checkout -b release/$(date +%Y%m%d-%H%M%S)
# Bump pyproject.toml version manually, then:
NEW_VERSION=$(grep -E '^version = ' pyproject.toml | head -1 | sed -E 's/version = "(.*)"/
1/')
git add pyproject.toml
git commit -m "release: v$NEW_VERSION"
git push -u origin "$(git rev-parse --abbrev-ref HEAD)"
gh pr create --base main --title "release: v$NEW_VERSION" --body "Release v$NEW_VERSION"
```
--------------------------------
### Emitting Synthetic Events
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/event-system.md
Demonstrates how to programmatically emit synthetic events, particularly for custom domains like BrowserUse, by specifying the method and parameters.
```python
# For custom domains (e.g., BrowserUse), emit events programmatically
handled = await client.emit_event(
method="BrowserUse.action",
params={"type": "click", "selector": "button"},
session_id=session_id
)
print(f"Event handled: {handled}")
```
--------------------------------
### Domain Client Class Structure
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/domain-clients.md
Defines the basic structure of a domain client class, including initialization with a CDPClient and a method for sending raw commands.
```python
class Client:
def __init__(self, client: CDPClient) -> None:
self._client = client
async def commandName(
self,
params: Optional[CommandNameParameters] = None,
session_id: Optional[str] = None,
) -> CommandNameReturns:
"""Command documentation."""
return cast(
"CommandNameReturns",
await self._client.send_raw(
method=".",
params=params,
session_id=session_id,
),
)
```
--------------------------------
### Evaluate to Get Object ID and Inspect Properties
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/runtime-domain.md
Evaluates a JavaScript expression to create an object, retrieves its objectId, and then uses getProperties to fetch and print its properties.
```python
async with CDPClient(url) as client:
await client.send.Runtime.enable()
# Evaluate to get object
result = await client.send.Runtime.evaluate(
params={"expression": "({name: 'John', age: 30, email: 'john@example.com'})"}
)
obj_id = result['result']['objectId']
# Get properties
props_result = await client.send.Runtime.getProperties(
params={"objectId": obj_id}
)
for prop in props_result['result']:
value = prop['value'].get('value', '[object]')
print(f"{prop['name']}: {value}")
```
--------------------------------
### Manual GitHub Release Creation
Source: https://github.com/browser-use/cdp-use/blob/main/RUNBOOK.md
This command can be used as an escape hatch to manually create a GitHub release with generated notes. Ensure you are in the correct repository context.
```bash
gh release create v --generate-notes --repo browser-use/cdp-use
```
--------------------------------
### Get All Cookies
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/network-domain.md
Retrieve all cookies currently stored by the browser. The result is a list of cookie objects, each containing details like name, value, domain, and path.
```python
result = await client.send.Network.getAllCookies()
for cookie in result['cookies']:
print(f"{cookie['name']}={cookie['value']}")
print(f" Domain: {cookie['domain']}")
print(f" Path: {cookie['path']}")
print(f" Secure: {cookie.get('secure', False)}")
print(f" HttpOnly: {cookie.get('httpOnly', False)}")
```
--------------------------------
### Generate CDP Client Library
Source: https://github.com/browser-use/cdp-use/blob/main/README.md
Run the generator script to download protocol specifications and create type-safe Python bindings.
```bash
python -m cdp_use.generator
```
--------------------------------
### Enable Page Domain Notifications
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/page-domain.md
Enable page domain notifications and events. Use this to start receiving page-related events. Optionally, enable file chooser events.
```python
await client.send.Page.enable()
# With file chooser events
await client.send.Page.enable(
params={"enableFileChooserOpenedEvent": True}
)
```
--------------------------------
### CDPClient Constructor
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/cdp-client.md
Initializes a new CDPClient instance to manage communication with the Chrome DevTools Protocol.
```APIDOC
## CDPClient Constructor
### Description
Initializes a new CDPClient instance to manage communication with the Chrome DevTools Protocol.
### Parameters
#### Path Parameters
- **url** (str) - Required - WebSocket URL for CDP connection (e.g., `ws://localhost:9222/devtools/page/...`)
- **additional_headers** (Optional[Dict[str, str]]) - Optional - Custom HTTP headers to include in WebSocket handshake
- **max_ws_frame_size** (int) - Optional - Maximum WebSocket frame size in bytes (default 100MB)
```
--------------------------------
### Cast Domain
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/domains-list.md
Provides functionality for the Chrome Cast API. Methods allow enabling/disabling casting, setting the sink to use, starting tab mirroring, and stopping casting.
```APIDOC
## Cast Domain (`client.send.Cast.*`)
### Description
Chrome Cast API.
### Methods
- `enable()`
- `disable()`
- `setSinkToUse()`
- `startTabMirroring()`
- `stopCasting()`
```
--------------------------------
### bringToFront
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/page-domain.md
Activates the browser tab associated with the current session.
```APIDOC
## bringToFront
### Description
Brings the browser tab associated with the current session to the front, making it active.
### Method
POST (assumed, based on typical CDP command structure)
### Endpoint
/session/{session_id}/bringToFront
### Parameters
#### Path Parameters
- **session_id** (string) - Optional - Session ID
### Request Example
```json
{
"method": "Page.bringToFront"
}
```
### Response
#### Success Response (200)
This method does not return a value upon success.
#### Response Example
```json
{
"result": null
}
```
```
--------------------------------
### Regenerating CDP Types with Task
Source: https://github.com/browser-use/cdp-use/blob/main/README.md
Demonstrates how to regenerate CDP types using the recommended 'task generate' command.
```bash
# Using task (recommended)
task generate
```
--------------------------------
### Input Domain
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/domains-list.md
Allows sending keyboard, mouse, and touch input events.
```APIDOC
## Input Domain
### Description
Provides methods to simulate user input, including keyboard, mouse, and touch events.
### Access Pattern
`client.send.Input.*`
### Key Methods
- `dispatchKeyEvent()`
- `dispatchMouseEvent()`
- `dispatchTouchEvent()`
- `synthesizePinchGesture()`
- `synthesizeScrollGesture()`
```
--------------------------------
### Register for Page Frame Attached Event
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/cdp-client.md
Use the `register` attribute to access event registration interfaces. This example shows how to register a callback function for the `Page.frameAttached` event.
```python
def on_frame_attached(event: FrameAttachedEvent, session_id: Optional[str]) -> None:
print(f"Frame attached: {event['frameId']}")
client.register.Page.frameAttached(on_frame_attached)
```
--------------------------------
### Get JavaScript Heap Usage
Source: https://github.com/browser-use/cdp-use/blob/main/_autodocs/api-reference/runtime-domain.md
Retrieves the current JavaScript heap usage statistics, including used and total size in bytes. Useful for monitoring memory consumption.
```python
usage = await client.send.Runtime.getHeapUsage()
print(f"Heap: {usage['usedSize']} / {usage['totalSize']} bytes")
print(f"Used: {usage['usedSize'] / 1024 / 1024:.2f} MB")
```