Co jsou nástroje pro vývojáře Chrome (Chrome DevTools)?

Nástroj Chrome DevTools je sada vestavěných nástrojů v prohlížeči pro vývoj a ladění webu.

Hlavní panely:

• Elements: Zobrazení a úprava struktury HTML a stylů CSS v reálném čase.
• Console: Výstup logů, spouštění JavaScriptového kódu, ladění.
• Sources: Ladění JavaScriptového kódu s body přerušení, profilování výkonu.
• Network: Monitorování síťových požadavků (HTTP/HTTPS), analýza jejich doby trvání a obsahu.
• Performance: Analýza doby načítání a provádění kódu stránky.
• Memory: Profilování využití paměti, odhalování úniků.
• Application: Zkoumání zdrojů aplikace — úložiště (Local Storage, Session Storage, IndexedDB), cookies, cache.
• Security: Analýza bezpečnosti stránky, včetně kontroly certifikátů SSL.
• Lighthouse: Audit webové stránky podle kritérií výkonu, přístupnosti, SEO a osvědčených postupů.

Použití v QA:

• Kontrola UI/UX: Analýza stylů (Elements), testování přizpůsobivosti (Toggle device toolbar).
• Ladění frontendu: Odhalování chyb v JavaScriptu (Console, Sources).
• Analýza API interakcí: Monitorování požadavků a odpovědí (Network).
• Hodnocení výkonu: Odhad doby načítání a provádění skriptů (Performance).
• Průzkum úložišť: Kontrola Local Storage, cookies atd. (Application).
• Simulace zařízení: Testování na různých velikostech obrazovky a síťových podmínkách (Network – Throttling).