Skip to main content

Overview

Click an element using React-compatible synthetic events. Automatically waits for network stability after the action unless disabled with --no-wait.

Syntax

bdg dom click <selector> [options]

Arguments

selector
string
required
CSS selector or numeric index from cached query results (0-based)

Options

--index
number
Element index if selector matches multiple elements (0-based)
--no-wait
flag
Skip waiting for network stability after click
--json
flag
Output as JSON

Behavior

Event dispatch

  • Dispatches React-compatible synthetic events: mousedown, mouseup, click
  • Works with both native DOM elements and React components
  • Properly triggers React event handlers (onClick, etc.)

Automatic waiting

By default, waits for page stability after click:
  • Network idle (no requests for 150ms)
  • DOM stable (no mutations for 200ms)
  • Maximum wait: 2 seconds
Disable with --no-wait for fast, non-navigating clicks.

Examples

Click by selector

# By ID
bdg dom click "#login-btn"

# By class
bdg dom click ".submit-button"

# By attribute
bdg dom click "button[type='submit']"

Click by cached index

# Step 1: Query and cache
bdg dom query "button"
# Found 3 elements:
# [0] <button.primary> "Submit"
# [1] <button.secondary> "Cancel"
# [2] <button.link> "Learn more"

# Step 2: Click by index
bdg dom click 0  # Click Submit
bdg dom click 1  # Click Cancel

Click specific match

# Click 2nd button (0-based indexing)
bdg dom click "button" --index 1

Skip stability wait

# For fast, non-navigating clicks
bdg dom click "#fast-btn" --no-wait

Common workflows

Form submission

# Fill form and submit
bdg dom fill "#email" "[email protected]"
bdg dom fill "#password" "SecurePass123"
bdg dom click "button[type='submit']"
# Automatically waits for page response

Multi-step navigation

# Query tabs
bdg dom query ".tab"
# [0] <div.tab> "Overview"
# [1] <div.tab> "Details"
# [2] <div.tab> "History"

# Click second tab
bdg dom click 1
# Waits for tab content to load

Toggle states

# Toggle checkbox
bdg dom click "#terms-checkbox"

# Open dropdown
bdg dom click ".dropdown-trigger"

Exit codes

0
number
Success - element clicked
83
number
RESOURCE_NOT_FOUND - element not found
87
number
STALE_CACHE - cached index invalid (page navigation)
102
number
CDP_TIMEOUT - CDP operation timed out

Comparison with other click methods

MethodUse case
bdg dom clickGeneral clicking with React support
bdg dom submitForm submission with navigation wait
bdg dom pressKey <selector> EnterKeyboard-based submission

Troubleshooting

Element not clickable

If the element is not visible or clickable:
  1. Scroll element into view first: bdg dom scroll <selector>
  2. Check element exists: bdg dom query <selector>
  3. Verify element is not disabled: bdg dom get <selector>

Click doesn’t trigger action

For elements that require specific event sequences:
  • Use bdg dom pressKey <selector> Enter for keyboard submission
  • Use bdg dom submit for form submissions with navigation

Slow response

If clicks are slow due to stability waiting:
  • Use --no-wait for clicks that don’t trigger network activity
  • Adjust network idle threshold (currently 150ms)

Build docs developers (and LLMs) love