Browser Testing with DevTools

Řídí testy ve skutečném prohlížeči přes Chrome DevTools MCP a odhaluje problémy v DOM a konzoli.

od addyosmani · addyosmani/agent-skills

Funguje s nastavením ★ 8.0/10

Browser Testing with DevTools — Řídí testy ve skutečném prohlížeči přes Chrome DevTools MCP a odhaluje problémy v DOM a konzoli.

Co umí

Testuje ve skutečných prohlížečích přes Chrome DevTools MCP. Použijte při stavbě nebo debugování čehokoli, co běží v prohlížeči. Použijte, když potřebujete zkontrolovat DOM, zachytit chyby v konzoli, analyzovat síťové požadavky, profilovat výkon nebo ověřit vizuální výstup pomocí reálných runtime dat. Vyžaduje nakonfigurovaný MCP server chrome-devtools.

Testovací report

Čistá instalace jediného souboru — doslovný git clone + cp fungoval bez oprav a frontmatter parsuje striktně podle YAML — ale skill je bez samostatně nakonfigurovaného MCP serveru chrome-devtools a běžícího Chromu nefunkční, což je tvrdá externí závislost, kterou dokumentace poctivě uvádí hned na začátku. V A/B úkolu s živým debugováním v prohlížeči (reprodukovat ReferenceError, opravit, znovu ověřit) obě větve — se skillem i baseline bez skillu — chybu našly, opravily a živě ověřily; výhodou skillu byla procesní disciplína — jeho workflow REPRODUCE→INSPECT→DIAGNOSE→FIX→VERIFY plus screenshoty před/po jako důkaz — ne lepší diagnóza. Dobře napsaná, poctivá dokumentace s neobvykle silným bezpečnostním vedením (izolace profilu, nedůvěryhodný obsah prohlížeče).

Testováno: 2026-07-11 · Claude Code 2.x (agent harness)

Instalace

git clone https://github.com/addyosmani/agent-skills
cd agent-skills
mkdir -p ~/.claude/skills
cp -r skills/browser-testing-with-devtools ~/.claude/skills/browser-testing-with-devtools

Příkazy a ukázkové prompty

  • /browser-testing-with-devtoolsŘídí testy ve skutečném prohlížeči přes Chrome DevTools MCP a odhaluje problémy v DOM a konzoli.

Skilly se spouštějí běžnými požadavky — žádné příkazy k zapamatování. Po instalaci ho aktivují prompty jako tyto (anglicky):

  • Test this page in a real browser and check the console
  • Inspect network requests while debugging the login flow
  • Profile page performance and report console errors