Les - Geautomatiseerd testen

Python intro
Programming basics-II
Les 3 / Week 7a
Geautomatiseerd testen
Delta
Les 1/2 over geautomatiseerd testen
1 / 44
suivant
Slide 1: Diapositive
Applicatie- en mediaontwikkelaarMBOStudiejaar 2

Cette leçon contient 44 diapositives, avec quiz interactifs et diapositives de texte.

time-iconLa durée de la leçon est: 30 min

Éléments de cette leçon

Python intro
Programming basics-II
Les 3 / Week 7a
Geautomatiseerd testen
Delta
Les 1/2 over geautomatiseerd testen

Slide 1 - Diapositive

Cet élément n'a pas d'instructions




Doelen:
  • We begrijpen de basistheorie van geautomatiseerd testen
  • We herkennen verschillende soorten automatische tests
  • Praktisch geoefend met het schrijven en uitvoeren van unit tests.
Planning:
  • Theorie
  • Discussie
  • Pauze - 🕔10 min
  • PHPUnit met Laravel (praktische demonstratie Unit Testing)
  • Oefenen (praktisch) met PHPUnit in Laravel

Volgende les: Feature testing met PHPUnit in Laravel
Deze les

Slide 2 - Diapositive

Let op, voorbereiding van materiaal noodzakelijk:
1. Druk het document 'Retrospective_een_aantal_vormen.docx' af, zodat er voor iedere groep 1 A4 met een opdracht beschikbaar is
2. Verzamel groot papier (A3 of groter) waarop de groepen kunnen werken
3. Teken op het grote papier alvast de in het retrospective document genoemde tekeningen.

Tijdens de les:
1. Geef toelichting over de verschillende vormen
2.  Leg uit dat dit normaal door de scrum master wordt georganiseerd. Dit is iemand die aan het begin van het project wordt gekozen. Zometeen kiest de docent iemand (en alleen voor de retro)
3. Geef ieder groep een andere vorm van retrospective. Op deze manier kunnen in toekomstige groepen verschillende vormen worden ingezet.
4. Maak in ieder groepje 1 iemand scrum-master. Die gaat verantwoordelijk zijn voor een gestructureerd proces, door collega's eraan te herinneren. Let wel: ieder groepslid doet evenveel mee aan de retro.
Geautomatiseerd testen

Slide 3 - Carte mentale

Cet élément n'a pas d'instructions

Voorbeelden

Slide 4 - Diapositive

Cet élément n'a pas d'instructions

https://github.com/luttje/Key2Joy

Slide 5 - Diapositive

Tim heeft een open-source applicatie 'Key2Joy', waarmee met Keyboard en Muis gedaan kan worden alsof er een Game controller is verbonden. Je kunt ermee instellen dat W-A-S-D bijvoorbeeld de linker stick op de controller beweegt.
Werken hieraan vindt hij leuk, maar het is frustrerend om steeds alle hoeken en gaten van de applicatie te moeten testen, als hij weer iets toevoegt. Dat kost tijd en is het minst interessante aan het werk.
Om te helpen heeft hij automatische tests geschreven. Die doen wat hij normaal handmatig zou doen, of testen zelfs op methode-niveau of op basis van bepaalde input, de gewenste output verschijnt.
https://github.com/luttje/videobrew/

Slide 6 - Diapositive

Tim heeft een open-source applicatie 'Key2Joy', waarmee met Keyboard en Muis gedaan kan worden alsof er een Game controller is verbonden. Je kunt ermee instellen dat W-A-S-D bijvoorbeeld de linker stick op de controller beweegt.
Werken hieraan vindt hij leuk, maar het is frustrerend om steeds alle hoeken en gaten van de applicatie te moeten testen, als hij weer iets toevoegt. Dat kost tijd en is het minst interessante aan het werk.
Om te helpen heeft hij automatische tests geschreven. Die doen wat hij normaal handmatig zou doen, of testen zelfs op methode-niveau of op basis van bepaalde input, de gewenste output verschijnt.
Basistheorie
Wat is handmatig testen?

Wat is geautomatiseerd testen?

Voordelen van geautomatiseerd testen.

Slide 7 - Diapositive

Cet élément n'a pas d'instructions

Basistheorie
Wat is handmatig testen?

Slide 8 - Diapositive

Cet élément n'a pas d'instructions

Basistheorie
Wat is handmatig testen?
Een voorbeeld: "Werkt het bewerken van handleidingen nog?"
Stap 1: Start de applicatie
Stap 2: Ga naar het overzicht van handleidingen
Stap 3: Kies een handleiding om te bewerken
Stap 4: Bedenk realistische test-data
Stap 5: Probeer met die data te bewerken
Stap 6: Werkt het allemaal nog?

Deze stappen voer je iedere keer uit als je code aanpast die 'mogelijk' iets te maken heeft met handleidingen of het bewerken ervan.

Slide 9 - Diapositive

Cet élément n'a pas d'instructions

Basistheorie
Wat is geautomatiseerd testen?

Dezelfde (of meer) tests als bij handmatige tests.

