Binnen mijn project bij Nationale Nederlanden test ik onder andere de functionaliteit van de website op verschillende devices. Dat doe ik volgens het principe van Continuous Integration. Daarom test ik continu de responsiveness van wat we opleveren. Nadat ik van tevoren samen met mijn team check of alle componenten die we willen gaan gebruiken goed samen zullen gaan. Zo versnellen we het traject en verbeteren we het product. Onze ouderwetse testkoffer vol devices wordt daarbij langzaamaan vervangen door handige, snelle tools.
Componentengedrag
Als tester binnen het front end team, test ik met name hoe ons product er op verschillende devices uitziet. Want een design kan er op een desktop goed uitzien, maar op een smartphone volledig de mist in gaan. Denk maar eens aan formulieren die op je smartphone helemaal verspringen waardoor de verschillende componenten over elkaar heen vallen. Gebruiksonvriendelijker kan bijna niet! Ik controleer daarom altijd: hoe werkt het ontwerp in landscape mode? En hoe in portrait mode? Ook controleer ik de klikbaarheid: hoe snel is de respons? Werkt het design vertragend? Ik check ook of het overeenkomt met het design. Belangrijk is altijd dat alle componenten die gebruikt worden goed samen kunnen functioneren, welk device je ook gebruikt. Daarom denk ik vooraan in het ontwikkeltraject al mee over hoe een component zich gedraagt in combinatie met andere componenten. Als ik daarna test of alles klopt, koppel ik mijn bevindingen meteen terug.
Tools voor Continuous Integration
Momenteel zit ik nog vaak te graaien in ‘de koffer’; een begrip bij de klant waar ik nu werk. Het is een verzamelbak vol devices die door ons als tester en door andere stakeholders gebruikt worden om te testen of een opgeleverd product werkt. Maar ‘de koffer’ verdwijnt langzaamaan steeds meer uit beeld. Want testen via de devices uit onze koffer is altijd een steekproef omdat we niet alle devices voorhanden kunnen hebben. Daar willen we vanaf. Bovendien is het te tijdrovend. Tegenwoordig wil de klant Fast Feedback om kwaliteit te behouden binnen Continuous Integration. Daarom werken we steeds meer met online tools. Zelf werk ik vooral met BrowserStack en BackstopJS. Een korte toelichting:
1. Browserstack
Browserstack is al jarenlang een heel handige online tool waarmee je eigenlijk alle devices kunt simuleren: je kiest een applicatie en die test je bijvoorbeeld op iOs 9.0.1. van de iPhone6. Daarmee draai je je site of component op BrowserStack. Zo doe je hiermee wat je anders fysiek op je device zou doen.
2. BackstopJS
Momenteel werk ik ook met BackstopJS. Binnen deze automatiseringstool kun je een enkele component of een hele website testen. Je kiest één moment als referentie waarna BackStop automatisch screenshots maakt van tien componenten op dat moment. Want het ene component dat iemand aanpast kan een andere component laten omvallen. Een dag later draai ik mijn test opnieuw en dan ziet BackstopJS vanzelf of er een verandering is. Ik hoef dit dus niet meer met het blote oog te beoordelen. Vervolgens kijk ik in de code naar de verandering en ga ik naar een developer om te checken of het om een bewuste aanpassing gaat of om een bevinding. Het kan zijn dat door een aanpassing van een collega een button kleiner is geworden. Als dat is omdat de opdrachtgever tijdens een sprint heeft aangegeven het toch anders te willen hebben, dan wordt dát mijn nieuwe referentie en sla ik die als nieuw clean shot op. BackstopJS draai ik meerdere keren per dag. Onlangs gaf ik een presentatie over het gebruik van dit programma voor mijn collega’s en zij waren erg enthousiast. Ook voor een acceptatieomgeving is het bijvoorbeeld heel bruikbaar. Vooralsnog zijn wij echter de enige die met het programma werken. Omdat het is geschreven in Javascript heeft een collega – front end developer – het programma voor mij geïnstalleerd zodat ik ermee aan de slag kan. Momenteel ben ik druk bezig om scenario’s toe te voegen. Bijvoorbeeld: ik wil voor component x, y, z moment a als referentiemoment kiezen omdat ik weet dat daar iets gaat gebeuren en ik later wil kunnen bekijken of er niets is omgevallen.
Keep it cool
Digitale services ontwikkelen zich razendsnel. Het testen voor alle devices wordt daarom steeds belangrijker. De nieuwe tools die hiervoor zijn ontwikkeld zijn handig en nodig. Testen vanuit de koffer wordt steeds minder gebruikelijk. Binnen Bartosz hebben we vanuit Bartosz Labsz de Coolwall: een wall waarop we voor elkaar bijhouden welke tools hot en welke not zijn. Tijdens maandmeetings komt deze wall even aan bod. Hartstikke handig, want zo blijven we goed op de hoogte van elkaars ontdekkingen.