Testando aplicações React com Jest & Testing Library - Decode #012

Para quem não conseguiu usar as funções do jest-dom, criando o arquivo setup.ts. Importa a lib (import "@testing-library/jest-dom";) direto no arquivo de teste que funciona

Para quem estiver vendo esse video, se atente a documentação, pois algumas mudaram. Como por exemplo a utilização do userEvent.

Já passei por essa dor, depois de ficar mexendo no código por mais de uma hora, eu descobri que tinha quebrado em outro lugar, e agora pra descobrir em que momento quebrou foi doído rrsrrsrs

Aonde eu posso encontrar a continuação? Não tô conseguindo encontrar... O item seguinte da playlist já é sobre outra coisa

Para quem esta criando o projeto nesse momento, com react 18. Talvez voce precise fazer as seguinte confitgurações:

instalar: npm install -D jest-environment-jsdom
no seu ts config: "moduleResolution": "node" ou "NodeNext",

Valew Diego, conteúdo muito bom.
Seria legal ter um vídeo atualizado de como configurar o Jest para um projeto React-Native com Expo e Typescript... Estou sofrendo bastante com isso e não se acha nada atualizado na internet!

cara, é muita lib/pacote...

Pessoal, foi feito a segunda parte desse video, falando sobre spies e stubs etc?

PARA DE BATER NA PORRA DO TECLADO kkkk

Quem tiver algum erro basta instalar o seguinte pacote:

npm install -D jest-environment-jsdom

Man, how do you test onFocus for text input on RN using RTL?

Qual é essa linguagem utilizada nos testes que já percebi ser a mesma linguagem para testes Angular e React? Isso é Typescript?

Essa live teve continuação?

Ótimo pra programa depois de fuma uns becks kkkkkkkkkkkkkkkkkk

Está com problema no userEvent.
A nova forma de usar é assim:

it("shold be able to add new item to the list", async () => {
const { getByText } = render(<App />);

const addButton = getByText("Adicionar");

await userEvent.setup().click(addButton);

expect(getByText("novo")).toBeInTheDocument();
});

Precisa usar o async e await

0 0

Diego parabéns pelo conteúdo.

Não está funcionando!

Eu configurei aqui o jest baseado na config do video, mas como faço pra fazer o Jest interpretar SVGs ?

Recebi esse erro no console ao executar o test
O ambiente de teste jest-environment-jsdom não pode ser encontrado. Certifique-se de que a opção de configuração testEnvironment aponte para um módulo de nó existente.

Já fez a segunda parte? Se fez não estou achando alguém me da um help ai preciso muito do restante :)

Alguém sabe onde posso encontrar o código do video? :)

Esse video continuando a explicacao saiu ou virou lenda pessoal? hahaha

Aula fantástica!

Muito bom o conteúdo.
Tive algumas dificudades justamente nos temas que ficou para próxima.

Mocking API Calls (msw)
Spies e Stubs
Context (wrapper on render)

Mais deu para aprender e muito com esse vídeo.

Alguém mais ta com problema em fazer testes em projetos novos? no meu terminal ta acusando o erro:
Jest failed to parse a file. This happens e.g. when your code or its dependencies use non-standard JavaScript syntax, or when Jest is not configured to support such syntax.

Out of the box Jest supports Babel, which will be used to transform your files into valid JS based on your Babel configuration.

By default "node_modules" folder is ignored by transformers.

Só deu erros aqui. não consegui usar o "userEvent"

para quem está acompanhando com o video

transform: {
"^.+\\.(t|j)sx?$": [
"@swc/jest",
{
jsc: {
parser: {
syntax: "typescript",
tsx: true,
decorators: true,
},
keepClassNames: true,
transform: {
legacyDecorator: true,
decoratorMetadata: true,
react: {
runtime: "automatic",
},
},
},
module: {
type: "es6",
noInterop: false,
},
},
],
},

Existe uma porcentagem ideal de cobertura de testes pra front end?

notei que os testem estão relacionado apenas a ui, e não ao que acontece por trás? testar front-end é isso mesmo?

caso o input fosse um outro componente, também deveria ser testado de forma isolada, e assim por diante né???

Sensacional, estou estudando Jest pra uma entrevista de emprego e claro busquei conteúdo de vocês que como sempre é excelente, eu passando nesse teste minha situação financeira melhora e com certeza invisto no Ignite xará 😃😃😃😃

Estou com dificuldade de usar Jest com as variáveis de ambientes do Vite, ao rodar dá a mensagem: The 'import.meta' meta-property is only allowed when the '--module' option is 'es2020', 'es2022', 'esnext', 'system', 'node12', sendo que o tsconfig está com esnext.

"Teste não vai fazer falta na sua vida até você sofrer pela falta de testes" - eu estou justamente agora sofrendo pela falta de testes kkk vídeo no momento certo

Tive diversos problemas na hora de aplicar os testes , entrei na comunidade e ninguém me ajudou

Que conteúdo sensacional mano, meus parabéns! Sua didática só aumenta com o tempo!

Muito boa a aula Diegão, as lives e top para mostra como e o dia dia, quando ficamos preso em algumas coisas simples as vezes kkk mas sempre acontece

Qual o Link da configuração do jest.config.ts ?

Top demais o conteúdo. Essa semana mesmo comeceiii a estudar pois na empresa que estou hoje é necessário realizar testes unitários e essa live veio na hora certa. até o momento não tinha encontrado neenhum conteúdo tão bom assim, principalmente para quem não tem experiência com testes.

00

Valeu pelo conteúdo! Já tinha ouvido falar da Testing Library, mas ainda não tinha visto exemplos. Vou começar a utilizar nos projetos.

Mais um excelente conteúdo, como tudo que fazem! Abraço!

pretende fazer um vídeo sobra o suspense do react

Conteúdo incrível

Cheguei tarde e perdi um pouco, agora rever e consumir bons conhecimentos
Era o que precisava agora JEST e Testing-library com REACT