Maar we gebruiken code om die stappen automatisch te doorlopen.

Slide 10 - Diapositive

Cet élément n'a pas d'instructions

Basistheorie
Wat is geautomatiseerd testen?
Een voorbeeld: "Werkt het bewerken van handleidingen nog?"
We schrijven 1x code die volgende doet:
Stap 1: Start de applicatie
Stap 2: Ga naar het overzicht van handleidingen
Stap 3: Kies een handleiding om te bewerken
Stap 4: Bedenk realistische test-data
Stap 5: Probeer met die data te bewerken
Stap 6: Werkt het allemaal nog?

Dezelfde stappen, maar nu uit te voeren met bijvoorbeeld het commando: "run tests"

Slide 11 - Diapositive

Cet élément n'a pas d'instructions

Basistheorie
Voordelen van geautomatiseerd testen.

Slide 12 - Diapositive

  • Sneller dan manueel testen,
  • Minder werk voor de ontwikkelaar (op lange termijn)
  • Minder foutgevoelig (je vergeet niet de ene keer wel bepaalde invoer te testen, en de andere keer niet). De tests liggen vast
Hoe ziet zo'n automatische test er uit?

Slide 13 - Diapositive

Cet élément n'a pas d'instructions

C#

Slide 14 - Diapositive

Cet élément n'a pas d'instructions

C#
Test Runner
Opruimen na tests
Iedere test is een eigen methode
Met 'Assert' stellen we de positieve situatie vast, waarmee de test geslaagd is.
De tests krijgen een eigen project
C#

Slide 15 - Diapositive

Cet élément n'a pas d'instructions

C#
Test Runner
Opruimen na tests
Iedere test is een eigen methode
Met 'Assert' stellen we de positieve situatie vast, waarmee de test geslaagd is.
De tests krijgen een eigen project
C#

Slide 16 - Diapositive

Cet élément n'a pas d'instructions

C#
Test Runner
Opruimen na tests
Iedere test is een eigen methode
De tests krijgen een eigen project
C#
Met 'Assert' stellen we de positieve situatie vast, waarmee de test geslaagd is.

Slide 17 - Diapositive

Cet élément n'a pas d'instructions

JavaScript / TypeScript

Slide 18 - Diapositive

Cet élément n'a pas d'instructions

C#
JavaScript/TypeScript
met 'Jest'
Test Runner via CMD
Opruimen na tests
Iedere test is een aanroep van de 'it' functie
Met 'expect' stellen we de positieve situatie vast, waarmee de test geslaagd is.
De tests krijgen een map in het project

Slide 19 - Diapositive

Cet élément n'a pas d'instructions

PHP met PHPUnit
Open de documentatie over geautomatiseerd testen in Laravel: https://laravel.com/docs/10.x/testing
👓 Zoek uit: 
Hoe wordt een automatische test geschreven?
Hoe wordt zo'n test uitgevoerd?

Slide 20 - Diapositive

Cet élément n'a pas d'instructions

In jouw eigen woorden:
Wat is handmatig testen?

Slide 21 - Question ouverte

Cet élément n'a pas d'instructions

In jouw eigen woorden:
Wat is automatisch testen?

Slide 22 - Question ouverte

Cet élément n'a pas d'instructions

In jouw eigen woorden:
Wat zijn enkele voordelen van automatisch testen?

Slide 23 - Question ouverte

Cet élément n'a pas d'instructions

Soorten geautomatiseerde tests

Slide 24 - Diapositive

Cet élément n'a pas d'instructions

Soorten geautomatiseerde tests
Alle type tests vallen in een van deze twee categorieën:

Functioneel:
Test 'echte wereld' situaties van de software. 
Bijv.: Een Taxi-app als Uber moet gebruikers kunnen verbinden met chauffeurs als aan alle voorwaarden is voldaan.

Niet-functioneel:

Slide 25 - Diapositive

Cet élément n'a pas d'instructions

Soorten geautomatiseerde tests
Alle type tests vallen in een van deze twee categorieën:

Functioneel:
[...]
Niet-functioneel:
Test de beveiliging van de app, snelheid, manier van data opslaan.
Bijv.: De Taxi-app moet snel werken voor gebruikers. De app staat enorm lang actief bij chauffeurs, dat moet zonder problemen gaan. Ook als de chauffeur door een tunnel rijdt moet het systeem blijven werken.

Slide 26 - Diapositive

Cet élément n'a pas d'instructions

Soorten geautomatiseerde tests
Type tests:
  • Unit Tests
  • Feature Tests
  • E2E Tests

Andere types:
Smoke Tests, Integration Tests, Regression Tests, Security Tests,
Performance Tests, Acceptance Tests

Wat weet je al hierover?
Herken je iets?

Slide 27 - Diapositive

Cet élément n'a pas d'instructions

Testing Frameworks

Slide 28 - Diapositive

Cet élément n'a pas d'instructions

