Tracy se naučila mluvit s AI agenty

před 7 hodinami od David Grudl  

Tracy se naučila nový dialekt. Když na druhé straně sedí AI agent, dostane vedle běžné červené obrazovky i strukturovaný markdown rovnou do JS konzole. A do log/ složky vedle každé .html výjimky přibývá .md sourozenec.

Lidský vývojář dál vidí BlueScreen, Tracy Bar a dumpy ve známé podobě. Ale když místo člověka u monitoru sedí AI agent, který vaši aplikaci řídí přes prohlížeč, vizuální nástroje pro něj nejsou. Pečlivě navržená červená obrazovka, panely Tracy Baru s rozbalovacími tabulkami, dumpy s barevným zvýrazněním, to vše je optimalizované pro lidské oko. Agent z toho velmi často nevyčte to podstatné, nebo se snaží parsovat HTML, což je neefektivní a nespolehlivé.

Konzole prohlížeče je oproti tomu strukturovaný kanál, který agent čte snadno. A markdown je pro LLM mateřština. Tracy 2.12 proto přidává druhou, paralelní stopu: člověk dál vidí to, co znal vždycky, a agent ke stejnému běhu dostane markdown verzi rovnou do console.log() a console.error(). Nic nepřepisuje, nic neskrývá, jen přidává.

Jak využít Tracy markdown v praxi

Tracy markdownem mluví ke dvěma odlišným publikům.

1. Vývoj s AI agentem v prohlížeči. Agent řízený přes Chrome DevTools MCP, Playwright nebo Puppeteer si otevře vaši aplikaci. Tracy ho detekuje a začne posílat markdown do konzole.

2. Dávková oprava chyb v PHP pomocí AI. V produkčním logu máte spousty exception-*.html. Dřív se to procházelo ručně: klik, čtení, hledání, oprava, další soubor. S markdown sourozenci to jde jinak: vezmete celou složku, předáte ji agentovi s pokynem „projdi tyhle reporty a oprav, co najdeš“, a on postupně jede.

1. Vývoj s AI agentem v prohlížeči

Tato část se aktivuje jen pro detekovaného agenta v debug režimu. Co konkrétně do konzole dorazí:

BlueScreen. Při neodchycené výjimce Tracy vedle standardní červené obrazovky pošle do konzole i markdown verzi: výjimku, stack trace, hodnoty proměnných, dump $_GET / $_POST / $_COOKIE. Funguje to pro synchronní render i pro chyby v AJAXu.

Tracy Bar. Debug bar v rohu obrazovky pošle do konzole markdown shrnutí některých panelů. SQL panel s počtem dotazů a jejich časy, Errors panel s warningy, Dumps panel s plain text dumpy, které zachytil bdump().

Dumpy. Když v kódu zavoláte dump($var), vedle běžného HTML výpisu se do konzole pošle i plain text varianta. Dumpy tak agentovi neuniknou pohřbené v HTML stránce.

Ale pozor! Agent sám od sebe neví, že má v konzoli něco hledat. Bude prohlížet vykreslené HTML, snažit se parsovat barevný BlueScreen a hádat, co se vlastně stalo. Tohle řeší skill tracy-debugging, návod psaný přímo pro agenta. Říká mu: po každém requestu zavolej list_console_messages(), tam najdeš Tracy Bar a BlueScreen v markdownu, takhle vypadá SQL panel, takhle stack trace, takhle se čtou dumpy. Skill je součástí oficiálního Nette pluginu pro Claude Code.

2. Dávková oprava chyb v PHP pomocí AI

Kdykoli Tracy zaloguje výjimku do souboru log/exception-*.html, ve stejnou chvíli zapíše vedle něj .md sourozence se stejným obsahem v markdownu.

Pro člověka, který do adresáře nakoukne, se nic nemění; .md jen leží vedle .html a vyberete si, co chcete otevřít. Smysl získává až ve chvíli, kdy obsah adresáře předáte agentovi.

Vyplatí se napsat si na to vlastní skill, který agentovi řekne, jak postupovat: porovnat každou výjimku s aktuálním kódem (chyba už mohla být opravená), seskupit související reporty a před opravou ukázat plán k odsouhlasení. Místo stovek HTML souborů k ručnímu louskání máte ze složky chybových hlášení vstup pro jednu dávkovou akci.

Pro tvůrce vlastních panelů: getAgentInfo()

Když máte vlastní IBarPanel, třeba databázový panel nebo profiler, a chcete agentovi poslat markdown verzi jeho obsahu, přidejte do třídy panelu metodu getAgentInfo(): ?string:

class MyDatabasePanel implements Tracy\IBarPanel
{
	public function getTab(): string { /* ... */ }
	public function getPanel(): string { /* ... */ }

	public function getAgentInfo(): ?string
	{
		return "## Database\n\n- Queries: {$this->count}\n- Total time: {$this->time} ms\n";
	}
}

Tracy vrácený markdown zařadí do výpisu Tracy Baru pro agenta. Když metoda chybí nebo vrátí null, panel se v markdown výpisu vynechá.

Jak se detekuje agent

Ještě nakoukneme pod kapotu. Klíčem detekce je JavaScriptová vlastnost navigator.webdriver. Chrome i Firefox ji nastavují na true, jakmile prohlížeč běží pod automatizací: WebDriver, Chrome DevTools Protocol, Playwright, Puppeteer. V praxi to pokrývá běžné browser MCP servery, jako jsou Chrome DevTools MCP od Googlu, Playwright MCP od Microsoftu, mcp-chrome, servery postavené nad Puppeteerem nebo Browser Use. Stačí si tedy v Claude Code spustit kterýkoli z nich a Tracy 2.12 ho rozpozná sama.

Mechanicky to funguje tak, že si JavaScript Tracy Baru navigator.webdriver přečte a v případě true nastaví cookie tracy-webdriver=1. PHP pak markdown výstupy podmiňuje právě touhle cookie. Pokud chcete markdown výstupy vidět z normálního prohlížeče, třeba když ladíte vlastní integraci, stačí si cookie nastavit ručně v devtools.

Vyzkoušejte to

Tracy se naučila nový dialekt a v tomhle směru bude pokračovat dál. Budoucnost vývoje patří agentům, kteří aplikace píšou i opravují, a my hledáme co nejlepší způsob, jak s nimi mluvit. Markdown v konzoli, .md sourozenci v logu, getAgentInfo() na panelech: to je první kolo. Praxe ukáže, jestli to funguje, kde to drhne, kudy se ubírat dál.

Nainstalujte si Tracy 2.12 přes composer require tracy/tracy:^2.12 a zkuste si to, hlavně ti, kdo jedete Claude Code s Chrome MCP nebo Playwright/Puppeteer s agenty. Zpětnou vazbu rád uvítám.

David Grudl Je specialista na umělou inteligenci a webové technologie, tvůrce Nette Framework a dalších populárních open-source projektů. Publikuje na blozích Uměligence, phpFashion a La Trine. Školí práci s AI nástroji a moderuje pořad Tech Guys. Umělou inteligenci se snaží přiblížit lidem srozumitelným způsobem. Je kreativní a má smysl pro praktické využití technologií.

Komentáře

  1. Zajímavé!

    Zrovna sedím u testování pomocí Nette Testeru a snažím se s Claudem přijít na nějakou chybu. O nějaké integraci v tomto směru také neuvažuješ?

    Claude je na psaní Nette testů velmi dobrý a pokryl mi většinu kódu.

    před 6 hodinami

Chcete-li odeslat komentář, přihlaste se