End-to-end tests Searchbar
Als gebruiker
Wil ik zo min mogelijk errors en bugs tegenkomen bij het gebruik van de zoekbalk
Zodat ik de juiste informatie getoond krijg en goed mijn werk kan doen
End-to-end stories
Design system:
- Als je met het toetsenbord op tab drukt dan moet op een gegeven moment de zoekbalk gefocust worden.
- Als je begint met typen dan wordt die tekst ingevoerd in het zoekveld van de zoekbalk.
- Als je een nieuw zoekresultaat wilt invullen kan je dan doen door 2x shift+tab in te drukken
- Als je op tab drukt dan moet de focus worden weerlegd naar het kruisje
- Als je op shift + tab drukt dan gaat de focus weer terug naar het invoerveld van de zoekbalk
- Als je de focus op de zoekbalk wilt weerleggen met het toetsenbord naar het volgende component dan kan dat door nogmaals op tab te drukken.
- Als je met de muis het vergrootglas aanklikt, dan moet de zoekbalk gefocust worden.
- Als je met de muis op de zoekbalk klikt, dan moet deze gefocusd worden.
- Als je met de muis het kruisje aanklikt, dan moet de zoekbalk gefocust worden.
Zoekbalk:
Via het gebruik van de API
- De API geeft een aantal verwachte resultaten terug wanneer er gezocht wordt op bijvoorbeeld "Utrecht"
fixture
Met gebruik van een - Als je op de zoekbalk klikt dan kan je een zoekopdracht invullen.
- Als je een zoekopdracht hebt ingevuld en er bestaan zoekresultaten, dan moeten er op desktop 8 of minder resultaten onder de zoekbalk verschijnen.
- De hoogte van de resultaten moet meeschalen met het aantal resultaten. Dus geen scrollbar
- Als je een zoekopdracht heb ingevuld die geen resultaten heeft, dan moet onder de zoekbalk een tekst worden getoond dat er geen resultaten gevonden zijn.
- Als je resultaten ophaalt, dan moeten de bijbehorende tags, bijv "gemeente, provincie en woonplaats" voor de zoekresultaten komen te staan.
- De resultaten moeten navigeerbaar en selecteerbaar zijn mbv het toetsenbord
- Als je een zoekresultaat geselecteerd hebt dan moet het zoekresultaat worden geselecteerd, vervolgens moeten de zoekresultaten onder zoekbalk verdwijnen.
- Als je op enter druk als het kruisje is gefocust dan word de zoekopdracht verwijderd.
- Als je een nieuwe zoekopdracht wilt intypen kan je weer op de zoekbalk klikken of er naar toe navigeren via het toetsenbord.
Edited by Ruben