Migrazione dalla libreria di test Enzyme alla React Testing

InfoQ Homepage Notizie Migrazione dalla libreria di test enzimatici alla libreria di test React - Case study Sentry

02 marzo 2023 3 minuti di lettura

di

Bruno Couriol

Il team di ingegneri di Sentry ha recentemente raccontato sul suo blog i driver e le lezioni apprese dalla migrazione dei test front-end da Enzyme alla React Testing Library. La migrazione è stata innescata dalla mancanza di supporto da parte di Enzyme per le versioni più recenti di React. La migrazione è durata circa 20 mesi e ha coinvolto 17 ingegneri che hanno esaminato circa 5.000 test.

Gli ingegneri di Sentry hanno deciso più volte di non migrare la propria base di test alla React Testing Library (RTL) per mancanza di vantaggi sufficientemente sostanziali. La squadra ha ricordato:

Non buttiamo dentro le cose solo perché sono nuove. Valutiamo attentamente le nuove tecnologie per capire quali vantaggi apportano al nostro team. RTL ci era noto già allora, ma non avevamo forti argomenti sul perché dovessimo includerlo nel nostro codice base. Enzyme, la libreria che abbiamo utilizzato per testare la nostra libreria di componenti, stava ancora soddisfacendo le nostre esigenze.

Da un lato, Sentry era già impegnato in una vasta migrazione a TypeScript che, insieme al regolare lavoro sul prodotto, teneva occupato il team di ingegneri.

D'altra parte, i test sugli enzimi spesso richiedevano molto tempo e il team aveva un forte interesse a migliorare la velocità dei test.

(Fonte: blog di ingegneria di Sentry)

Una prova di concetto ha mostrato un miglioramento delle prestazioni del 12%, ritenuto insufficiente per intraprendere un altro lungo progetto di migrazione. La prova di concetto ha tuttavia dimostrato che RTL presentava vantaggi osservabili rispetto a Enzyme. Come riportato dal team, Enzyme non ha eseguito test di accessibilità, non ha ripulito automaticamente l'ambiente di test e spesso ha effettuato l'accesso diretto al componente nello stato del test. Al contrario, RTL è più vicina ai test di integrazione e si sforza di testare i casi d'uso delle applicazioni dal punto di vista dell'utente. In particolare, RTL si sforza di evitare di testare i dettagli di implementazione. Le modifiche all'implementazione dovrebbero interrompere un test solo se hanno effettivamente introdotto un bug.

L'analisi del compromesso è cambiata dopo che Sentry è migrato su TypeScript e ha iniziato l'aggiornamento a React 17 (che include React Hooks). La squadra ricorda:

La migrazione [RTL] non ha ancora ricevuto molta attenzione finché non abbiamo lavorato sull'aggiornamento di React alla versione 17. Il team principale di React aveva completamente riscritto gli interni della libreria ed Enzyme ha utilizzato direttamente una serie di funzionalità interne di React.[…] Enzyme no funziona al 100% con questa nuova versione di React, ma sul mercato c'era un adattatore che risolveva questo problema ed è quello che abbiamo usato. Tuttavia, questa soluzione non funzionerebbe a lungo termine poiché React 18 richiederebbe una riscrittura completa, cosa improbabile che accada dato che Airbnb aveva abbandonato il supporto per Enzyme.[…] RTL non si basa sui componenti interni di React. e continuerebbe a funzionare allo stesso modo con React 18 come con 16 e 17.

Una volta dato il via libera, l'attenzione si è spostata sulla minimizzazione dei rischi del progetto di migrazione (stime ingegneristiche sotto varie ipotesi, approccio iterativo rispetto alla migrazione big bang, monitoraggio dei progressi, formazione RTL, individuazione delle migliori pratiche, revisioni giornaliere del codice e altro ancora) ).

La migrazione è stata completata dopo 18 mesi (rispetto ai 14 mesi stimati). Ha consentito al team di rimuovere test obsoleti, migliorare l'accessibilità, un aspetto precedentemente trascurato, e scrivere test basati su casi d'uso invece che su dettagli di implementazione.

Il team ha dettagliato i problemi di prestazioni imprevisti riscontrati quando si seguono alla lettera alcune raccomandazioni RTL (ad esempio, oltre a deridere le API web, deridere l'utente quanto più e nel modo più realistico possibile). Nonostante non abbia riscontrato notevoli miglioramenti sul fronte delle prestazioni del test (il principale punto dolente che ha suscitato l'interesse per la prova di concetto iniziale), il team ha concluso positivamente: