### 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") ```