Assim que EU testo meus apps React (Playwright e MSW)

Рет қаралды 17,268

6 ай бұрын

Conecte-se a 500mil devs e avance para o próximo nível com a nossa plataforma: rocketseat.com.br/
Cadastre-se na nossa plataforma: app.rocketseat.com.br/signup
Junte-se a mais de 392mil devs em nossa comunidade no Discord: / discord
Acompanhe a Rocketseat nas redes sociais:
Twitter: @rocketseat
Facebook: @rocketseat
Instagram: @rocketseat

Пікірлер: 56

@PedroHenriqueRodrigues-vr7jh 6 ай бұрын

Faz mais dessas lives diego, gerou bastante conteúdo e é incrível acompanhar ao vivo.

@lucasfranzolin 6 ай бұрын

Estou usando a versao nova do MSW no meu trabalho, eh muito util!!

@me.dwesley 5 ай бұрын

Muito útil!

@lealws 6 ай бұрын

Muito bom!

@15ericson 6 ай бұрын

Gostaria muito de um conteúdo mais aprofundado sobre o Playwright.

@tudodebom4193 6 ай бұрын

Boa ❤❤

@AndroPlayerFMD 6 ай бұрын

Brabo irmão! Consegue trazer um video sobre o Cloudinary utilizando o NEXT.JS?

@dieegosf 6 ай бұрын

Para realização de uploads?

@AndroPlayerFMD 6 ай бұрын

@@dieegosf Isso

@AlexCastroDev 3 ай бұрын

Nem precisa de MSW, da pra usar os Http archives, e boa. mesma experiencia do VCR do Rails

@LeandroCorso 3 ай бұрын

Eu não tô conseguindo configurar o MSW no Next 14.2. Na doc do MSW mostra como encapsular o app no arquivo main.js, que não existe no Next. Também já li que em componentes server side a configuração para browser mocking não funciona. Motivos até bem óbvios, já que no Next agora todos os componentes são SSR por padrão, teria que ficar fazendo "use client" toda vez e isso não é muito bom. De qualquer forma algum de vocês conhece alguma forma de contornar isso para que eu possa usar o MSW não apenas para testes unitários, mas também para mock de desenvolvimento? Ou ainda, uma biblioteca alternativa que faça isso que estou precisando fazer?

@murilojucas9658 6 ай бұрын

🚀🚀

@gustavoh5143 6 ай бұрын

alguém sabe qual a extensão de icones que ele usa?

@JonathanCominRibeiro 6 ай бұрын

Uma dúvida, por que não simplismente usar o cypress nesse caso? para e2e eu curti bastante. Faz intercepts de requests, da pra testar em viewports de tamanhos específicos, etc...

@giannoulakis 6 ай бұрын

Cypress a galera já conhece Rocketseat precisa continuar vendendo cursos….

@dieegosf 6 ай бұрын

O PlayWright também tem mercado e tem uma feature de executar testes em paralelo que o cypress não tem. Fora que o Cypress como empresa não anda muito bem então sempre bom conhecer pelo menos uma alternativa.

@alangabriel1671 6 ай бұрын

Diego tá fazendo live onde? E quando?

@bernardonunes2942 6 ай бұрын

tambem to querendo saber

@felipediniz9959 6 ай бұрын

Eu tmb

@dieegosf 6 ай бұрын

Fiz na Twitch, na minha conta pessoal.

@ribeiro.evandro 6 ай бұрын

Olhando o site do Playwright, vi que não tem suporte ou pelo menos não oficial ao PHP, como trabalho com Laravel atualmente, seria muito bom ter esse tipo de testes... Vou buscar alternativas que sejam simples como o Playwright, se alguém tiver alguma recomendação, agradeço

@jaguarnet7 6 ай бұрын

Acho que dá para usar com node apenas para descrever os testes.

@fillipedesenvolvedor6257 6 ай бұрын

@dieegosf você está usando o React Router Dom neste projeto? como que você fez a configuração das rotas no arquivo principal usando o MSW?

@dieegosf 6 ай бұрын

Deixei o repositório público pra você aqui: github.com/rocketseat-education/pizzashop-web

@fillipedesenvolvedor6257 6 ай бұрын

@@dieegosf obrigado meu bom! eu entendi como que tu fez, pra não ter problemas você fez em um arquivo separado e eu nem pensei em fazer isso rsrsrs

@pedrol6193 6 ай бұрын

Onde foi essa live?

@pedrossoares 6 ай бұрын

Esse conteúdo vai entrar naquele módulo novo do Ignite ?

@dieegosf 6 ай бұрын

Isso, já está entrando aos poucos nesse novo projeto :)

@wesley2024-x8w 6 ай бұрын

🚀🚀🚀

6 ай бұрын

Playwright já intercepta request facilmente por que esta usando MSW ? Tenho usado apenas Playwright pra tal inclusive mockando WS também, e gostaria de entender sua escolha pelo MSW ;P

@dieegosf 6 ай бұрын

MSW pode ser usado durante o desenvolvimento pra evitar ter que subir o Back pra alterações simples no front

6 ай бұрын

@@dieegosf❣Inclusive estou tendo algumas dores em manter meus mocks atualizados, voces automatizaram esse processo ou vão atualizando manualmente sob demanda ? Tava pensando em automatizar esse proceesso batendo em uma ENV de dev capturando e utilizando essas respostas pra update dos mopcks periodicamente e fiquei curioso com como voces lidam com isso 👀Muito obrigado pelo conteudo !

@naturallifenow 6 ай бұрын

Eu já havia usando o Cypress e ele já fornece nativamente esse recurso de interceptar as request que são feitas para o backend e mockar elas. Basta procurar por cy.intercept na documentação do cypress.

@rafaelpendragon3212 6 ай бұрын

essas lives são no yt mesmo? que horas?

@dieegosf 6 ай бұрын

Fiz na Twitch, na minha conta pessoal.

@anciao_dev 6 ай бұрын

@@dieegosf quais dias tem live?

@izzy6865 6 ай бұрын

Essa aplicação vai para o ignite?

@dieegosf 6 ай бұрын

Já está indo, uma parte já foi, o resto vem nas próximas semanas.

@filipeleonelbatista 6 ай бұрын

Na teoria o TDD o teste deveria ser desenvolvido antes do codigo. Como seria isso usando playwright e MSW?

@dieegosf 6 ай бұрын

Não uso TDD no front, não vejo muita vantagem

@cassiooliveira6946 6 ай бұрын

Playwright é mais utilizado em testes e2e e essa camada de teste necessita dos seletores da página, então eu acho que TDD não cabe bem nesses testes

@lucasanselmo5881 6 ай бұрын

O Playwright acaba sendo mais vantajoso para testes de e2e que acaba sendo totalmente oposto as práticas do TDD. Nos testes e2e, é como se fosse necessário já ter a aplicação já pronta, para testar. Contudo, você pode usar o TDD, para garantir que as informações estejam presentes na tela, e depois escrever os testes e2e. Exemplo com base na aplicação do vídeo: poderia ter um teste feito nos moldes de TDD, simulando um cadastro de pedido, usando valores genéricos e com mocks, e após isso, fazer o teste e2e na aplicação real.