Lock in $30 Savings on PRO—Offer Ends Soon! ⏳

Testando componentes mais rápido que miojo

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

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
68

Other Decks in Programming

See All in Programming
Go コードベースの構成と AI コンテキスト定義
Avatar for ANDPAD inc andpad
0
110
30分でDoctrineの仕組みと使い方を完全にマスターする / phpconkagawa 2025 Doctrine
Avatar for Takashi Kanemoto ttskch
3
790
TypeScript 5.9 で使えるようになった import defer でパフォーマンス最適化を実現する
Avatar for おおいし bicstone
1
1.2k
sbt 2
Avatar for kenji yoshida xuwei_k
0
240
テストやOSS開発に役立つSetup PHP Action
Avatar for Atsushi Matsuo matsuo_atsushi
0
140
関数実行の裏側では何が起きているのか？
Avatar for minop1205 minop1205
1
670
tsgolintはいかにしてtypescript-goの非公開APIを呼び出しているのか
Avatar for syumai syumai
6
2k
React Native New Architecture 移行実践報告
Avatar for taminif taminif
1
150
なあ兄弟、 余白の意味を考えてから UI実装してくれ！
Avatar for Ryomm ktcryomm
10
11k
WebRTC と Rust と 8K 60fps
Avatar for tnoho tnoho
2
1.9k
非同期処理の迷宮を抜ける: 初学者がつまづく構造的な原因
Avatar for PADAone pd1xx
1
690
バックエンドエンジニアによる Amebaブログ K8s 基盤への CronJobの導入・運用経験
Avatar for suna-big sunabig
0
140

Featured

See All Featured
A better future with KSS
Avatar for Kyle Neath kneath
240
18k
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
31
6.4k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
239
140k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
527
40k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
37
2.6k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
54
7.9k
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
80
6.1k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
Avatar for Tammy Everts tammyeverts
1
92
Building Adaptive Systems
Avatar for Chris Keathley keathley
44
2.9k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
How Fast Is Fast Enough? [PerfNow 2025]
Avatar for Tammy Everts tammyeverts
3
380

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