寫出不管地震怎麼搖 網站都不會壞的前端測試

Speaker: YU Chen
Event: LINE TECH FRESH 畢業分享會

Transcript

1. 寫出不管地震怎麼搖 網站都不會壞的前端測試
2. YU Content Dev TECH FRESH 北科資⼯ 圖片來源：LINE CREATIVE、LINE SPOT
3. 越⾼的 Code Coverage 越好的 程式碼品質 === ?
4. 什麼是 Code Coverage？
5. 什麼是 Code Coverage？
6. 什麼是 Code Coverage？
7. 什麼是 Code Coverage？
8. 什麼是 Code Coverage？
9. 100% 的 Coverage !== 沒有 Bug
10. 100% 的 Coverage !== 沒有 Bug
11. 100% 的 Coverage !== 沒有 Bug
12. 只看 Coverage 想要測什麼不好嗎？
13. 1 不會涵蓋到 所有的 Use case 只看 Coverage 想要測什麼不好嗎？ 2 會變成在測實作 ⽽不是在測功能
14. 那我們應該要怎麼決定要測什麼呢？
15. 那我們應該要怎麼決定要測什麼呢？ ⽤使⽤者會遇到的 使⽤情境（Use Cases）去想要寫哪些測試 當測試的⽅式越接近使⽤者使⽤的⽅式 就能讓我們對程式的正確性越有信⼼
16. 程式會遇到的兩種使⽤者
17. 1 Developer User 程式會遇到的兩種使⽤者 2 End User
18. Developer User 會有的使⽤情境 l 傳入對應的參數時程式應該怎麼運作 l 當不同的 Side Effect 產⽣時程式應該 怎麼運作
19. End User 會有的使⽤情境 l 應該看到什麼樣的 UI l 跟某個 UI 互動後會看到什麼結果
20. 可以幫助我們想出 Use Case 的⽅法
21. 1 設計稿中的 User Flow & 需求⽅開的需求 可以幫助我們想出 Use Case 的⽅法 2 從寫 E2E 測試 的⾓度去想 3 看 Code Coverage 沒有覆蓋到的地⽅
22. Thank you! yu2001 @justYu2001 圖片來源：Discord、 WIKIPEDIA