Testare una funzionalità prima che esista
Importare immagini dal proprio strumento di design e preparare il test mentre la funzionalità è ancora in costruzione.
Perché testare prima che esista
Sviluppo guidato dai test a partire dal vostro design, in Figma o in qualsiasi altro strumento: il test esiste prima della funzionalità.Le immagini che i vostri designer hanno già realizzato mostrano come deve apparire la schermata, e a un controllo serve solo un'immagine di ciò che deve aspettarsi.
Il test è così pronto il giorno in cui la funzionalità viene realizzata.La sua prima esecuzione dice al team, elemento per elemento, se ciò che è stato realizzato corrisponde a ciò che è stato progettato.
L'idea in quattro passaggi
Esportare
Pulsanti, icone e schermate dal vostro strumento di design, come immagini
Importare
Nei Contenuti del test
Comporre
Disponetele sulla traccia Riferimento visivo
Controllare
Aggiungete un controllo per ogni elemento che conta
Importare le immagini del design
Esportate gli elementi da qualsiasi strumento di design, come Figma, Sketch, Adobe XD o Photoshop, come immagini PNG: una schermata intera, o singoli elementi come un pulsante, un'icona o un logo.Esportateli alla dimensione che avranno sullo schermo.
- 1
Fare clic su Importa media
Nella barra degli strumenti di GUI Test Studio, oppure File, Importa media.Scegliete le vostre immagini: compaiono sotto Immagini nei Contenuti.
- 2
Dare loro nomi chiari
Fate clic con il pulsante destro su un'immagine e scegliete Rinomina..., oppure premete F2: “Pulsante Pagamento”, “Icona carrello”.I nomi viaggiano con il test.
Costruire la schermata sul Riferimento visivo
La traccia Riferimento visivo è ciò che vedete nell'anteprima in ogni momento.Di solito contiene una registrazione, ma contiene altrettanto bene delle immagini.Trascinatevi sopra un'immagine dai Contenuti: diventa una clip che potete spostare e allungare, come una diapositiva in una presentazione.
Collocate più immagini una dopo l'altra per raccontare la storia della futura funzionalità come un collage: la schermata dell'elenco, poi la finestra di dialogo che si apre, poi la conferma.
Aggiungere i controlli
- 1
Trascinare un controllo nel momento della sua immagine
Dalla tavolozza Asserzioni sulla traccia Asserzioni, sotto l'immagine a cui appartiene.
- 2
Mostrargli cosa cercare
Aprite l'editor del controllo.Il fotogramma che mostra è la vostra immagine del design: disegnate un rettangolo attorno all'elemento per un'asserzione visiva, oppure selezionate le parole per un'asserzione testuale.Nell'Editor dell'obiettivo visivo potete anche trascinare l'immagine di un singolo elemento direttamente dai Contenuti sull'area di disegno.
- 3
Aggiungere le azioni tra un controllo e l'altro
Trascinate clic e digitazione dalla tavolozza Eventi, oppure registrateli più tardi, quando la schermata esisterà, con Registra nuovo scenario.
Il designer condivide l'immagine del nuovo pulsante Esporta e del messaggio “Esportazione completata”.Importate entrambe, le mettete sul Riferimento visivo e aggiungete un'asserzione visiva sul pulsante e un'asserzione testuale sul messaggio.Il test attende nel repository.Il giorno in cui uno sviluppatore, o un agente di programmazione basato su IA, termina la funzionalità, la pipeline lo esegue e segnala se il pulsante appare come progettato.
Quando la funzionalità è stata realizzata
| Cosa mostra la prima esecuzione | Cosa fare |
|---|---|
| Tutto viene superato | La funzionalità corrisponde al suo design.Ora il test la protegge dalle regressioni. |
| Un elemento appare diverso | Uno scarto reale tra design e realizzazione.Create una segnalazione di bug, oppure accettate il nuovo aspetto se il design è cambiato strada facendo. |
| Un elemento non viene trovato | Controllate la sua dimensione: un'immagine del design esportata a una scala diversa da quella dello schermo non viene trovata.Accettate la zona più simile che il report propone, oppure catturate di nuovo l'elemento dallo schermo reale. |
Test preparato dal design
Funzionalità realizzata
Prima esecuzione
Accettare l'aspetto reale
Una volta
Ancora bloccati?Diteci cosa stavate cercando di fare e rispondiamo entro un giorno lavorativo.Ask our team