Resumo do Transcript

Estamos aqui de volta, vamos lá continuar e escrever teste para o estado inicial do formulário. Vamos começar aqui e testar se o formulário inicializou o estado com uma variável chamado nome sendo a string vazia. Vamos criar aqui no lado em cima aqui o formulário, o arquivo de teste. O teste deve iniciar o estado do componente com o nome vazio sendo a string vazia, alguma coisa assim. Então, vamos pegar aqui o component, é aquele enzyme wrapper. Agora, esse componente aqui a gente pode fazer assim, ponto state para poder pegar uma variável do estado. State nome, por exemplo, vamos dar um console log aqui, você vê. Se eu disser component, ponto state, nome, vamos ver que aparece no console log. E aqui é o terminal, vou iniciar os testes usando npm test. Ele já está carregando o formulário test. O console log aqui é vazio, você não vê nada porque é vazio. Deixa eu adicionar o negócio aqui. Por exemplo, eu estou usando o backtake aqui, se acentra aqui, para poder usar a interpolação de string e eu vou dar valor do nome e vou botar uns aspas ao redor do valor. Certo? A gente vai visualizar melhor. Voltando ao terminal, você vê valor do nome e as aspas aqui não tem nada entre as aspas. Então, realmente o nome está vazio. Note que isso aqui não é no, certo? Se a gente tivesse no, por exemplo, se eu mudasse aqui, aqui embaixo é o formulário com a JTS, se eu mudar o nome para no, vamos ver o que dá. Apareceu no lá, certo? Então, não é no, tá? Voltando aqui, vou reverter isso e vamos continuar. Então, a gente já aprendeu a acessar o estado do wrapper do enzyme, só dizer ponto state e o nome da variável do estado. Agora, vamos testar se esse cara realmente recebeu o valor inicial correto. Vamos expect esse cara aqui to be string vazia. Salvar e vamos ver se o teste está passando. Deve de ser o estado do componente com o nome vazio, tudo ok. Muito bem. Vamos ver se realmente o teste funciona. Vamos mudar o nome para no, aqui na implementação, aqui abaixo e ver lá no terminal de novo. Você note que o teste deve iniciar o estado do componente com o nome vazio, agora está falhando. Ele esperava que o valor tinha sido 1. String vazia, mas recebeu não. Então, realmente o teste está verificando a coisa corretamente. Voltando aqui, vamos reverter essa mudança e continuar. Então, a gente escreveu o nosso primeiro teste. O teste para verificar o estado inicial do formulário. A gente usou o enzyme wrapper, ponto state, esse método nos permite acessar o valor de uma variável do estado, especificada como argumento. Nesse caso, a gente deu o nome. Então, a gente vai continuar e fazer a mesma coisa para cada um dos outros, das outras variáveis. Então, você pode criar um teste para cada um para verificar. Então, antes de você continuar aqui, eu gostaria que você tentasse fazer isso por você mesmo, antes da gente continuar na solução juntos. Então, tente fazer primeiro, antes de continuar, pausa e vídeo, como exercício. Então, até a próxima, onde a gente vai ver a solução dos outros. Até mais!