Tutto ciò che serve a chi sviluppa per riprodurre un bug è sullo schermo mentre il bug accade: la pagina, la console, le richieste, il browser in cui si trova. Dieci secondi dopo la scheda è chiusa e di tutto questo non resta niente, ed è per questo che le segnalazioni finiscono per essere frasi scritte a memoria.

Ecco come catturare invece l’insieme, con l’estensione che costruiamo. La prima volta richiede circa un minuto, poi qualche secondo. Per inviare una segnalazione non serve alcun account.

Installarla

Session Replay

Estensione gratuita per Chrome. Un clic sulla pagina che si comporta male cattura lo screenshot, la console e il registro di rete, e ti restituisce un link da incollare nel ticket.

Installa l'estensione

Chrome e browser Chromium, dal Web Store. Dopo non c’è niente da configurare.

Catturare il bug

Vada sulla pagina che si comporta male, poi faccia clic sull’icona dell’estensione nella barra degli strumenti.

Il pannello dell'estensione aperto nella stessa finestra della pagina segnalata: la pagina mantiene il suo posto a sinistra e il pannello sta alla sua destra, con lo screenshot e i comandi di registrazione.

Scelga uno screenshot o una registrazione. Uno screenshot va bene per tutto ciò che si vede in una volta sola: un layout rotto, un totale sbagliato, un messaggio di errore. Una registrazione va bene per tutto ciò che ha dentro una sequenza o un tempo: il pulsante che funziona al secondo clic, la rotellina che non si ferma mai. La registrazione si ferma a dieci minuti e conserva tutto fino a quel punto, così una registrazione lunga non va mai persa per un limite di cui nessuno aveva parlato.

Disegni sullo screenshot se aiuta. A mano libera, nel colore che sceglie. Un cerchio intorno al numero sbagliato risparmia un intero paragrafo per dire quale numero è sbagliato.

Aggiunga una descrizione se ce l’ha. Facoltativa, e vale i quindici secondi: che cosa si aspettava. È l’unica cosa che la cattura non può sapere.

Che cosa viene catturato senza che lei faccia niente

Questa è la parte che rende la segnalazione degna di essere letta, e niente di tutto ciò chiede di aprire gli strumenti per sviluppatori:

  • Browser, versione, sistema operativo e dimensione dello schermo, che decidono se un difetto è di tutti o solo suo
  • L’output della console, compreso l’errore stampato mentre nessuno guardava
  • Il registro di rete, con lo stato e i tempi di ogni richiesta fatta dalla pagina, e un file HAR che può scaricare e aprire negli strumenti per sviluppatori
  • Che cosa ha fatto lei: i clic, i campi compilati e i cambi di pagina che hanno portato fin lì, in ordine, ed è questo che trasforma una segnalazione in passi per riprodurla

C’è una cosa da attivare di proposito. Spunti la casella dei corpi delle risposte prima di registrare e l’estensione collega il debugger di Chrome, così la segnalazione porta con sé ciò che il server ha davvero restituito e non solo la riga della richiesta. È disattivata a meno che non la attivi lei, e Chrome mostra un proprio avviso per tutto il tempo in cui è collegato.

Condividerla

Riceve un link. Lo incolli dove vive il lavoro: il ticket, la pull request, la conversazione in chat. Chi lo apre vede la cattura e ogni scheda di contesto accanto, senza account e senza installare niente.

Il link apre la cattura con la console, il registro di rete e i dettagli del browser su schede accanto.

Un link di condivisione è pubblico per impostazione predefinita. È questo che lo rende facile da mandare, e vale la pena saperlo prima di catturare una pagina con i dati personali di qualcuno o un sistema interno. Se il dominio è suo ed è su un piano a pagamento può cambiarlo: le segnalazioni possono nascere private, visibili solo a chi le ha inviate e al suo team, e qualsiasi segnalazione può essere spostata nei due sensi in seguito.

Crei un account gratuito se vuole che le sue segnalazioni restino in un unico posto senza limite giornaliero, e vedere quando sono state aperte. Inviarne una non lo richiede mai.

La parte che lo strumento non fa

Una cattura è una prova. Non è una segnalazione.

Non sa che cosa si aspettava lei, né se le due stranezze che ha notato sono un difetto o due, né quanto conta questo rispetto a tutto il resto che è in coda. Quello è giudizio, e resta alla persona che era lì, ed è proprio per questo che la casella della descrizione vale i quindici secondi anche se tutto il resto è automatico.

Se vuole la forma di una segnalazione che viene corretta invece che rimandata indietro con delle domande, ce l’ha la guida alla segnalazione di bug, e il suo modello è un file che può tenere accanto al suo tracker. I dieci errori più comuni sono la stessa lista vista dall’altro lato.

La versione breve

Installare una volta. Sulla pagina che si comporta male, fare clic sull’icona, scegliere uno screenshot o una registrazione, dire che cosa si aspettava, mandare il link. I dettagli del browser, la console, il registro di rete e la sequenza di quello che ha fatto partono con esso, e l’unica parte che le resta è il giudizio, che è sempre stato suo.