Skip to content
Get packs

Browser Edge-Case Debugging

Teaches an agent a step-by-step method for fixing browser automation failures on tricky sites.

Source Download skill
Repository
aden-hive/hive
Stars
11,132
Licence
Apache-2.0
Files
12 files

What it does

This is a troubleshooting playbook for AI agents that control a web browser. When a browser action such as scrolling, clicking, typing or taking a snapshot silently fails on sites like LinkedIn, Twitter/X, single-page apps or pages using Shadow DOM, the agent follows the playbook to reproduce the problem, inspect the page structure, and try fallback techniques such as JavaScript clicks or piercing shadow roots. It also includes a registry of known edge cases and Python test scripts that check specific failures against a live browser.

Great for

  • Developers building browser-automation agents on the Hive framework who hit scroll, click or typing failures
  • Engineers debugging why an agent's browser tool reports success but the page does not respond
  • Maintainers who want to document and regression-test known browser edge cases

Skip it if

  • Ordinary end users who just want to browse or scrape a site; the playbook assumes a working browser automation stack and code knowledge
  • Use on sites you do not have permission to automate, since the techniques (scripted clicks, scrolling feeds, bypassing overlays) may conflict with a site's terms of service
  • Non-browser automation problems; the skill is specific to the browser_* tools it references

Try asking

  • “My browser_interact scroll succeeds on example.com but does nothing on a LinkedIn feed. Help me debug it using the browser edge-case playbook.”
  • “The click on a button in our React app reports success but no handler fires. Walk me through the fallback options.”
  • “Our snapshot tool hangs on a Twitter page with a huge DOM. Add timeouts and a fallback snapshot.”
  • “Help me write a test case for a new browser edge case and record it in registry.md.”
Step-by-step guide: how to use Browser Edge-Case DebuggingInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 12 original files, the Apache-2.0 licence and an attribution note.

    browser-edge-cases.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip browser-edge-cases.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip browser-edge-cases.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Run the simple example.com check first so you can tell a site-specific problem from a general tool failure.
  • Review the test scripts before running them: they launch a browser bridge, open external sites such as x.com and w3schools.com, and create tabs.
  • Treat the JavaScript snippets as starting points and verify results, since fallbacks like element.click() can bypass real user interaction.

What's inside

  • registry.md
  • scripts/test_02_twitter_scroll.py
  • scripts/test_03_modal_scroll.py
  • scripts/test_04_element_covered.py
  • scripts/test_06_shadow_dom.py
  • scripts/test_07_contenteditable.py
  • scripts/test_08_autocomplete.py
  • scripts/test_10_huge_dom.py
  • scripts/test_13_spa_navigation.py
  • scripts/test_15_screenshot.py
  • scripts/test_case.py
  • SKILL.md

Redistributed unmodified from aden-hive/hive under the Apache-2.0 licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.