GUI-testning: UI-testcases og eksempler
โก Smart opsummering
GUI-testning validerer alle synlige elementer i en applikation โ knapper, menuer, ikoner, tekstbokse og layouts โ sรฅ skรฆrme opfรธrer sig og vises prรฆcis som angivet pรฅ tvรฆrs af browsere, enheder og skรฆrmoplรธsninger, fรธr rigtige brugere overhovedet rรธrer ved dem.

For at forstรฅ GUI-testning, lad os fรธrst forstรฅ, hvad en GUI er.
Hvad er GUI?
Der er to typer grรฆnseflader til en computerapplikation. Kommandolinjegrรฆnsefladen er, hvor du skriver tekst, og computeren reagerer pรฅ denne kommando. GUI stรฅr for Graphical User Interface, hvor du interagerer med computeren ved hjรฆlp af billeder frem for tekst.
Fรธlgende er de GUI-elementer, som kan bruges til interaktion mellem brugeren og applikationen:
GUI-test er en validering af ovenstรฅende elementer.
Hvad er GUI-testning?
GUI test er en softwaretesttype, der kontrollerer softwarens grafiske brugergrรฆnseflade. Formรฅlet med test af grafisk brugergrรฆnseflade (GUI) er at sikre, at softwareapplikationens funktionalitet fungerer i henhold til specifikationerne ved at kontrollere skรฆrme og kontroller som menuer, knapper, ikoner osv.
GUI er det, brugeren ser. Besรธg guru99.com, og den hjemmeside, der vises, er webstedets GUI. Kildekoden forbliver skjult; kun brugerfladen er synlig. GUI-testning fokuserer derfor pรฅ designstruktur og om billeder gengives korrekt.
I skรฆrmbilledet ovenfor starter GUI-testen med at bekrรฆfte, at hvert billede er fuldt synligt i forskellige browsere. De resterende kontroller pรฅ den samme side er:
- Linkene er tilgรฆngelige, og hver knap fungerer, nรฅr der klikkes pรฅ den.
- รndring af skรฆrmstรธrrelse fรฅr aldrig billeder eller tekst til at krympe, beskรฆres eller overlappe hinanden.
- Intet i layoutet skjules, nรฅr browservinduet gรธres smallere.
๐ก Tip: Kรธr den samme side i 1920ร1080, 1366ร768 og 375ร812, fรธr du logger eventuelle fejl. Mange rapporter om "defekt layout" er simpelthen utestede breakpoints.
Behov for GUI-test
Nu er det grundlรฆggende koncept for GUI-testning klart. De fรฅ spรธrgsmรฅl, der vil melde sig i dit hoved, vil vรฆre:
- Hvorfor testes GUI?
- Er det virkelig nรธdvendigt?
- Er det ikke nok at teste en applikations funktionalitet og logik i sig selv, og hvorfor bruge ekstra tid pรฅ brugerfladen?
For at fรฅ svaret, tรฆnk som en bruger og ikke som en tester. En bruger har ingen viden om, hvordan applikationen er bygget. Det er brugergrรฆnsefladen, der afgรธr, om brugeren fortsรฆtter med applikationen eller opgiver den.
En normal bruger observerer fรธrst applikationens design og udseende, og hvor let det er at forstรฅ brugerfladen. Hvis en bruger ikke er fortrolig med brugerfladen, eller finder applikationen kompleks at forstรฅ, vil vedkommende aldrig komme tilbage. GUI er derfor en kilde til bekymring, og der bรธr udfรธres korrekt test for at sikre, at brugerfladen er fri for fejl.
Typer af GUI-testning
At vide, hvorfor brugerfladen er vigtig, er kun halvdelen af โโbilledet. GUI-testning er en familie af fem typer, og hver besvarer et forskelligt spรธrgsmรฅl om den samme skรฆrm.
- Funktionel GUI-testning: Bekrรฆfter, at hver kontrol gรธr, hvad den lover. Tรฆt forbundet med funktionstest, den spรธrger, om en knap sender, en rullemenu filtrerer, og et felt accepterer gyldigt input.
- Usability test: Mรฅler hvor let en rigtig person udfรธrer en opgave. Test af brugervenlighed ser pรฅ navigationsdybde, lรฆsbarhed og om fejlmeddelelser rent faktisk hjรฆlper.
- Kompatibilitetstest: Gentager de samme skรฆrmbilleder pรฅ tvรฆrs af browsere, operativsystemer og enhedsstรธrrelser. Cross browser test fanger renderingsfejl, der kun optrรฆder i รฉn motor.
- Tilgรฆngelighedstest: Verificerer tastaturnavigation, skรฆrmlรฆseretiketter og farvekontrast i forhold til WCAG. Tilgรฆngelighedstest er nu et compliancekrav pรฅ mange markeder, ikke et valgfrit ekstraudstyr.
- Visuel og ydeevnetest: Sammenligner gengivne skรฆrmbilleder med en basislinje og mรฅler, hvor hurtigt brugerfladen males og reagerer, overlapperping med test af ydeevne.
De fleste teams kรธrer alle fem, men vรฆgter dem forskelligt: โโet offentligt websted lรฆner sig op ad kompatibilitet og tilgรฆngelighed, et internt dashboard pรฅ funktionelle kontroller.
Hvad tjekker du i GUI-testning?
Fรธlgende tjekliste vil sikre detaljeret GUI-test i softwaretest.
- Tjek alle GUI-elementerne for stรธrrelse, position, bredde, lรฆngde og accept af tegn eller tal. For eksempel skal du kunne give input til inputfelterne.
- Tjek, at du kan udfรธre den tilsigtede funktionalitet af applikationen ved hjรฆlp af GUI
- Kontroller, at fejlmeddelelserne vises korrekt
- Tjek for tydelig afgrรฆnsning af forskellige sektioner pรฅ skรฆrmen
- Kontroller, at skrifttypen, der bruges i et program, er lรฆsbar
- Kontroller, at justeringen af โโteksten er korrekt
- Kontroller, at farven pรฅ skrifttypen og advarslerne er รฆstetisk tiltalende
- Tjek, at billederne har god klarhed
- Kontroller, at billederne er korrekt justeret
- Tjek placeringen af โโGUI-elementer for forskellige skรฆrmoplรธsninger.
GUI-testteknikker
Nรฅr tjeklisten er fรฆrdig, er den nรฆste beslutning, hvordan den skal udfรธres. GUI-testteknikker kan kategoriseres i tre dele:
Manuel baseret test
Under denne tilgang kontrolleres grafiske skรฆrme manuelt af testere i overensstemmelse med kravene i forretningskravsdokumentet.
Optag og genafspil
GUI-testning kan udfรธres ved hjรฆlp af automatiseringsvรฆrktรธjer. Dette gรธres i to dele. Under optagelse registreres testtrin af automatiseringsvรฆrktรธjet. Under afspilning udfรธres de optagede testtrin pรฅ den applikation, der testes. Eksempel pรฅ sรฅdanne vรฆrktรธjer โ QTP.
Modelbaseret test
En model er en grafisk beskrivelse af et systems adfรฆrd. Den hjรฆlper os med at forstรฅ og forudsige systemets adfรฆrd. Modeller hjรฆlper med at generere effektive testcases ved hjรฆlp af systemkravene. Diagrammet nedenfor viser, hvordan en model driver testgenerering:
Fรธlgende skal overvejes i forbindelse med denne modelbaserede test:
- Byg modellen
- Bestem input til modellen
- Beregn det forventede output for modellen
- Kรธr testene
- Sammenlign det faktiske output med det forventede output
- En beslutning om yderligere handling pรฅ modellen
Nogle af de modelleringsteknikker, hvorfra testcases kan udledes:
- Diagrammer โ Afbilder et systems tilstand og kontrollerer tilstanden efter noget input.
- Beslutningstabeller โ Tabeller, der bruges til at bestemme resultater for hvert anvendt input
Modelbaseret testning er en udviklende teknik til at generere testcases ud fra kravene. Dens stรธrste fordel sammenlignet med ovenstรฅende to metoder er, at den kan bestemme uรธnskede tilstande, som din GUI kan opnรฅ.
Manuel vs. automatiseret GUI-testning
To af disse tre teknikker er manuelle, og รฉn er automatiseret, hvilket rejser det praktiske spรธrgsmรฅl om, hvor hver isรฆr hรธrer hjemme. Manuel test sรฆtter et menneske foran skรฆrmen, sรฅ det opfanger akavede arbejdsgange, klodset formulering og animationer, der fรธles forkerte โ vurderinger, som intet manuskript kan fรฆlde.
Automatiseret test afspiller de samme interaktioner tusindvis af gange uden trรฆthed, hvilket gรธr det til det rigtige svar til stabile regressionsstier og til at gentage รฉn suite pรฅ tvรฆrs af mange browsere. Ulempen er vedligeholdelse: automatiserede GUI-scripts gรฅr i stykker, nรฅr en locator eller et layout รฆndres. De fleste modne teams kรธrer derfor en hybrid, hvor de automatiserer det gentagelige og reserverer folk til det oplevelsesmรฆssige.
| faktor | Manuel GUI-testning | Automatiseret GUI-testning |
|---|---|---|
| Bedste for | Nye skรฆrme, udforskende kontroller, udseende og funktionalitet | Stabile regressionspakker, kรธrsel pรฅ tvรฆrs af browsere |
| Hastighed pr. cyklus | Langsom, begrรฆnset af testertimer | Hurtig, kรธrer uden opsyn natten over |
| Forudgรฅende omkostninger | Lav | Hรธj (scripting og opsรฆtning af framework) |
| Vedligeholdelse | Intet udover opdatering af tjeklisten | Vรฆsentligt, nรฅr grรฆnsefladen รฆndres |
| Fanger subjektive problemer | Ja | Ingen |
Eksempler pรฅ GUI-testtests
GUI-test involverer dybest set
- Test af stรธrrelse, position, bredde, hรธjde af elementerne.
- Test af de fejlmeddelelser, der bliver vist.
- Test af de forskellige sektioner af skรฆrmen.
- Test af skrifttypen om den er lรฆsbar eller ej.
- Test af skรฆrmen i forskellige oplรธsninger ved hjรฆlp af zoom ind og ud som 640 x 480, 600ร800 osv.
- Afprรธvning af justeringen af โโtekster og andre elementer som ikoner, knapper osv. er pรฅ korrekt plads eller ej.
- Test af farverne pรฅ skrifttyperne.
- Test af farverne pรฅ fejlmeddelelserne, advarselsmeddelelser.
- Tester om billedet har god klarhed eller ej.
- Test af justeringen af โโbillederne.
- Test af stavemรฅden.
- Brugeren mรฅ ikke blive frustreret, mens han bruger systemgrรฆnsefladen.
- Test af om grรฆnsefladen er pรฅtractiv eller ej.
- Test af rullepanelerne i henhold til stรธrrelsen pรฅ siden, hvis nogen.
- Test af de deaktiverede felter, hvis nogen.
- Test af billedernes stรธrrelse.
- Test af overskrifterne, om de er korrekt justeret eller ej.
- Test af farven pรฅ hyperlinket.
Demo: Sรฅdan laver du GUI-test
Ovenstรฅende liste bliver langt tydeligere, nรฅr den anvendes pรฅ en rigtig skรฆrm, sรฅ her vil vi bruge nogle eksempler pรฅ testcases til den fรธlgende dialog.
Nedenfor er et eksempel pรฅ testcases, som bestรฅr af brugergrรฆnseflade- og brugervenlighedstestscenarier. Hvis du ikke har skrevet dem fรธr, kan du se hvordan man skriver testcases fรธrst.
Testtilfรฆlde 01 โ Bekrรฆft at tekstfeltet med etiketten โKildemappeโ er justeret korrekt.
Testtilfรฆlde 02 โ Bekrรฆft at tekstfeltet med etiketten โPakkeโ er justeret korrekt.
Testtilfรฆlde 03 โ Bekrรฆft etiketten med navnet "Gennemseโ er en knap, som er placeret i slutningen af โโTekstBox med navnet "Kildemappe".
Testtilfรฆlde 04 โ Bekrรฆft etiketten med navnet "Gennemseโ er en knap, som er placeret i slutningen af โโTekstBox med navnet "Pakke".
Testtilfรฆlde 05 โ Bekrรฆft at tekstfeltet med etiketten โNavnโ er justeret korrekt.
Testtilfรฆlde 06 โ Kontroller, at etiketten "modifiersโ bestรฅr af 4 radioknapper med navnet offentlig, standard, privat, beskyttet.
Testtilfรฆlde 07 โ Kontroller, at etiketten "modifiersโ bestรฅr af 4 radioknapper, som er justeret korrekt i en rรฆkke.
Testtilfรฆlde 08 โ Kontroller, at etiketten "superklasse" under etiketten "modifiersโ bestรฅr af en dropdown, som skal vรฆre korrekt justeret.
Testtilfรฆlde 09 โ Kontroller, at etiketten "superklasse" bestรฅr af en knap med etiketten "Gennemseโ pรฅ den, som skal vรฆre korrekt justeret.
Testtilfรฆlde 10 โ Bekrรฆft, at standardmusemarkรธren skal รฆndres til en hรฅndmusemarkรธr, nรฅr du klikker pรฅ en hvilken som helst radioknap.
Testtilfรฆlde 11 โ Bekrรฆft, at brugeren ikke mรฅ kunne skrive i rullemenuen "superklasse".
Testtilfรฆlde 12 โ Bekrรฆft, at der skal genereres en korrekt fejl, hvis noget er blevet valgt forkert.
Testtilfรฆlde 13 โ Bekrรฆft at fejlen skal genereres i den RรDE farve, hvor det er nรธdvendigt.
Testtilfรฆlde 14 โ Kontroller, at de korrekte etiketter skal anvendes i fejlmeddelelserne.
Testtilfรฆlde 15 โ Bekrรฆft, at de enkelte alternativknapper skal vรฆlges som standard hver gang.
Testtilfรฆlde 16 โ Kontroller, at TAB-knappen fungerer korrekt under opstart.ping pรฅ et andet felt ved siden af โโdet forrige.
Testtilfรฆlde 17 โ Kontroller, at alle sider indeholder den korrekte titel.
Testtilfรฆlde 18 โ Kontroller, at sideteksten er korrekt justeret.
Testtilfรฆlde 19 โ Bekrรฆft, at der vises en korrekt bekrรฆftelsesmeddelelse efter opdatering af et felt.
Testtilfรฆlde 20 โ Bekrรฆft, at kun รฉn alternativknap skal vรฆlges, og at der kan markeres mere end enkelt afkrydsningsfelter.
Udfordringer i GUI-testning
Det er ligetil at skrive disse sager;ping dem i live over flere udgivelser er ikke. Inden for softwareudvikling er det mest almindelige problem, nรฅr man laver Regressionstest er, at applikationens GUI รฆndres ofte. Det er meget svรฆrt at teste og identificere, om det er et problem eller en forbedring. Problemet manifesterer sig, nรฅr du ikke har nogen dokumenter vedrรธrende GUI-รฆndringer.
โ ๏ธ Advarsel: Scripts, der lokaliserer elementer via skรฆrmkoordinater eller automatisk genererede ID'er, vil mislykkes i den nรฆste build. Betragt en lokaliseringsstrategi som en del af designet, ikke som en eftertanke.
GUI-testvรฆrktรธjer
Det rigtige vรฆrktรธj absorberer en stor del af den omsรฆtning. Fรธlgende er en liste over populรฆre GUI-testvรฆrktรธjer :
- Selenium
- QTP
- Cucumber
- SilkeTest
- TestComplete
- Squish GUI Tester
Klik her for at lรฆre Selenium, QTP & Cucumber.
Fรธlgende er open source-vรฆrktรธjer tilgรฆngelige til at udfรธre automatiseret UI-test.
| Produkt | Licenseret under |
|---|---|
| AutoHotkey | GPL |
| Selenium | Apache |
| Sikuli | MIT |
| Robotramme | Apache |
| Vand | BSD |
| Dojo vรฆrktรธjssรฆt | BSD |
Sikuli er billedbaseret, nyttig nรฅr en kontrol ikke har en pรฅlidelig lokalisator; Selenium forbliver standard for test af webapplikationer.






