Migrando da biblioteca de testes Enzyme para React

Notícias da página inicial do InfoQ Migrando da biblioteca de testes Enzyme para React - Estudo de caso Sentry

02 de março de 2023 3 min de leitura

por

Bruno Couriol

A equipe de engenharia do Sentry relatou recentemente em seu blog os drivers e lições aprendidas com a migração de seus testes front-end do Enzyme para a React Testing Library. A migração foi desencadeada pela falta de suporte da Enzyme para versões mais recentes do React. A migração durou cerca de 20 meses e envolveu 17 engenheiros revisando cerca de 5.000 testes.

Os engenheiros da Sentry decidiram várias vezes não migrar sua base de testes para a React Testing Library (RTL) por falta de benefícios substanciais o suficiente. A equipe lembrou:

Não jogamos coisas apenas porque são novas. Avaliamos cuidadosamente as novas tecnologias para entender quais benefícios elas trazem para nossa equipe. RTL era conhecido por nós naquela época, mas não tínhamos argumentos fortes sobre por que deveríamos trazê-lo para nossa base de código. Enzyme, a biblioteca que usamos para testar nossa biblioteca de componentes, ainda atendia às nossas necessidades.

Por um lado, a Sentry já estava envolvida em uma grande migração para TypeScript, o que, junto com o trabalho regular do produto, mantinha a equipe de engenharia ocupada.

Por outro lado, os testes de enzimas muitas vezes demoravam muito e a equipe tinha um grande interesse em melhorar a velocidade dos testes.

(Fonte: blog de engenharia do Sentry)

Uma prova de conceito mostrou uma melhoria de desempenho de 12%, o que foi considerado insuficiente para embarcar em mais um longo projeto de migração. A prova de conceito, no entanto, provou que o RTL tinha vantagens observáveis ​​sobre o Enzyme. Conforme relata a equipe, o Enzyme não testou a acessibilidade, não limpou automaticamente o ambiente de teste e muitas vezes acessou diretamente o componente no estado do teste. Por outro lado, o RTL está mais próximo dos testes de integração e se esforça para testar casos de uso de aplicativos da perspectiva do usuário. Em particular, a RTL se esforça para evitar testar detalhes de implementação. Mudanças na implementação só deveriam interromper um teste se realmente introduzissem um bug.

A análise de compensação mudou depois que o Sentry migrou para o TypeScript e começou a atualizar para o React 17 (que inclui React Hooks). A equipe lembra:

A migração [RTL] ainda não recebeu muita atenção até trabalharmos na atualização do React para a versão 17. A equipe principal do React reescreveu completamente os componentes internos da biblioteca e a Enzyme usou diretamente uma série de funcionalidades internas do React. funcionou 100% com essa nova versão do React, mas havia um adaptador no mercado que contornava esse problema e foi isso que usamos. No entanto, esta solução não funcionaria no longo prazo, pois o React 18 exigiria uma reescrita completa, o que era improvável de acontecer, visto que o Airbnb havia abandonado o suporte ao Enzyme.[…] RTL não depende dos componentes internos do React. e continuaria a funcionar da mesma forma com o React 18 e com o 16 e 17.

Assim que a luz verde foi dada, o foco mudou para minimizar os riscos do projeto de migração (estimativas de engenharia sob várias hipóteses, abordagem iterativa versus migração big bang, acompanhamento do progresso, treinamento RTL, surgimento de melhores práticas, revisões diárias de código e muito mais ).

A migração foi concluída após 18 meses (contra uma estimativa de 14 meses). Isso permitiu que a equipe removesse testes obsoletos, melhorasse a acessibilidade – um aspecto anteriormente negligenciado e escrevesse testes baseados em casos de uso em vez de detalhes de implementação.

A equipe detalhou problemas inesperados de desempenho encontrados ao seguir algumas recomendações RTL à risca (por exemplo, além de zombar de APIs da web, zombar do usuário da forma mais realista possível). Apesar de não ver melhorias dramáticas no desempenho do teste (o principal ponto problemático que despertou o interesse pela prova de conceito inicial), a equipe concluiu positivamente: