Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
寫出不管地震怎麼搖網站都不會壞的前端測試
Search
LINE Developers Taiwan
PRO
June 19, 2024
Technology
0
2k
寫出不管地震怎麼搖 網站都不會壞的前端測試
Speaker: YU Chen
Event: LINE TECH FRESH 畢業分享會
LINE Developers Taiwan
PRO
June 19, 2024
Tweet
Share
More Decks by LINE Developers Taiwan
See All by LINE Developers Taiwan
LINE 與 AI 機器人技術應用現況
line_developers_tw
PRO
0
4
QA Testing
line_developers_tw
PRO
0
1
jcconf_datadev_prod
line_developers_tw
PRO
0
5
jcconf_SPM_prod
line_developers_tw
PRO
0
3
jcconf_LINEPay_prod
line_developers_tw
PRO
0
4
Live Activities in LINE
line_developers_tw
PRO
0
13
Neumorphism x Liquid Glass
line_developers_tw
PRO
0
12
猜你喜歡 – 打造高度擴展的個人化電商推薦
line_developers_tw
PRO
0
33
打造新電商搜尋體驗- 搜尋意圖辨識
line_developers_tw
PRO
0
17
Other Decks in Technology
See All in Technology
LLM時代にデータエンジニアの役割はどう変わるか?
ikkimiyazaki
6
1.3k
能登半島地震で見えた災害対応の課題と組織変革の重要性
ditccsugii
0
670
業務効率化をさらに加速させる、ノーコードツールとStep Functionsのハイブリッド化
smt7174
2
130
20201008_ファインディ_品質意識を育てる役目は人かAIか___2_.pdf
findy_eventslides
2
620
[Codex Meetup Japan #1] Codex-Powered Mobile Apps Development
korodroid
2
480
AI時代こそ求められる設計力- AWSクラウドデザインパターン3選で信頼性と拡張性を高める-
kenichirokimura
3
300
[Keynote] What do you need to know about DevEx in 2025
salaboy
0
170
Large Vision Language Modelを用いた 文書画像データ化作業自動化の検証、運用 / shibuya_AI
sansan_randd
0
130
OCI Network Firewall 概要
oracle4engineer
PRO
2
7.9k
E2Eテスト設計_自動化のリアル___Playwrightでの実践とMCPの試み__AIによるテスト観点作成_.pdf
findy_eventslides
2
600
ACA でMAGI システムを社内で展開しようとした話
mappie_kochi
1
320
AI時代だからこそ考える、僕らが本当につくりたいスクラムチーム / A Scrum Team we really want to create in this AI era
takaking22
8
4.2k
Featured
See All Featured
Building Applications with DynamoDB
mza
96
6.7k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
30
2.9k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
140
34k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.7k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.4k
How to train your dragon (web standard)
notwaldorf
96
6.3k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.6k
Embracing the Ebb and Flow
colly
88
4.8k
A Modern Web Designer's Workflow
chriscoyier
697
190k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
9
870
Documentation Writing (for coders)
carmenintech
75
5.1k
Transcript
寫出不管地震怎麼搖 網站都不會壞的前端測試
YU Content Dev TECH FRESH 北科資⼯ 圖片來源:LINE CREATIVE、LINE SPOT
越⾼的 Code Coverage 越好的 程式碼品質 === ?
什麼是 Code Coverage?
什麼是 Code Coverage?
什麼是 Code Coverage?
什麼是 Code Coverage?
什麼是 Code Coverage?
100% 的 Coverage !== 沒有 Bug
100% 的 Coverage !== 沒有 Bug
100% 的 Coverage !== 沒有 Bug
只看 Coverage 想要測什麼不好嗎?
1 不會涵蓋到 所有的 Use case 只看 Coverage 想要測什麼不好嗎? 2 會變成在測實作
⽽不是在測功能
那我們應該要怎麼決定要測什麼呢?
那我們應該要怎麼決定要測什麼呢? ⽤使⽤者會遇到的 使⽤情境(Use Cases)去想要寫哪些測試 當測試的⽅式越接近使⽤者使⽤的⽅式 就能讓我們對程式的正確性越有信⼼
程式會遇到的兩種使⽤者
1 Developer User 程式會遇到的兩種使⽤者 2 End User
Developer User 會有的使⽤情境 l 傳入對應的參數時程式應該怎麼運作 l 當不同的 Side Effect 產⽣時程式應該
怎麼運作
End User 會有的使⽤情境 l 應該看到什麼樣的 UI l 跟某個 UI 互動後會看到什麼結果
可以幫助我們想出 Use Case 的⽅法
1 設計稿中的 User Flow & 需求⽅開的需求 可以幫助我們想出 Use Case 的⽅法
2 從寫 E2E 測試 的⾓度去想 3 看 Code Coverage 沒有覆蓋到的地⽅
Thank you! yu2001 @justYu2001 圖片來源:Discord、 WIKIPEDIA