M2#A07 - Handlebars:

[alexandre1202]

Olá Fernando.

Tudo bom?

Acabei de instalar o Jest para funcionar com o Babel para usar ES06 nos testes que virão mas quando rodo o npm test ele apresenta uma lista de mensagens que indica uma página com informações e os motivos pelo qual o acesso está sendo negado em relação as propriedades. Veja abaixo o screenshot:

Esse são os códigos:

e o teste dele

Vi que existe um post de uma issue antiga mas que ficou pela metade.

Por favor, confirme se existe alguma forma de implementar considerando essas questões todas e resistindo a questão de vulnerabilidade indicada no link da mensagem do Handlebars:

Pois quando eu adiciono a função no sum.js:

O relatório do Jest indica que o teste passou:

Mas com esse problema de acesso o modo interativo do Jest (--watch) não funciona, mesmo com a configuração abaixo no package.json: { "scripts": { "test": "jest --coverage", "test:watch": "npm test -- --watch" }, "devDependencies": { "assert": "^2.0.0", "babel-core": "^6.26.3", "babel-jest": "^15.0.0", "babel-loader": "^6.4.1", "babel-preset-es2015": "^6.24.1", "babel-preset-stage-0": "^6.24.1", "chai": "^4.3.4", "jest-cli": "^15.1.1" } }

Quando puder por favor, diga também, porque está sendo gerado um package-lock.json e se devo fazer algo com ele.

@fdaciuk

[fdaciuk]

Oi @Alexandre1202! Consegue subir seu projeto em um repositório aqui no GitHub e compartilhar o link aqui pra eu ver como o projeto está, de forma geral?

Sobre o package-lock.json, não sei se você chegou a ver, mas eu tinha respondido nessa issue que você abriu =)

[alexandre1202]

Sim

Segue meu repo jest-in-practise.git

Quanto ao package-lock.json eu vi e entendi que a partir de uma versão do npm pra cá data ele faz parte do projeto.

Muito obrigado

[fdaciuk]

Oi @Alexandre1202! Atualizei o arquivo de dependências com as instruções para corrigir esse problema.

Mas em resumo: instale as versões 21 do jest-cli e babel-jest:

npm install --save-dev jest-cli@21 babel-jest@21

E crie um arquivo na raiz do seu projeto com o nome jest.config.js, e coloque isso aqui como conteúdo do arquivo:

module.exports = {
  coverageReporters: ['json', 'lcovonly', 'text', 'clover']
}

Ao executar o Jest, tudo deve funcionar corretamente =)

Me deixe saber se deu certo, ok? =)

[alexandre1202]

Fernando... tu é muito inteligente e rápido ehinnn?

Eu fiquei brigando com o Jest para resolver isso e não vi essa configuração do jest.config.js. Muito obrigado. Funcionou perfeitamente.

Só não sei porque o watch interativo ainda não está funcionando. Eu não tomo nenhum erro mas também ele não apresenta aquelas opções de filtrar um test ou testar todos etc.

Agradeço se puder ver novamente meu projeto.

[fdaciuk]

Eu fiquei brigando com o Jest para resolver isso e não vi essa configuração do jest.config.js. Muito obrigado. Funcionou perfeitamente.

haha, nada meu caro! É obrigação minha deixar orientações para que vocês consigam executar tudo corretamente =)

Só não sei porque o watch interativo ainda não está funcionando. Eu não tomo nenhum erro mas também ele não apresenta aquelas opções de filtrar um test ou testar todos etc.

Você diz, quando você roda o npm run test:watch? Se sim, veja que no final da tela deve aparecer uma frase:

Watch Usage: Press w to show more.

Aí você só precisa pressionar o w para exibir as outras opções =)

Me diz se era isso mesmo!

[alexandre1202]

Oi Fernando,

Eu não lembro de ter visto que eu deveria ter digitado npm run test:watch durante o curso. Não prestei atenção e achei que bastava digitar npm test mas claro, no package.json está configurado para ser test:watch, como segue:

Mas foi só digitar certo:

que deu certo! rs...

Muito obrigado e pode fechar!

[fdaciuk]

Boa, perfeito! =) Só pra deixar melhor explicado, que talvez durante o curso isso possa não ter ficado muito claro: os dois scripts vão servir para propósitos diferentes, quando você estiver usando em projetos reais. O primeiro, que executa o teste apenas uma vez e logo depois o processo morre, serve para ser executado em um CI, por exemplo, uma ferramenta que vai validar seu código antes dele chegar em produção, para garantir que todos os testes estão passando corretamente, e que suas novas alterações não afetaram os testes que já existiam.

Já o outro comando, com watch, é pra você usar enquanto estiver desenvolvendo, pra não precisar ficar rodando o npm test para cada vez que você salvar seus arquivos =)

Espero que tenha ficado mais claro, mas qualquer coisa, fique muito à vontade para perguntar =)

[alexandre1202]

Sim. Já tinha ficado claro. O nível de detalhe que você alcança nas suas explicações é valioso e preciso. Os dois momentos que você explicou são bem definidos pra mim por onde tenho trabalhdo com backend e refazer seu curso tem me feito cada vez mais ganhar gosto pelo frontend. Principlamente nessa questão de testes unitários, testes integrados e testes automatizados.

O que passou despercebido pra mim foi apenas o comando que deveria ter sido utilizado para invocar o watch.

Agora está funcionando rápido e corretamente.

Obrigado

[fdaciuk]

Ah então perfeito meu caro! As vezes eu acabo sendo prolixo demais haha =) Conte comigo para o que precisar :D

[SallesCosta]

essa issue respondida acabou de me resolver o dia haha valeu!