The latest articles on DEV Community by Natan Bispo (@natanlbispo). https://dev.to/natanlbispo https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F295810%2Fa56cda25-4fd1-4872-bf27-5a2f8ced9ce3.jpeg https://dev.to/natanlbispo en Natan Bispo Sun, 14 Feb 2021 01:56:10 +0000 https://dev.to/natanlbispo/cypress-trocando-cy-route-por-cy-intecept-mfa https://dev.to/natanlbispo/cypress-trocando-cy-route-por-cy-intecept-mfa <p>A versão 6.0.0 do Cypress trouxe algumas mudanças, uma delas foi a adição de um novo comando o <code>cy.intecept()</code> que vem com a função de substituirdos comandos <code>cy.server()</code> e <code>cy.route()</code>.</p> <h3> Conhecendo a Sintaxe </h3> <p><iframe src="https://jsfiddle.net/natanlbispo/x7bhku0L/16//embedded/js//dark" width="100%" height="600"> </iframe> </p> <h3> Intecept &gt; Route </h3> <p>Como seu nome já diz, o comando consegue interceptar tanto solicitações e respostas de chamadas realizadas pela API, assim como suporte para requisições de busca, carregamentos de página e carregamentos de recursos.</p> <h4> routeMatcher e routeHandler </h4> <p>Com a atualização do Cypress, alem do novo comando, foram adicionados dois argumentos: <code>routeMatcher</code> e <code>routeHandler</code>. </p> <p>Com o uso do <code>routeMatcher</code>, se tornou mais fácil pegar as chamadas da API pois é possível adicionar um minimatch ou RegEx em sua sintaxe, auxiliando assim especificar as chamas por dados do cabeçalho.<br> <iframe src="https://jsfiddle.net/natanlbispo/x7bhku0L/28//embedded/js//dark" width="100%" height="600"> </iframe> <br> Já o <code>routeHandler</code> oferece a opção de alterar os cabeçalhos das chamadas da API, assim como modificar respostas das solicitações.<br> <iframe src="https://jsfiddle.net/natanlbispo/x7bhku0L/38//embedded/js//dark" width="100%" height="600"> </iframe> </p> <h3> Atualizações Cypress </h3> <p>O Cypress vem se aprimorando com o objetivo de se tornar uma ferramenta ainda mais completa. Para mais informações sobrea as funcionalidade a <a href="https://docs.cypress.io/api/commands/intercept.html#Comparison-to-cy-route">documentação oficial</a> é uma boa dica.</p> javascript testing cypress