GUI Testing Tutorial: A Complete User Interface (UI) Testing Guide

gui testing tutorial

En komplett guide til GUI-testing: Veiledning i testing av brukergrensesnitt

Hva er GUI-testing?

GUI Testing er en prosess for å teste applikasjonens grafiske brukergrensesnitt for å sikre riktig funksjonalitet i henhold til spesifikasjonene. Det innebærer å sjekke applikasjonskomponentene som knapper, ikoner, avkrysningsbokser, farge, meny, vinduer etc.

hvorfor fungerer ikke solfilmer

Visuell dynamikk i et webapplikasjon spiller en sentral rolle i aksept av et program med brukeren.

Følgelig gir denne aksepten en langvarig bondage av kunder med kundens applikasjon. I denne tiden av digitalisering endrer brukergrensesnittet seg raskt og har en viktig festning for å tiltrekke seg den nye mengden mulige kunder.

Hva du vil lære:

• Testing av brukergrensesnitt
• Tilnærming for UI-testing
• Vanlige brukergrensesnittfeil
• Viktige krav til brukergrensesnitt og brukervennlighet
• Noen grunnleggende komponenter
• Noen avanserte komponenter
• Tilstander av UI-komponenter
• GUI-testverktøy
• Eksempel på GUI-testtilfeller
• Konklusjon
• Anbefalt lesing

Testing av brukergrensesnitt

For å sikre at den visuelle estetikken til webapplikasjonen blir godtatt, blir UI og brukervennlighetstesting et sentralt aspekt av den generelle kvalitetssikringspraksisen. Alle applikasjoner som er tilgjengelige via en URL er et nettbasert program. I slike applikasjoner tester vi hovedsakelig frontenden av applikasjonen som skal brukes av sluttbrukeren.

Hver nettleser viser websider på en annen måte, så det er viktig at siden ser lik ut i forskjellige nettlesere. Hvis en webside vises forvrengt og ikke-administrert, vil den føre seerne til å gå ut av websiden. Så et nettsted bør gjennomgå UI-testing for bedre resultater.

Nettlesertesting består av under to typer:

Funksjonstesting

Testing av forskjellige funksjoner gjennom hele applikasjonen. Det innebærer å validere alle navigasjoner så vel som alle feltverdier som er tilstede på forsiden ved å bruke alle positive så vel som negative scenarier.

UI-testing

Testing av utseendet på websiden. Utseendefaktor inkluderer skjermtype, skrift, justering, alternativknapp, avkrysningsrute etc.

• Områder som dekkes av UI-testing er brukervennlighet, utseende og følelse, navigasjonskontroller / navigasjonsfelt, instruksjoner og teknisk informasjonsstil, bilder, tabeller, tilgjengelighet osv.
• For å teste tilgjengeligheten, må vi sjekke med W3C-retningslinjer for tilgjengelighetsinnhold.

Klikk her for å få W3C-retningslinjen.

Tilnærming for UI-testing

Vi velger en delmengde av testsaker fra funksjonstestsaker som dekker alle funksjonene i applikasjonen.

Det andre trinnet er å endre disse testtilfellene i henhold til UI-testkravene.

Neste trinn vil være å utføre disse testtilfellene; sammenligne resultatet med forventede resultater, og hvis det er noen forskjell, så løft problemet for det samme. Det er ikke mulig å teste i alle nettlesere. Normalt bestemmer klienten i hvilken nettleser det er kravet om å teste.

Som vi kjenner til, viser hver nettleser nettsiden annerledes, så vi kan ikke forvente at alle nettlesere viser nettsider nøyaktig like.

For eksempel, rullegardinmenyen i Windows-Firefox vil være annerledes enn Mac-Firefox. Slike problemer er akseptable, ettersom dette er operativsystemverktøy, og vi må godta dem som sådan.

Basenettleser: Normalt er applikasjoner utviklet rettet mot en nettleser som forventes å brukes mest av sluttbrukere, den kalles basenettleseren.

Vanlige brukergrensesnittfeil

• Problemer med justering av knapper
• Inkonsekvent mellomrom mellom etiketter eller tekstbokser
• Ødelagte etiketter, dvs. etikett på en linje, vises i to linjer
• Misjustering mellom tekstbokser, info-ikoner, etiketter eller rullegardin
• Overlapping av felt
• Ufullstendige felt
• Data på siden er feiljustert; noe tidsforskyvet oppover eller nedover
• I en hvilken som helst nettleser skjer ikke den tilsvarende handlingen mens du velger noen handlinger
• Endring av størrelse fungerer ikke som forventet
• Øktens utløpstid er veldig kort eller veldig lang for noen nettlesere
• Nettleserspesifikke problemer - Få felt kan ikke redigeres etter at du har lagt inn data i en nettleser, men kan redigeres i en annen nettleser

Viktige krav til brukergrensesnitt og brukervennlighet

De viktigste kravene til UI-testing i webapplikasjonen er:

1. Tilgjengelighet av forskjellige komponenter i et brukergrensesnitt
2. Ulike tilstander i UI-komponenten

Komponent:

En komponent er en byggestein, som kan brukes med en kombinasjon av flere andre komponenter for å danne en applikasjon. Komponentene kan brukes på nytt i hele applikasjonen.

Eksempler på en komponent inkluderer Button, Text Field, Autosuggest, Checkbox, Dropdown etc.

Noen grunnleggende komponenter

Avkrysningsrute: Ett eller flere alternativer kan velges fra avkrysningsboksen

Radioknapper: Når bare ett alternativ må velges, er radioknapper nyttige

Noen avanserte komponenter

