Elöljáróban annyit, hogy az itt elkészítésre kerülő dolgok nem éles rendszerhez készülnek, hanem csak kipróbálási célból, vagy épp arra, hogy segítséget nyújtsanak.
Mint minden jó írás, én is próbálom azzal kezdeni az első ilyen típusú bejegyzést, hogy mik is azok az első lépések, amiket szükséges megtennünk ahhoz, hogy el tudjunk kezdeni, automata teszteket implementálni.
Én mindezt Windows környezetben, és TypeScript alapon valósítom meg, ami GitHub-ban lesz tárolva, futtatva.
Amire első körben szükségünk van, egy NodeJs telepítés, és lehetőleg abból is egy legújabb LTS változat. Ez a telepítés nem egy nagy kunszt, szimpla next, next, finish, viszont az egész alapja. Miután a telepítés végzett, egy node -v parancsot kiadva terminálban, meg tudunk győződni arról, hogy az adott verzió elérhető-e a gépünkön.
Majd szükségünk lesz egy fejlesztő környezetre, amelyből én a Visual Studio Code-ot használom, mert számomra igencsak kézre áll. Letöltést követően ezt is könnyedén telepíthetjük.
Most már majdnem adottak az alapok, hogy belekezdjünk a Playwright telepítésébe, de előtte én meg azt mondanám, hogy válaszuk ki a package managert is, és mivel jelenleg a pnpm az, ami új és előre mutató, így azt választom.
A pnpm telepítésére nyissunk egy power shellt, majd pedig adjuk ki a következő parancsot: Invoke-WebRequest https://get.pnpm.io/install.ps1 -UseBasicParsing | Invoke-Expression.
Majd pedig győződjünk meg róla, hogy létrejött a megfelelő bejegyzés a system environment variables-ben. Ha ez rendben, érdemes újraindítani a VS Code-ot, mielőtt folytatnánk a következő lépésekkel.
Most pedig elkezdhetjük a Playwright telepítését. Először is hozzunk létre egy könyvtárat a számítógépen (amit később majd hozzáadunk egy Git repositoryhoz). Szóval nyissunk egy terminált, és adjuk ki a következő parancsot: pnpm create playwright. Miután a telepítés lefutott, pár kérdést kapunk, ahol, ha semmi nem mond ellent neki, válaszuk az alapértelmezett válaszokat, miszerint TypeScript, tests könyvtár, GitHub Actions workflow, Install Playwright browsers.
Mit látunk most, ha megnyitjuk az explorert? Van egy playwright.config.ts fájlunk, ami a tesztekhez szükséges beállításokat tartalmazza. Van egy package.json és package-lock.json, amik a csomagkezelésért, parancsokért felelnek, illetve a már említett tests könyvtár, ahová az alap telepítés egy example.spec.ts fájlt hozott létre, amit le is tudunk futtatni, ezzel kipróbálni, hogy a telepítésünk sikeres volt.
A következő parancsot terminálból kiadva tudjuk lefuttatni az összes tesztet (jelen pillanatban azt az egyet, ami alapból létrejött): pnpm exec playwright test.
Miután a tesztek lefutottak, a pnpm exec playwright show-report parancs megnyitja a riportot, amin keresztül látni lehet, hogy pontosan milyen eredménnyel zárult a futás.
UI Mode-ban is van mód futtatni és elemezni, erre a pnpm exec playwright test –ui parancs szolgál.
A Playwright frissítése: pnpm install --save-dev @playwright/test@latest, a böngészők letöltése: pnpm exec playwright install --with-deps parancsokon keresztül történik.
Végezetül pedig az aktuális Playwright verzióját igy nézhetjük meg: pnpm exec playwright –version.
Az a helyzet, hogy maga a Playwright erre íródott oldala a legjobb forrás, ahonnan én is összeszedtem az információkat. Ezt érdemes lapozgatni, én eddig mindenre találtam megoldást benne.