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.

  • ๐Ÿ–ฅ๏ธ Anvendelsesomrรฅde: Valider stรธrrelse, placering, justering, skrifttyper, farver, fejlmeddelelser og billeder for alle kontrolelementer, en bruger kan se eller klikke pรฅ.
  • ๐ŸŽฏ Forretningsscenarie: Brugere bedรธmmer fรธrst en applikation pรฅ dens brugerflade, sรฅ en forvirrende eller รธdelagt skรฆrm koster vedtagelse, selv nรฅr logikken bagved er fejlfri.
  • ๐Ÿงฉ Fem typer: Funktionalitets-, brugervenligheds-, kompatibilitets-, tilgรฆngeligheds- og visuel ydeevnetjek besvarer hver isรฆr et forskelligt spรธrgsmรฅl om den samme skรฆrm.
  • ๐Ÿ” Tjekliste fรธrst: Byg en genanvendelig GUI-tjekliste, der dรฆkker elementgeometri, lรฆsbarhed, oplรธsningsadfรฆrd, stavning, scrollbarer og deaktiverede felter.
  • ๐Ÿ‡ง๐Ÿ‡ท Tre teknikker: Manuel inspektion, optagelse og afspilning og modelbaseret generering, der forudsiger uรธnskede tilstande, som et script aldrig ville nรฅ.
  • ๐Ÿค– Automatiser gentagelse: Scriptstabile, hรธjfrekvente regressionsstier og reserver menneskelige testere til udforskende og erfaringsmรฆssig vurdering.
  • ๐Ÿ›ก๏ธ Vedligeholdelse af snit: Brug stabile lokatorer, adskil testdata fra testtrin og skรฆrmbilleder af versioner, sรฅ mindre layoutredigeringer ikke รธdelรฆgger alle scripts.

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

  1. Test af stรธrrelse, position, bredde, hรธjde af elementerne.
  2. Test af de fejlmeddelelser, der bliver vist.
  3. Test af de forskellige sektioner af skรฆrmen.
  4. Test af skrifttypen om den er lรฆsbar eller ej.
  5. Test af skรฆrmen i forskellige oplรธsninger ved hjรฆlp af zoom ind og ud som 640 x 480, 600ร—800 osv.
  6. Afprรธvning af justeringen af โ€‹โ€‹tekster og andre elementer som ikoner, knapper osv. er pรฅ korrekt plads eller ej.
  7. Test af farverne pรฅ skrifttyperne.
  8. Test af farverne pรฅ fejlmeddelelserne, advarselsmeddelelser.
  9. Tester om billedet har god klarhed eller ej.
  10. Test af justeringen af โ€‹โ€‹billederne.
  11. Test af stavemรฅden.
  12. Brugeren mรฅ ikke blive frustreret, mens han bruger systemgrรฆnsefladen.
  13. Test af om grรฆnsefladen er pรฅtractiv eller ej.
  14. Test af rullepanelerne i henhold til stรธrrelsen pรฅ siden, hvis nogen.
  15. Test af de deaktiverede felter, hvis nogen.
  16. Test af billedernes stรธrrelse.
  17. Test af overskrifterne, om de er korrekt justeret eller ej.
  18. 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 :

  1. Selenium
  2. QTP
  3. Cucumber
  4. SilkeTest
  5. TestComplete
  6. 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.

Ofte Stillede Spรธrgsmรฅl

Ja. Moderne vรฆrktรธjer lรฆser et krav eller scanner en gengivet skรฆrm og udarbejder kandidatcases, der dรฆkker felter, knapper og valideringsmeddelelser. En tester gennemgรฅr dem stadig, fordi AI ikke kan vide, hvilke skรฆrme der indebรฆrer en reel forretningsrisiko.

Selvreparerende motorer gemmer flere attributter pr. element. Nรฅr en locator gรฅr i stykker, matcher vรฆrktรธjet de resterende attributter, reparerer referencen og markerer รฆndringen. Teams, der bruger det pรฅ Selenium Suiterne rapporterer langt fรฆrre falske fejl efter kosmetiske redesigns.

GUI-testning spรธrger, om brugerfladen er korrekt: justering, etiketter, farver og kontroller, der fungerer som angivet. Brugervenlighedstestning spรธrger, om brugerfladen er brugervenlig, og mรฅler, hvor hurtigt en rigtig person afslutter en opgave. Brugervenlighedstestning er รฉn type GUI-testning.

GUI-testning er en sort boks. Testeren arbejder kun ud fra den synlige grรฆnseflade og kravene, uden at lรฆse kildekoden. Den kรธrer normalt under systemtestning, efter at enheds- og integrationstjek allerede har valideret logikken nedenunder.

Kรธr et kort sรฆt kritiske screeninger pรฅ hver build og hele suiten hver aften eller fรธr hver udgivelse. Vรฆrktรธjer som f.eks. UFT Planlรฆg uovervรฅgede kรธrsler, sรฅ natlig udfรธrelse nรฆsten ikke koster testtid.

Opsummer dette indlรฆg med: