Webapplicaties testen als een pro met Playwright
Elke dag duiken onze teams in de code. Ze bouwen complexe websites en klantportalen - maar voordat we deze de wereld in schoppen, willen we zeker weten dat ze onverwoestbaar zijn. Daarom wordt alles grondig getest en dat is waar Playwright om de hoek komt kijken. Met Playwright kunnen we onze webapplicaties geautomatiseerd testen. Onze developer Richard van der Meer onthult waarom Playwright niet alleen waardevol, maar simpelweg onmisbaar is voor iedere webdeveloper.
Het testen van je website en interacties
Bij het ontwikkelen van een website ontstaan allerlei interacties, van downloadknoppen tot inschrijfformulieren. Al die interacties testen kan een helse klus zijn: Voor iedere interactie zijn namelijk meerdere scenario’s mogelijk. Bijvoorbeeld het scenario dat een document niet wordt gedownload na het klikken op de downloadknop. Voorheen werden alle testen handmatig uitgevoerd en was het een intensieve en tijdrovende klus. Maar met Playwright hebben we dit bij TRES volledig geautomatiseerd. Hierdoor besparen we niet alleen veel tijd, maar voorkomen we ook fouten.
Wat is Playwright?
Playwright is een open source test-framework voor webapplicaties dat geautomatiseerd browserinteracties kan testen op onder andere functionaliteit en prestaties. Met deze tool kunnen we de kwaliteit en stabiliteit garanderen voor de digitale oplossingen van onze opdrachtgevers. Playwright is een los framework die je kunt integreren in je code, maar ook in bijvoorbeeld Azure DevOps, de tool die wij bij TRES gebruiken om code in te beheren en publiceren.
Hoe werkt Playwright?
Een website is een continu proces van doorontwikkeling. Met iedere aanpassing in de code van de website kunnen er potentieel bugs ontstaan. Met Playwright kun je snel en automatisch browserinteracties testen nadat je aanpassingen in de code hebt doorgevoerd. Welke tests Playwright precies voor je uitvoert bepaal je door het schrijven van scenario’s. Wanneer je de code tijdens het ontwikkelen aanpast, doorloopt Playwright elke geschreven scenario en geeft daarna aan of er fouten zijn gevonden. Komt er een fout naar boven? Dan voorkomt Playwright dat de website gepubliceerd wordt.
Playwright toepassen
Om een concreet voorbeeld te geven hoe wij Playwright toepassen tijdens het ontwikkelen van een website nemen we onze opdrachtgever SUSA als voorbeeld. SUSA is al meer dan 76 jaar de specialist in student en werk, en helpt talloze HBO- en WO-studenten aan een flexibele bijbaan naast hun studie. Om het sollicitatieproces efficiënt, snel en kwalitatief goed te laten verlopen, vult de student tijdens het solliciteren al een aantal kwalificatievragen in op de website middels een inschrijfformulier. Dit formulier bevat allerlei afslagen, afhankelijk van bijvoorbeeld opleiding, leeftijd en ervaring. Hierdoor ontstaan er wel meer dan 50 verschillende straten. Als je dit allemaal handmatig moet testen, is dat enorm tijdrovend. Daarom schrijven we zogenaamde scenario’s. Dit zijn situaties die getest worden in Playwright.
Met Playwright hebben we bij TRES handmatige testen geautomatiseerd, wat niet alleen tijd bespaart, maar ook fouten voorkomt.
Voorbeeld scenario
Om het gebruik van Playwright goed te kunnen uitleggen maken we in dit artikel gebruik van een voorbeeldscenario. Het scenario is als volgt: een student wil zich wil registreren als werkzoekende, maar heeft zich al eens eerder geregistreerd op de website. Hierdoor blijkt dat het e-mailadres van de student al eerder gebruikt is voor de registratie. De student krijgt de melding: ‘Je e-mailadres is al gekoppeld aan een account, wil je inloggen?’. Echter in het scenario dat wij in Playwright hebben geschreven ontvangt de student deze melding niet en kan hij zijn registratie niet voltooien.
Wat als Playwright een fout detecteert?
Bij iedere wijziging die wij in de code van een website doorvoeren, doorloopt Playwright alle geschreven scenario’s. Ook wanneer een wijziging niets met het scenario te maken heeft.
Stel, wij voeren een wijziging door in de code van de website van SUSA. Het voorbeeldscenario wordt direct getest door Playwright: werkt de inschrijfstraat van SUSA nog correct na het wijzingen van de code? Indien dit niet het geval is, dus de student krijgt geen melding dat zijn e-mailadres al geregistreerd staat, geeft Playwright een foutmelding zodat we weten dat er een negatief effect is op de inschrijfstraat na het wijzigen van de code. Tegelijkertijd voorkomt Playwright dat er een foutieve versie van de website wordt gepubliceerd door de publicatie tegen te houden.
Dankzij de foutmelding in Playwright kunnen wij de fout in de code corrigeren en wordt de test opnieuw uitgevoerd. Wordt het scenario nu goed doorlopen? Dan wordt de website gepubliceerd, zonder fouten.
Dit is slechts een voorbeeld van een van de vele scenario’s en testen die wij schrijven. Hoe simpel een scenario ook lijkt, ze zijn allemaal belangrijk. Iedere aanpassing in de code van de website die wij doen, kan invloed hebben op de werking van de website.
De voordelen van Playwright voor developers
Testen is belangrijk om te voorkomen dat we fouten maken. Het gebruik van geautomatiseerde tests met Playwright in plaats van handmatige tests zorgt voor minder foutgevoeligheid. Daarnaast voorkomt het dat je een website publiceert die niet goed werkt. Er is minder ruimte voor human error waardoor je websites in principe foutloos kunt uitrollen.
Voordeel voor de opdrachtgever
Geautomatiseerde tests met Playwright bieden ook voordelen voor opdrachtgevers. Het vermindert handmatige inspanningen en stelt ons in staat om bugs vroegtijdig te detecteren en op te lossen, wat resulteert in een snellere oplevering. We maken rapportages van elke test in Playwright, zodat opdrachtgevers precies kunnen zien wat er is getest en dat alles correct is. Dit zorgt voor een transparante samenwerking en waarborgt de algehele kwaliteit van onze digitale oplossingen.
Een essentiële tool voor webontwikkeling
Kortom, Playwright is voor TRES een waardevolle tool om geautomatiseerd browserinteracties te testen en de kwaliteit en stabiliteit van onze digitale oplossingen te garanderen. Door tests te automatiseren met Playwright kunnen we potentiële fouten detecteren en voorkomen, wat resulteert in foutloze implementaties van websites. Dit bespaart niet alleen tijd, maar biedt ook een robuuste garantie voor de betrouwbaarheid van onze digitale oplossingen.
