Programování

Testování webových aplikací pomocí Node.js a Playwright

Vývoj moderních aplikací závisí na automatizovaném testování pomocí testovacích rozhraní k zajištění toho, že je kód připraven jít do aplikačních balíčků a ven koncovým uživatelům. Chcete-li z testování těžit co nejvíce, jsou testy psány před kódem a lze je integrovat do kanálů pro řízení zdrojů a CI / CD (průběžná integrace / průběžné nasazení). Testy by měly být všude ve vašem vývojovém procesu. Potřebujete sloučit žádost o stažení? Vyzkoušejte kód. Potřebujete se zavázat k pobočce? Vyzkoušejte kód.

Existuje však jedna oblast, kde je testování těžké, zvláště když je třeba ji automatizovat. Mluvím o potřebě interakce a testování dynamických uživatelských rozhraní. Testování webových aplikací je složitý proces. Nástroje jako Selenium a webdriver jsou klíčové prvky při automatizaci obsahu stránky a zajištění toho, že testujete jak prvky stránky, tak celou aplikaci. Jsou důležité, pokud v aplikaci používáte bezhlavé prohlížeče; Používal jsem sadu skriptů Pythonu v aplikaci Twitter postavené na podpoře webového ovladače Selenium a Chromium k automatizaci pořizování snímků obrazovky z aplikace pro sledování letadel.

Představujeme Playwright, rámec pro testování webu společnosti Microsoft

Selen a webdriver nejsou jedinými nástroji pro vytváření komplexních testů moderních webových aplikací a prohlížečů. Populární alternativou je Puppeteer společnosti Google, který zpracovává odesílání kliknutí do prohlížečů pomocí stejných technik jako nástroje pro webový ovladač Chrome a přístup k informacím o ladění pomocí API známých vývojářských nástrojů. Playwright, novější účastník ligy testování prohlížečů, je vyvíjen společností Microsoft jako open source projekt hostovaný na GitHubu.

Dramatik přebírá základní architekturu Puppeteer a posouvá ji více směrem k selenu, přidává rámec pro automatizaci webu a vylepšuje interakci Puppeteer s obsahem stránky. Je navržen pro rychlou a snadnou instalaci pomocí známé syntaxe npm, pomocí JavaScriptu k vytvoření automatizace a testování webových aplikací. Funguje s více prohlížeči, s podporou prohlížečů založených na chromu, jako je Edge, stejně jako Firefox a WebKit společnosti Apple.

V seznamu podporovaných prohlížečů Playwrightu je důležitá zpráva: Nelze jej použít v prohlížečích založených na Trident nebo EdgeHTML. To není překvapující. Společnost Microsoft se ve svém novém Edge pevně zavázala ke své pobočce Chromium a starý Edge a Internet Explorer se blíží ke konci své životnosti. Pokud budete pro testování používat Playwright, rozhodujete se o podpoře pouze běžných moderních prohlížečů, takže budete muset informovat uživatele o tom, co čeká na budoucí vydání všech webových aplikací, které vytváříte a podporujete.

Testování webu pomocí aplikace Playwright

Schopnost testování napříč platformami na všech hlavních prohlížečích se stejnou sadou skriptů je důležitá, stejně jako podpora pro mobilní verze webů (protože dvě hlavní mobilní platformy používají varianty svých prohlížečů pro počítače, Playwright aktuálně emuluje mobilní zobrazení v prohlížečích pro stolní počítače. ). Důležitá je také podpora bezhlavých testů, při kterých nevykreslíte uživatelské rozhraní prohlížeče a pracujete místo toho s vygenerovaným objektovým modelem dokumentu (a stínovým DOM, pokud používáte moderní funkce prohlížeče a technologie, jako jsou webové komponenty).

Playwright můžete použít k automatizaci běžícího prohlížeče na vývojových počítačích ke kontrole chyb v rámci ladění aplikací, což vám zajistí, že budete konzistentně procházet všemi vašimi testovacími cestami při nahrávání dalších informací o výkonu a sledování nesledovaných závad uživatelského rozhraní. Alternativně může být nastaven jako součást akce GitHubu pro testování nového kódu jako součást potvrzení nebo sloučení, automatizace toho, co by jinak mohlo být složitým ručním testem.

Vytváření a spouštění testů dramatiků

Začínáme s Playwrightem je stejně snadné jako nastavení nového projektu Node.js. Nejprve si na své testovací zařízení nainstalujte Node.js. Protože Playwright používá Node, můžete jej spustit na vývojových počítačích nebo na serverech ve vašem kanálu CI / CD, čímž se stane součástí akce GitHub, kterou lze použít v celém procesu vývoje softwaru. Vše, co potřebujete, je jediný příkaz npm, který nainstaluje balíček Playwright a binární soubory pro všechny podporované prohlížeče. Po dokončení instalace můžete vytvářet automatizační skripty pomocí JavaScriptu nebo TypeScript pro volání rozhraní Playwright API. Jedná se o asynchronní volání, takže ke splnění svých slibů použijte příkazy await.

