Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Take a snapshot - ngvikings

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Bo Vandersteene Bo Vandersteene
May 28, 2019
Programming
210
0

Take a snapshot - ngvikings

Avatar for Bo Vandersteene

Bo Vandersteene

May 28, 2019

More Decks by Bo Vandersteene

See All by Bo Vandersteene
Nest the backend for your Angular Application #ijs2019
Avatar for Bo Vandersteene bovandersteene
0
110
AgentConf - Where is my error gone?
Avatar for Bo Vandersteene bovandersteene
0
380
Nest the backend for your Angular Application @AngularConnect
Avatar for Bo Vandersteene bovandersteene
2
1.2k

Other Decks in Programming

See All in Programming
[ハンズオン]AIへの指示だけで「五目並べ」を作ってみよう
Avatar for Satoshi Kaneyasu satoshi256kbyte
1
380
Agents on Rails - Rails at Scale 2026
Avatar for Irina Nazarova irinanazarova
0
570
月間100万人のサービス刷新で、 技術選定をHonoに振り切った話
Avatar for bara yutobara
8
6.7k
ソニーのクラウド共通基盤の変遷と AI時代の開発スタイルに合わせた進化 / The Journey of Sony’s Common Cloud Platform and Its Evolution for AI-Native Development
Avatar for KenjiYoneyama kenjiyoneyama
0
270
Unity6 URPによる海底をテーマにしたVJシステムの解説 | Unity Shader 完全に理解した 勉強会
Avatar for がむ gam0022
0
370
AI時代のコードレビューは人に向けるな、仕組みに向けろ
Avatar for meijin texmeijin
5
3.7k
個人開発者よ、Honoを使え（おじさんver）
Avatar for tanahiro2010 tanahiro2010
2
260
Event is what happens
Avatar for MOROHASHI Kyosuke moro
2
850
Verilogで学ぶCPU自作入門
Avatar for uyuki uyuki234
8
4.1k
iOS 27でニュースアプリはどう変わる！？ 〜日経電子版の新機能対応と、開発事例から〜
Avatar for Kazuki Nakashima lynnswap
7
13k
Railsのためのパスキー実践入門 〜マルチテナントSaaSでの意思決定〜
Avatar for utakaha utakaha
3
660
Everything will be SERVERLESS — 信じて運用した10年の経験値 / Everything Will be Serverless — Lessons Learned from 10 Years of Operational Experience
Avatar for shiro seike seike460
PRO
1
1.1k

Featured

See All Featured
Public Speaking Without Barfing On Your Shoes - THAT 2023
Avatar for David Neal reverentgeek
1
600
The Illustrated Guide to Node.js - THAT Conference 2024
Avatar for David Neal reverentgeek
1
570
Designing Powerful Visuals for Engaging Learning
Avatar for Mike Taylor tmiket
1
610
Unlocking the hidden potential of vector embeddings in international SEO
Avatar for Frank van Dijk frankvandijk
0
1k
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
Avatar for Sophie Logan marketingsoph
0
430
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
96
6.9k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
Avatar for Mfonobong Umondia mfonobong
2
590
The #1 spot is gone: here's how to win anyway
Avatar for Tamara Novitovic tamaranovitovic
4
1.2k
Sam Torres - BigQuery for SEOs
Avatar for Tech SEO Connect techseoconnect
PRO
0
580
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
280
24k
Leadership Guide Workshop - DevTernity 2021
Avatar for David Neal reverentgeek
1
400
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.6k

Transcript

  1. Take a snapshot Bo Vandersteene @reibo_bo

  2. @reibo_bo @reibo_bo @bo.vandersteene Software Engineer & Coach

  3. Snapshot

  4. None

  5. Snapshot a component

  6. None
  7. None
  8. None

  9. Snapshot a block of code

  10. None
  11. None

  12. Test case Render UI component Test against snapshot

  13. How we do it with Jasmine

  14. None

  15. • A lot of lines • Forget code to test

    • Hard to define all cases • Nice feedback • ...

  16. Should we skip

  17. E2E <> Unit

  18. Unit test - Small easily - Function - Class -

    Complex algorithm

  19. E2E test - Take screenshots - Entire application - Flows

    - Cypress, protractor, ...

  20. Unit tests !

  21. Testing is HARD

  22. None

  23. Why Jest Fast Sandboxed Zero Config Snapshots Error reporting

  24. Zero config

  25. http://bit.ly/2M28O9W

  26. http://bit.ly/2M28O9W

  27. http://bit.ly/2M28O9W

  28. http://bit.ly/2M28O9W Each app/lib tsconfig.spec.json

  29. http://bit.ly/2M28O9W

  30. http://bit.ly/2M28O9W Each app/lib angular.json

  31. http://bit.ly/2M28O9W

  32. http://bit.ly/2M28O9W

  33. http://bit.ly/2M28O9W

  34. Snapshot testing

  35. None
  36. None
  37. None
  38. None

  39. • Creates the snapshot if it doesn’t exist

  40. • Creates the snapshot if it doesn’t exist

  41. • Creates the snapshot if it doesn’t exist

  42. None
  43. None

  44. • Creates the snapshot if it doesn’t exist • Compares

    expectation to stored snapshot • Performs a diff

  45. • Creates the snapshot if it doesn’t exist • Compares

    expected to stored snapshot • Performs a diff • Easily update snapshot on refactor

  46. • Creates the snapshot if it doesn’t exist • Compares

    expected to stored snapshot • Performs a diff • Easily update snapshot on refactor

  47. Commit snapshot

  48. Not only components!

  49. None
  50. None
  51. None

  52. RxJs

  53. None
  54. None
  55. None
  56. None

  57. Globals

  58. Globals afterAll afterEach beforeAll beforeEach describe.each describe.only describe.only.each describe.skip describe.skip.each

    test.each test.only test.only.each test.skip test.skip.each test.todo describe test
  59. None
  60. None
  61. None
  62. None

  63. Mock

  64. None
  65. None
  66. None
  67. None
  68. None
  69. None
  70. None
  71. None
  72. None

  73. Tips & Tricks

  74. Make your tests your documentation

  75. Test logic

  76. Use beforEach Use afterEach

  77. Treat snapshots as code

  78. Tests should be deterministic

  79. Units NOT methods

  80. ng test -u

  81. Commit snapshots

  82. ci-tools ng test

  83. Love testing

  84. Thank You @reibo_bo @bo.vandersteene https://github.com/reibo/jest-example