Nossas abstrações para lidar com JS estão quebradas

Eu não quero entrar no mérito aqui sobre o que é melhor ou pior, mas em uma perspectiva pura simples e olhando para testes, nós estamos quebrados e nem dá p/ saber por onde começar a consertar.

Quero começar por uma declaração simples e comum de quem pratica TDD de forma purista.

Se está dificil de testar é sinal de uma arquitetura problemática

O que mais vejo, não importa se for em React, Svelte e até Angular, são soluções dificies de testar.

Engraçado que quando reflito um pouco, dado alguns conceitos como separação de responsalidade já conseguiriamos uma certa vantagem na parte de testar JS. Quando separo arquivos de services até fica um pouco simples, mas isso vai completamente fora para o caso de components.

React é algo lindo quando se trata dessa abastração, mas as ferramentas envolta, nunca me garante um determinismos nos testes, a forma que Jest lida com stubs e força um uso exagerado de mocks é assustador.  Isso porque não estou falando exatamente de todo setup para garantir a compilação do JS sendo algo compartilhado com o Svelte. Ambos dificieis de testar e/ou os testes levando para escrever coisas se surge o texto da forma correta.

Quero trazer um exercicio simples, talvez um arquivo jQuery fosse mais facil testar do que as ferramentas que temos hoje. Você teria um stub de no $ e bastava escrever o que esperar quais funções o cifrão chamou.

Partindo dessa ideia de chamo uma função e escrevo os expectsque podem ser funções chamadas ao longo da execução ou o output dela. Se falamos de um script JS é sempre algo fácilmente testado, outputs claros, sejam ele salterações no HTML, chamadas de serviços externos ou funções do objeto window.

Mas se tratando de um component, qual deveriam ser nossos expects, se o nosso component escrito em JSX vai chamar funções de React.createElement, nossos testes deveriam verificar se o createElement está sendo chamado com a string do tag que deve ser gerada e as suas devidas propriedades. Porém fomos para um caminho ao contrario. Temos dependencias demais em components que tornam dificil testar os components e verificar seus outputs e esses components não são facilmente testaveis por conta da abstração de módulos que antes eram isoladas e agora estão acopladas.

Talvez pensar em TDD para Front-end seja meu erro e a abstração tenha que ser diferente.