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

Testando componentes mais rápido que miojo

Gustavo Guimarães
August 11, 2018
Programming
1
50

Testando componentes mais rápido que miojo

Lightning Talk realizada no Front In Vale 2018

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
gustavogf
1
61

Other Decks in Programming

See All in Programming
ファインディLT_ポケモン対戦の定量的分析
fufufukakaka
0
680
定理証明プラットフォーム lapisla.net
abap34
1
1.8k
How mixi2 Uses TiDB for SNS Scalability and Performance
kanmo
36
14k
Amazon ECS とマイクロサービスから考えるシステム構成
hiyanger
2
550
pylint custom ruleで始めるレビュー自動化
shogoujiie
0
110
データの整合性を保つ非同期処理アーキテクチャパターン / Async Architecture Patterns
mokuo
46
17k
Flutter × Firebase Genkit で加速する生成 AI アプリ開発
coborinai
0
150
パスキーのすべて ── 導入・UX設計・実装の紹介 / 20250213 パスキー開発者の集い
kuralab
3
760
XStateを用いた堅牢なReact Components設計~複雑なClient Stateをシンプルに~ @React Tokyo ミートアップ #2
kfurusho
1
890
SwiftUIで単方向アーキテクチャを導入して得られた成果
takuyaosawa
0
270
負債になりにくいCSSをデザイナとつくるには？
fsubal
9
2.4k
Open source software: how to live long and go far
gaelvaroquaux
0
630

Featured

See All Featured
GitHub's CSS Performance
jonrohan
1030
460k
Writing Fast Ruby
sferik
628
61k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
Making Projects Easy
brettharned
116
6k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.5k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
4
320
Agile that works and the tools we love
rasmusluckow
328
21k
Rebuilding a faster, lazier Slack
samanthasiow
80
8.8k
The Straight Up "How To Draw Better" Workshop
denniskardys
232
140k
Documentation Writing (for coders)
carmenintech
67
4.6k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.3k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
27
1.9k

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