Testing Frameworks
Je kunt automatische tests volledig zelf schrijven, maar vaak gebruiken we een Framework:
  • MSTest (C#)
  • NUnit (C#)
  • xUnit (C#)
  • Playwright (C#, Python, JavaScript/TypeScript)
  • Jest (JavaScript/TypeScript)
  • Mocha (JavaScript/TypeScript)
  • Cypress (JavaScript/TypeScript)

Slide 29 - Diapositive

Cet élément n'a pas d'instructions

Testing Frameworks
Het testing framework geeft ons de mogelijkheid om
  • Tests te schrijven
  • Tests uit te voeren ('Test Runner')
  • Testresultaten in te zien

Slide 30 - Diapositive

Cet élément n'a pas d'instructions

Testing Frameworks
MSTest, NUnit, xUnit, Playwright, Jest, Mocha, Cypress

Slide 31 - Diapositive

Cet élément n'a pas d'instructions

Testing Frameworks
MSTest, NUnit, xUnit, Playwright, Jest, Mocha, Cypress
Jest
Mocha

Slide 32 - Diapositive

Cet élément n'a pas d'instructions

Testing Frameworks
Enkele mogelijkheden in PHP:


Pest
PHPUnit
Of met Laravel:

Slide 33 - Diapositive

Cet élément n'a pas d'instructions

Terminologie

Slide 34 - Diapositive

Cet élément n'a pas d'instructions

Praktische Demonstratie
Laravel tests schrijven en uitvoeren
Met behulp van het testing framework PHPUnit

Slide 35 - Diapositive

https://github.com/curio-lesmateriaal/tests-demonstratie-4s-manuals
💻  Clone: https://github.com/curio-lesmateriaal/tests-demonstratie-4s-manuals
- Je hoeft geen fork te maken, je gaat dit project enkel lokaal gebruiken om te oefenen
- Volg de instructies in de README.md om het project op te starten

🧪 Voer de tests uit volgens de instructies in de README.md
- Lees het gedeelte onderaan de README eens door over hoe de Unit test voor Manual.getFilesizeHumanReadableAttribute() tot stand is gekomen

👷 Verbeter de getFilesizeHumanReadableAttribute methode.
- Nu faalt de test omdat voor '1 bytes' wordt teruggegeven, terwijl '1 byte' wordt verwacht.
- Pas de methode in Manual.php aan, zodat de test slaagt

👷‍♀️ Test meer waardes in de tests voor KB, MB, GB.
- Zoek online wat de onder- en bovengrenzen zijn voor deze eenheden.
- Breidt de tests op dezelfde manier uit als nu gedaan wordt in tests/Unit/ManualTest.php.

🥼 Snel klaar? Bekijk de code in dit project (of jullie eigen 4S Manuals project) en zoek meer functies die je kunt testen.
- Test bijvoorbeeld: getNameUrlEncodedAttribute in Type
- Maak voor ieder ander bestand een eigen test-bestand (bijv.: php artisan make:test TypeTest --unit)
Unit Tests in Laravel met PHPUnit
Let op: de if-statement in deze methode gebruikt geen accolades. Daarom kan na iedere if/elseif/else maar 1 regel code komen. Voeg zelf accolades toe waar dat nodig is. [▶ Uitleg over deze if-statements zonder { }]

Slide 36 - Diapositive

Cet élément n'a pas d'instructions

Python intro
Programming basics-II
Les 3 / Week 7a
Geautomatiseerd testen 2: Feature Tests
Delta
Les 2/2 over geautomatiseerd testen

Slide 37 - Diapositive

Cet élément n'a pas d'instructions

Slide 38 - Diapositive

Cet élément n'a pas d'instructions

Autorisatie Test

Slide 39 - Diapositive

Cet élément n'a pas d'instructions

Feature tests schrijven in Laravel
💻  We gaan verder hetzelfde project als gisteren: https://github.com/curio-lesmateriaal/tests-demonstratie-4s-manuals
- Je hoeft niet opnieuw te clonen
- Zorg dat je nu wel de 4s_manuals.sql importeert, we hebben testdata nodig om mee te werken!

🧨 We gaan een 'Smoke Test' schrijven
- Gaat voor ons: navigeren naar een merk -> type -> handleiding
- Verteld ons of de ultieme basis van de applicatie nog werkt

Instructies op de volgende slides

Slide 40 - Diapositive

Feature tests schrijven in Laravel
💻 Voer in de root van het project dit commando uit om het testbestand aan te maken:
php artisan make:test ManualSmokeTest


📃 Voeg de feature test toe die hier rechts staat


▶ Start de tests
Gebruik dit commando om de unit tests even over te slaan:
php artisan test --testsuite=Feature

Slide 41 - Diapositive

Cet élément n'a pas d'instructions

Feature tests schrijven in Laravel
📃 Voeg ook deze feature tests toe aan de ManualSmokeTest







▶ Start de tests
Gebruik dit commando om de unit tests even over te slaan:
php artisan test --testsuite=Feature

Slide 42 - Diapositive

Cet élément n'a pas d'instructions

Samenvatting

Slide 43 - Diapositive

Cet élément n'a pas d'instructions

Wat hebben we gezien en geleerd?

Slide 44 - Carte mentale

Cet élément n'a pas d'instructions