1. Trekkspill: Flere elementer kan stables vertikalt ved hjelp av denne komponenten. Hvert element kan utvides for å vise innholdet i det. Mer enn ett element kan også utvides.

2. Brødsmuler: Dette er en veldig nyttig komponent som hjelper til med navigering på nettstedet. Brukeren kan identifisere sin nåværende plassering på nettstedet fra denne komponenten.

3. Karusell: Flere sett med informasjonselementer kan innlemmes i en karusellkomponent. Måtsøkere nederst indikerer at flere gjenstander er til stede. Pilene hjelper til med navigering i karusellen. Vanligvis er karusellnavigasjon konfigurert som en kontinuerlig sløyfe.

Klikk her for å få mer nyttig informasjon om UI-komponenter

Tilstander av UI-komponenter

Tilgjengeligheten av komponenter er utelukkende basert på retningslinjene for prosjektkrav. Det vil variere fra ett prosjekt til et annet.

De forskjellige brukergrensesnittstatene for en grunnleggende komponent er:

1. Ufylt stat
2. Filled State and On Focus
3. Normalstatus og standardtilstand
4. Hover State
5. Ufør tilstand
6. Maskerte stat

Ufylt stat:

Før du taster inn noen verdi i en komponent, sies det å være en ufylt tilstand. Ufylt tilstand viser plassholderteksten hvis noen. Nedenfor er en tekstfeltkomponent.

Fylt tilstand:

En komponent med en verdi tastet inn av brukeren er fylt tilstand.

På fokusstatus:

Brukeren besøker en komponent som allerede er fylt ut. Komponenten skal vise markøren, noe som indikerer at den spesifikke komponenten er i fokus

Normal tilstand:

Visningen av en komponent med verdien som allerede er angitt av brukeren på skjermen, er beskrevet i normal tilstand.

Standardstatus:

En komponent som viser automatisk fylt verdi fra serveren / backend. Denne verdien kan også redigeres av brukeren i noen scenarier.

Hover State:

Mus svever over komponenten fremhever komponenten som indikerer sveverhandlingen.

Før sveve:

På svev:

hva er den beste programvaren for fjerning av virus

Deaktivert tilstand:

Komponenten er deaktivert, og brukeren kan ikke redigere feltene.

Aktivert stat

Ufør tilstand

Maskerte tilstand:

Følsomme data som passordet kan skjules ved hjelp av denne komponenten.

De viktigste testkravene for brukbarhet i nettapplikasjonen er:

1. Fontfamilie
2. Skriftstørrelse
3. Farge
4. Avstand mellom bokstavene
5. Linjehøyde
6. Bakgrunnsvalidering
7. Fyll / opasitet
8. Målinger av komponentene som lengde, bredde og bredde
9. Plassering / avstand mellom komponentene i en skjerm

Ovennevnte funksjoner for brukbarhet kan testes i koden eller ved hjelp av inspeksjonselementet i applikasjonen. En annen enklere måte er å bruke tillegg. Tilleggene kan variere avhengig av hvilken nettleser applikasjonen skal testes i.

Detaljer om forskjellige nettlesertillegg

Fordeler med tillegg:

• Sparer tid
• Lett å bruke
• Det er kostnadseffektivt

Begrensning av tillegg:

• Parallaks feil mens du bruker måling
• Kompatibel på tvers av applikasjoner
• Kompatibel med flere nettlesere

Referanser for tillegg:

• Webinspektør: Apple Dev Tools
• Firebug: Firebug Wiki
• Mål IT
• Colorzilla

GUI-testverktøy

Flere verktøy er tilgjengelige i teknologiverden som kan hjelpe testere i UI-testing.

• Selen
• HP Unified Functional Testing
• Agurk
• Kodet brukergrensesnitt
• Faktisk

En detaljert liste over GUI-verktøy er tilgjengelig på softwaretestinghelp.com selv! Vennligst klikk her .

Eksempel på GUI-testtilfeller

1) Kontroller at karusellpiler og veisøkere fungerer
to) Kontroller at passordfeltet kun godtar verdier i maskert tilstand
3) Kontroller at lagre-knappen forblir inaktiv til alle obligatoriske felt er angitt
4) Bekreft at brukeren har lov til å navigere til toppen av siden ved hjelp av 'Topp' -linjen
5) Kontroller at riktig melding vises når de anvendte filtrene ikke henter noen resultater
6) Bekreft navigeringen fra koblinger som er tilgjengelige i topp- og bunntekst
7) Kontroller at justeringen av radioknappene er nøyaktig
8) Bekreft at flere valg i avmerkingsboksene kan velges om gangen
9) Kontroller at tittelen på hver seksjon er i fet skrift
10) Bekreft fargeendring av hyperkoblinger ved å klikke

Konklusjon

Et nettsted er sjelen til mange bedrifter. Det er veldig nødvendig å sørge for at det ser bra ut og fungerer på samme måte på forskjellige nettlesere og plattformer. Dermed er UI-testing veldig viktig, og det vil sikre en stor kundebase og tillegg i forretningsverdien.

Anbefalt lesing

• Beste verktøy for testing av programvare 2021 (QA Test Automation Tools)
• Alpha Testing og Beta Testing (En komplett guide)
• Testing Primer eBook Download
• Funksjonstesting mot ikke-funksjonell testing
• Build Verification Testing (BVT Testing) Komplett guide
• Hva er grensesnitttesting? Kjenn til typene, strategien og verktøyene
• QA Outsourcing Guide: Software Testing Outsourcing Companies
• Typer programvaretesting: Ulike testtyper med detaljer