Výsledkem je velmi jasný způsob vytváření skriptů, počínaje otevřením instance bezhlavého prohlížeče a následnou navigací na stránku před interakcí s instancemi stránky. Je dobré nejprve vytvořit testy s plnohodnotnými prohlížeči, abyste mohli sledovat, jak Playwright interaguje s vaší aplikací. Užitečná pomalá možnost spouští interakce lidštější rychlostí, což usnadňuje vizualizaci a správu testů spuštěných v prohlížečích pro stolní počítače. Jakmile je test laděn a běží dobře, můžete jej přesunout do bezhlavého režimu a poté jej spustit jako součást implementace CI / CD.

Playwright obsahuje nástroj CLI, který dokáže zaznamenávat interakce s weby a automaticky generovat JavaScript potřebný ke spuštění testů. Možnost codegen je užitečný nástroj pro rychlé zahájení práce s Playwrightem, který vám ukáže kód, který interaguje s prvky stránky, které pak můžete použít jako šablonu pro vlastní testy, podle potřeby kopírovat a upravovat generovaný kód. Podpora strojopisu může pomoci psát složitější testy a ke správě proměnných používá silné psaní.

Práce s webovými aplikacemi v Playwright

Jednou z užitečnějších funkcí Playwrightu je jeho podpora kontextů prohlížeče. Ty vám umožňují spouštět izolované akce v jedné instanci prohlížeče, takže můžete nastavit několik kontextů pro testování několika interakcí najednou. V každém kontextu vytváříte stránky, které se nejlépe považují za karty v prohlížeči na ploše. Stránky podporují své vlastní interakce s klikáním a lze je sledovat paralelně. Jakmile jste na stránce, můžete použít různé způsoby hledání obsahu, se kterými můžete komunikovat, pomocí selektorů CSS nebo XPath, atributů HTML nebo textu. Pokud jste obeznámeni se selenem, měli byste se seznámit s procházením stránkami, s přidanou schopností čekat na úplné načtení stránky nebo na vykreslení dynamického obsahu v jednostránkové webové aplikaci.

Můžete použít vyhodnocovací funkce k odeslání parametrů na az webových stránek do kódu JavaScriptu spuštěného v kontextu stránky. Výsledky jsou vráceny běžci testovacího skriptu v Node.js pro analýzu, což vám poskytne nástroje potřebné k úspěšnému nebo neúspěšnému testování. Playwright pracuje s devtools prohlížeče F12, takže dokáže mnohem víc, než jen jednoduše komunikovat s obsahem stránky. Může monitorovat síťový provoz, takže jej můžete mimo jiné použít k testování ověřování i stahování souborů. Může přistupovat ke konzole prohlížeče a zaznamenávat chyby, které nemusí být okamžitě viditelné na vykreslené stránce: například sledování problémů s CSS nebo knihoven JavaScript, které se nepodaří načíst.

V Playwrightu je toho hodně a je to přitažlivá alternativa k selenu pro testování aplikací v prohlížeči. Vzhledem k tomu, že společnost Microsoft neustále přidává vývojové nástroje F12 v Edge, bude zajímavé sledovat, jak Playwright přidává nové funkce, které rozšiřují vaše možnosti testování aplikací hostovaných v prohlížeči a progresivních webových aplikací vedle tradičních webových aplikací.

Beyond JavaScript: Testing in Python and C #

Společnost Microsoft nedávno vydala novou verzi aplikace Playwright pro vývojáře, kteří dávají přednost vytváření testů v Pythonu před JavaScriptem. Je to užitečná možnost, protože mnoho existujících testovacích rámců selenu je založeno na Pythonu, a umožňuje vám propojit váš testovací kód s analytickými balíčky pro podrobnější analýzu výsledků pomocí bohatého ekosystému statistických aplikací a nástrojů Pythonu.

Playwright zahrnuje jazykové vazby pro C #, takže můžete Playwright přenést do existujících testovacích rozhraní pro ASP.NET nebo jiné nástroje .NET. Při zavádění nových nástrojů byste nemuseli měnit způsob práce a Microsoft slibuje další jazykové vazby pro Java a Ruby. V budoucnu existuje vyhlídka na další, protože dokumentace Playwright uvádí, že je navržena tak, aby podporovala vazby pro jakýkoli jazyk. Se vším kódem na GitHubu máte příležitost vytvořit si vlastní vazby pro váš testovací jazyk dle výběru a odeslat je jako požadavek na vyžádání do projektu.

$config[zx-auto] not found$config[zx-overlay] not found