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

Vue.js 單元測試 -Jest

Avatar for CypressKuo CypressKuo
April 28, 2017
Technology
0
190

Vue.js 單元測試 -Jest

Vue.js 單元測試 with Jest

Avatar for CypressKuo

CypressKuo

April 28, 2017
Tweet

More Decks by CypressKuo

See All by CypressKuo
Deep-copying.pdf
Avatar for CypressKuo cypresskuo
0
30
CSS_for_Web_Vitals.pdf
Avatar for CypressKuo cypresskuo
0
37
談談_Code_review.pdf
Avatar for CypressKuo cypresskuo
0
42
REST_vs_GraphQL_今夜はご注文はどっち.pdf
Avatar for CypressKuo cypresskuo
0
22
CSS_重構.pdf
Avatar for CypressKuo cypresskuo
0
24
跟上_JS_的腳步-ES2020.pdf
Avatar for CypressKuo cypresskuo
0
26
Core_Web_Vitals.pdf
Avatar for CypressKuo cypresskuo
0
51
這個時代人人都知道的敏捷開發.pdf
Avatar for CypressKuo cypresskuo
0
55
Webassembly.pdf
Avatar for CypressKuo cypresskuo
0
11

Other Decks in Technology

See All in Technology
JJUG CCC 2025 Fall バッチ性能!!劇的ビフォーアフター
Avatar for HayashiYuichiro hayashiyuu1
1
310
re:Invent完全攻略ガイド
Avatar for JunjiKoide junjikoide
1
340
CDKの魔法を少し解いてみる ― synth・build・diffで覗くIaCの裏側 ―
Avatar for Nagai Takafumi takahumi27
1
150
手を動かしながら学ぶデータモデリング - 論理設計から物理設計まで / Data modeling
Avatar for soudai sone soudai
PRO
24
5.4k
お試しで oxlint を導入してみる #vuefes_aftertalk
Avatar for 弁護士ドットコム bengo4com
2
1.5k
プログラミング言語を書く前に日本語を書く── AI 時代に求められる「言葉で考える」力/登壇資料（井田 献一朗）
Avatar for Hacobu hacobu
PRO
0
160
仕様駆動 x Codex で 超効率開発
Avatar for Izumu KUSUNOKI ismk
2
1.4k
AWS オブザーバビリティサービスアップデート
Avatar for o11yfes o11yfes2023
0
110
マイクロリブート ~ACEマインドセットで実現するアジャイル~
Avatar for ソニー株式会社 sony
1
360
エンジニアにとってコードと並んで重要な「データ」のお話 - データが動くとコードが見える：関数型＝データフロー入門
Avatar for Izumu KUSUNOKI ismk
0
520
Quarkusで作るInteractive Stream Application
Avatar for Tomohiro Hashidate joker1007
0
140
What's the recommended Flutter architecture
Avatar for AAkira aakira
3
1.6k

Featured

See All Featured
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
91
590k
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
24
1.6k
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
46
2.6k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
17k
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
31
2.9k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
239
140k
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
9
670
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
162
15k
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
40
2.2k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
333
24k
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1032
470k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.5k

Transcript

  1. Vue.js 單元測試 -Jest 2017/04/28 @前端組例會 cypresskuo

  2. Jest Painless JavaScript Testing - Easy Setup - Instant Feedback

    - Snapshot Testing - Zero configuration testing platform - Facebook 開源專案 2

  3. Easy Setup Zero configuration testing platform 3

  4. Instant Feedback --watch --watchAll 4

  5. Snapshot Testing 將 React trees 或是其他可序列化的 UI 截取下來， 防止無意間修改到組件的某個部份。 -

    server side render 5

  6. 6

  7. 其他功能 DOM Testing (需要其他元件 TestUtil) Mock Function 覆蓋率報告 --coverage http://stackoverflow.com/questions/26618243/how-do-i-read-an-istanbul-coverage-report

    7

  8. 參考資料 http://facebook.github.io/jest/ https://vuejs.org/v2/guide/unit-testing.html http://laichuanfeng.com/work/jest-snapshot-and-dom-testing-in-react/ https://hackernoon.com/jest-for-all-episode-1-vue-js-d616bccbe186 8

  9. 感謝聆聽 9