Neste trecho, o autor discute o método component.setProps() que combina as propriedades de um componente com as já existentes, permitindo testar. Ele faz referência ao arquivo checkbox.js, onde um teste inicialmente falhou, mas após reverter para a implementação original, o teste passou com sucesso.
O autor menciona a inclusão de estilos em um componente <span> e que não considera necessário um teste adicional para verificar esses estilos, mas abre a possibilidade para quem quiser realizar essa verificação.
Pontos principais discutidos:
Uso de setProps: Permite modificar propriedades de um componente no teste sem interferir nas existentes.
Teste do componente CheckboxList:
Antes de cada teste, são definidos "props" falsos.
O componente e suas propriedades são acessíveis em cada teste devido à estrutura do bloco describe.
Verificação da presença de um checkbox para cada opção.
Propriedades de cada checkbox são checadas.
Confirmado que a lista inclui um título.
Revisão da qualidade do teste:
O teste anterior não era robusto e por isso foram feitas alterações usando setProps para validar mudanças no texto renderizado.
Conclusão
O autor agradece pela visualização, menciona seus perfis no Twitter e GitHub, e se despede.
Um detalhe aqui, o component.setPropos, esse setPropos, esse método, vai combinar esse
cara aqui com as propos que já existem.
Por isso não vai ter problema só de passar um objeto com uma única propriedade, certo?
Então vai emerger esse cara com as propos existentes.
Então com isso a gente termina de testar esse cara aqui, vamos lá direto aqui no checkbox.js,
você note que o teste realmente falhou, vamos reverter para a implementação que original
ali e vai, teste agora passa, então está tudo ok.
Eu vi que o título dá a lista.
Então com isso a gente termina esse cara, se você quiser você pode até testar o estilo
que foi passado para esse span, da mesma maneira que a gente fez lá quando a gente testou o
checkbox, é só pegar o span prop style, aí verifica essa prop style ponto text decorations
e o valor é esse cara, eu não vou fazer esse teste aqui, certo?
Eu não acho necessário, mas se você quiser pode fazer.
Então por isso é só pelo checkbox list, nós aprendemos a escrever os testes para
esse cara, certo?
Então vamos aqui, só dar uma revisão geral, vamos começarmos aqui, temos o before each,
a gente definir os nossos props falsos que foram passados para o checkbox list, note
que a gente definiu o component e o props, component é o que eu chamo enzyme wrapper
daqui, como variáveis aqui no bloco de describe para poder elas terem, serem acessíveis em
cada teste.
Verificamos a inclusão de um checkbox para cada opção, também a inclusão do, das,
para cada checkbox, se as propriedades de cada checkbox foram definidas corretamente.
Nós demos o loop no prop options, as opções, porque tem que ter um checkbox para cada opção,
aí no final verificamos se a lista inclui um título, a gente usou bem simples, capturou
o span, verificou o texto.
Vamos ver o problema de antes que a gente já viu que o teste não é muito bom se
o valor foi exatamente o valor que a gente usou no teste, por isso que a gente fez esse
cara aqui, usou set props para poder setar novas propriedades para o wrapper, enzyme
wrapper.
Nesse caso, um novo levo a gente checou se realmente o texto foi mudado na próxima
renderização e o texto apareceu como um novo levo.
Certo?
Certo?
Checkbox list.
Então, por isso é só, muito obrigado por assistir.
Estou no Twitter com NBK Hope, você pode verificar em que é Hope.
Estou também no GitHub, Twitter.comba, NBK Hope.
Estou no GitHub também, mesmo nome.
E até a próxima.
Tchau.