Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Testando componentes mais rápido que miojo

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Gustavo Guimarães Gustavo Guimarães
August 11, 2018
Programming
1
57

Testando componentes mais rápido que miojo

Lightning Talk realizada no Front In Vale 2018

Avatar for Gustavo Guimarães

Gustavo Guimarães

August 11, 2018
Tweet

More Decks by Gustavo Guimarães

See All by Gustavo Guimarães
Construindo SPA's consistentes com Vue Router
Avatar for Gustavo Guimarães gustavogf
1
69

Other Decks in Programming

See All in Programming
Honoを使ったリモートMCPサーバでAIツールとの連携を加速させる！
Avatar for とすり tosuri13
1
180
Patterns of Patterns
Avatar for Denys Poltorak denyspoltorak
0
1.4k
高速開発のためのコード整理術
Avatar for sutetotanuki sutetotanuki
1
410
余白を設計しフロントエンド開発を 加速させる
Avatar for karacoro / からころ tsukuha
7
2.1k
humanlayerのブログから学ぶ、良いCLAUDE.mdの書き方
Avatar for Yuto tsukamoto1783
0
200
React 19でつくる「気持ちいいUI」- 楽観的UIのすすめ
Avatar for Hiroshi Morishige himorishige
11
7.5k
AWS re:Invent 2025参加 直前 Seattle-Tacoma Airport(SEA)におけるハードウェア紛失インシデントLT
Avatar for tetutetu214 tetutetu214
2
120
カスタマーサクセス業務を変革したヘルススコアの実現と学び
Avatar for Tomoyuki Hamaguchi _hummer0724
0
720
生成AIを使ったコードレビューで定性的に品質カバー
Avatar for Chiaki Okamoto chiilog
1
270
今から始めるClaude Code超入門
Avatar for 448jp | OKI Yoshiya 448jp
8
9k
MDN Web Docs に日本語翻訳でコントリビュート
Avatar for uutan1108 ohmori_yusuke
0
650
Basic Architectures
Avatar for Denys Poltorak denyspoltorak
0
680

Featured

See All Featured
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
21
1.4k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
162
24k
Ethics towards AI in product and experience design
Avatar for Skipper Chong Warson skipperchong
2
200
The B2B funnel & how to create a winning content strategy
Avatar for Katarina Dahlin katarinadahlin
PRO
1
280
Kristin Tynski - Automating Marketing Tasks With AI
Avatar for Tech SEO Connect techseoconnect
PRO
0
150
Redefining SEO in the New Era of Traffic Generation
Avatar for Szymon szymonslowik
1
220
What Being in a Rock Band Can Teach Us About Real World SEO
Avatar for Ade Holder 427marketing
0
170
Avoiding the “Bad Training, Faster” Trap in the Age of AI
Avatar for Mike Taylor tmiket
0
77
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
Avatar for Aleyda Solis aleyda
1
1.1k
Crafting Experiences
Avatar for Bethany Jepchumba bethany
1
49
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
Avatar for Kenny Baas-Schwegler baasie
0
450
Why You Should Never Use an ORM
Avatar for John Nunemaker jnunemaker
PRO
61
9.7k

Transcript

  1. Testando componentes mais rápido que miojo

  2. Gustavo Guimarães Desenvolvedor front end na Quero Educação gustavogmrs gustavoguimrs

    gustavogf

  3. Por que testar?

  4. Garantir que a sua aplicação está funcionando

  5. Jest

  6. None

  7. Teste de Snapshot

  8. Qualquer framework JS

  9. None

  10. <mcs-list :query="search" />

  11. <input type="text" v-model="search">

  12. $ yarn add jest

  13. { "scripts": { "test": "jest" } } package.json

  14. McsList.spec.js

  15. McsList.spec.js

  16. McsList.spec.js

  17. McsList.spec.js

  18. McsList.spec.js

  19. McsList.spec.js

  20. McsList.spec.js

  21. McsList.spec.js

  22. McsList.spec.js

  23. McsList.spec.js

  24. McsList.spec.js

  25. $ yarn test

  26. None

  27. Inicia teste Tem snapshot? Compara snapshots Cria novo snapshot Teste

    passa Teste passa Teste falha Sim Não != =

  28. Inicia teste Tem snapshot? Cria novo snapshot Teste passa Não

  29. McsList.spec.js.snap

  30. McsList.spec.js.snap

  31. McsList.spec.js.snap

  32. None
  33. None

  34. McsList.spec.js.snap

  35. None
  36. None

  37. $ yarn test

  38. None
  39. None

  40. Inicia teste Tem snapshot? Compara snapshots Cria novo snapshot Teste

    passa Teste passa Teste falha Sim Não != =

  41. Inicia teste Tem snapshot? Compara snapshots Teste passa Teste falha

    Sim != =
  42. None
  43. None

  44. $ yarn test

  45. None
  46. None