feat: add dropdown command for select element interaction

[szymdzum]

Summary

Add bdg dom dropdown command for native <select> element interaction. One command with two modes: discovery (list options) and action (pick option).

Problem

Current workaround is fragile and incomplete:

bdg dom eval "document.querySelector('select').value = 'US'"

Issues:

• No change event fired - React/Vue/Angular won't detect the change
• No validation - silently fails if value doesn't exist
• No discovery - agent doesn't know available options
• No multi-select support
• Fragile - agent must construct JS, prone to syntax errors

Solution

Discovery mode (no value)

bdg dom dropdown "select#country"
# index | value | text           | selected
# 0     | ""    | Select...      |
# 1     | US    | United States  | ✓
# 2     | GB    | United Kingdom |

Action mode (with value)

bdg dom dropdown "select#country" "GB"
# Selected: United Kingdom (GB)

bdg dom dropdown "select#country" --index 2
# Selected: United Kingdom (GB)

Options

Flag	Description
--index <n>	Pick by option index (1-based, consistent with other commands)
--text	Match by visible text instead of value
--multiple	For multi-select: "val1,val2"
--json	Machine-readable output

Implementation Notes

Event dispatch (critical for frameworks)

Must trigger proper events for React/Vue/Angular compatibility:

// After setting selectedIndex:
element.dispatchEvent(new Event('change', { bubbles: true }));
element.dispatchEvent(new Event('input', { bubbles: true }));

Validation

• Verify element is <select> tag
• Verify option exists before selecting
• Return error with available options if no match

JSON output

{
  "selected": { "index": 2, "value": "GB", "text": "United Kingdom" },
  "options": [
    { "index": 0, "value": "", "text": "Select...", "selected": false },
    { "index": 1, "value": "US", "text": "United States", "selected": false },
    { "index": 2, "value": "GB", "text": "United Kingdom", "selected": true }
  ]
}

Design Principles

• One command, two modes - discovery and action unified
• Proper event dispatch - frameworks detect changes
• Validation with helpful errors - show available options on mismatch
• Consistent with existing commands - follows fill, click patterns

Future Consideration

Custom dropdown components (React Select, MUI Select, Headless UI) could be supported via --custom flag or auto-detection, but native <select> is the priority.