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

Testando componentes mais rápido que miojo

Avatar for Gustavo Guimarães Gustavo Guimarães
August 11, 2018
Programming
1
56

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
AI時代を生き抜く 新卒エンジニアの生きる道
Avatar for coconala_engineer coconala_engineer
1
500
大規模Cloud Native環境におけるFalcoの運用
Avatar for Chihiro Hasegawa owlinux1000
0
240
HTTPプロトコル正しく理解していますか？ 〜かわいい猫と共に学ぼう。ฅ^•ω•^ฅ ﾆｬ〜
Avatar for ♛Heitor Hirose hekuchan
2
600
2年のAppleウォレットパス開発の振り返り
Avatar for muno92 muno92
PRO
0
180
從冷知識到漏洞，你不懂的 Web，駭客懂 - Huli @ WebConf Taiwan 2025
Avatar for Huli aszx87410
2
3.3k
Developing static sites with Ruby
Avatar for Masafumi Okura okuramasafumi
1
340
はじめてのカスタムエージェント【GitHub Copilot Agent Mode編】
Avatar for Satoshi Kaneyasu satoshi256kbyte
0
140
AtCoder Conference 2025「LLM時代のAHC」
Avatar for Yuki Imajuku imjk
2
640
React 19でつくる「気持ちいいUI」- 楽観的UIのすすめ
Avatar for Hiroshi Morishige himorishige
11
3.3k
Unicodeどうしてる？ PHPから見たUnicode対応と他言語での対応についてのお伺い
Avatar for てきめん tekimen youkidearitai
PRO
0
190
안드로이드 9년차 개발자, 프론트엔드 주니어로 커리어 리셋하기
Avatar for Seungmin 마량 maryang
1
150
re:Invent 2025 トレンドからみる製品開発への AI Agent 活用
Avatar for Kohei Yoshikawa yoskoh
0
570

Featured

See All Featured
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
85
9.3k
Building Applications with DynamoDB
Avatar for Matt Wood mza
96
6.9k
Fireside Chat
Avatar for paigeccino paigeccino
41
3.8k
Redefining SEO in the New Era of Traffic Generation
Avatar for Szymon szymonslowik
1
180
The untapped power of vector embeddings
Avatar for Frank van Dijk frankvandijk
1
1.5k
Visualization
Avatar for Eitan Lees eitanlees
150
16k
HDC tutorial
Avatar for Michiel Stock michielstock
1
290
16th Malabo Montpellier Forum Presentation
Avatar for AKADEMIYA2063 akademiya2063
PRO
0
35
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
Avatar for Vitaly Friedman smashingmag
254
22k
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
210
24k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
Avatar for Chris Coyier chriscoyier
508
140k
More Than Pixels: Becoming A User Experience Designer
Avatar for Michelle Schulp Hunt marktimemedia
2
280

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