那些沒說到的部分
在開賽時,起初寫了個預期的 TOC 來規劃要講哪些內容,然而隨著每天撰文下來,覺得有部分內容比較偏向額外的學習,因此在評估後,決定調整原先 TOC 的內容,定義一下我認為至少先學到哪個部分就已足夠開始在實際專案中應用,而這一段落主要是來小談一下這些異動的章節有哪些,以及為什麼會有這些異動與將來是否會再陸續補充。
訪問實際導入測試的團隊心路歷程:會想擷取其他團隊經驗最主要是擔心導入後的成效問題,但訪問到不少人大部分都是支持充分研究後先寫再來調整,剩下都是怎麼把它運作得更好的後談,後來筆者自己想想學習與導入其實也不衝突,但有些內容真的要試過了才知道,因此想把這部分挪到後續有空時再來補充。
測試驅動開發(Test-Driven Development, TDD):TDD 本身是個值得深入討論的主題,只用一篇短文提及其實有些可惜,但要深入又會模糊了學習測試的焦點,因此後來想想乾脆透過測驗章節中的 Demo 環節稍微展現一下 TDD 精神下的紅燈綠燈要如何開發,若讀者有興趣了自然會對 TDD 感到好奇,這一部分賽後應該會考慮與下方的重構一起討論。
測試與重構(Refactor with Testing):在重構的領域中,其實還能夠再細分為針對測試程式碼的重構與產品程式碼的重構,而測試程式碼的重構主要是基於具有更高的可讀性與可維護性,甚至提升測試程式碼的執行效率等等,這其實很仰賴大量的實作後才能有所體會,而本系列文定位希望是以入門測試為主,所以同樣保留至賽後再來考慮;至於產品程式碼的重構,則已經偏向了 Vue 中的最佳實踐等等議題,雖說測試程式碼與產品程式碼是相生的概念,但這部分建議以測試作為保護的方向去調整產品程式碼即可,後續主要還是會以測試程式碼中的內容為主。
漏網之魚:原先是要談談測試中失敗的議題,但同樣這部分需要大量實作才會比較有感,而前面的變異測試(Mutation Testing)也是降低漏網之魚的手段之一,因此先有變異測試的概念我覺得剩下就是在慢慢補足案例已經,重新與團隊思考測試案例路徑的規劃即可。
完賽感言
屏除了上述部分,這邊首先要恭喜的是一起閱讀本系列文的讀者,對於基本的測試概念來說你們也完賽了!你可能會訝異於感覺還有不少東西沒提及,但是其餘的東西都是從基本的概念延伸而來的。就像開發產品程式碼一樣,我們也需要透過實際的測試經驗來慢慢磨練我們的測試技巧,並從中體會更多的心得與不斷精進測試相關的內容。
再來也要恭喜我自己(?),今年參賽其實也是挺突然的,一直到了開賽最後一天才打算來發文 XD,最主要的原因是有些部分希望能準備得更充分一點,但這種東西其實也沒有準備完的一天⋯⋯,因為測試程式碼的工具也不斷在進步,剩下的東西只能靠時間來驗證了。所以最後乾脆一不做二不休,直接給他報名下去,雖然報名後每天都在懷疑人生,好幾天寫到晚上十一點差點超時,不然就是一寫完直接累癱睡爆的那種,可是,我撐過來惹!!!感謝賽期間女友的支持與家中貓貓們的陪伴,另外也感謝同事把我鐵人賽當作在追番一樣閱讀,給了我不少回饋與靈感。
最後想要一起恭喜其他鐵人們,不論完賽與否,我覺得有繁中文件可以閱讀是一件很幸福的事情,更別提如果是追最新技術的鐵人們,在國內文獻上的參考很少的情況下還能夠寫出很多優質的文章,真的非常不簡單。由其每當我沒靈感時我都會邊看看其他鐵人寫了什麼 XD 時常一不注意差點忘記自己也在參賽,現在終於能好好來拜讀了!
TOC
寫完文章要列 TOC 簡單多了(?)
此 TOC 是透過 JavaScript 語法直接在鐵人賽目錄 頁面上 Console 取得系列文目錄標題與連結,歡迎各位鐵人自行取用下列語法。(迷:等一下,大家應該都寫完 TOC 了吧!!!!)
1 | const titleEl = document.querySelectorAll('.qa-list .qa-list__title') |
測試案例⋯⋯ (誒
1 | test('it should return markdown list', () => { |
產出結果:
- 【初始ノ章】前言與 TOC
- 【初始ノ章】測試建置:跟著系列文一起學測試
- 【初始ノ章】測試建置:在自己的專案加入單元測試來學測試
- 【初始ノ章】測試建置:Vitest Config Setting
- 【概念ノ章】測試價值:為什麼我需要測試
- 【概念ノ章】測試價值:加入測試的時機
- 【概念ノ章】測試脈絡-1. 決定測試類型
- 【概念ノ章】測試脈絡-2. 決定測試工具
- 【概念ノ章】測試脈絡-3. 決定測試情境與測試案例
- 【概念ノ章】測試脈絡-4. 測試案例中的 3A 模式
- 【概念ノ章】測試脈絡-5. 撰寫測試碼 FIRST 法則與學習步驟
- 【語法ノ章】案例與情境:describe & it 與輔助 API
- 【語法ノ章】Setup & Teardown:beforeAll, beforeEach, AfterAll & AfterEach
- 【語法ノ章】斷言(Assertion)上篇:斷言語法與 Matchers
- 【語法ノ章】斷言(Assertion)下篇: 替身、快照(Snapshot)與拋出錯誤
- 【試験ノ章】第一個測驗:測試情境案例、Setup & Teardown 與 Matchers
- 【概念ノ章】測試工具: Vue Test Utils 與元件測試
- 【語法ノ章】元件測試:容器(Wrapper)
- 【語法ノ章】元件測試:容器方法(Wrapper methods)-選擇器與陷阱
- 【語法ノ章】元件測試:容器方法(Wrapper methods)-取得目標資訊
- 【語法ノ章】元件測試:容器方法(Wrapper methods)-模擬事件
- 【語法ノ章】元件測試:模擬 Vue APIs(data, props)
- 【語法ノ章】元件測試:模擬 Vue APIs(emit, provide/inject)
- 【語法ノ章】元件測試:模擬 Vue APIs(slots, custom directives)
- 【試験ノ章】第二個測驗:容器(Wrapper)與容器方法(Wrapper methods)
- 【概念ノ章】測試替身(Test Double):Dummy, Stub, Spy, Fake & Mock
- 【語法ノ章】測試替身(Test Double)feat. Vue Test Utils
- 【語法ノ章】測試替身(Test Double)feat. Vitest Mocking API(Date, Timer)
- 【語法ノ章】測試替身(Test Double)feat. Vitest Mocking API(Function, Globals & Modules)
- 【語法ノ章】Vue Ecosystem 篇:Vue Router 測試
- 【語法ノ章】Vue Ecosystem 篇:Pinia 測試
- 【進階ノ章】Vitest UI
- 【進階ノ章】覆蓋率(Coverage)
- 【進階ノ章】寫測試的最佳實踐(Testing Best Practice)
- 【雜談ノ章】那些沒說到的內容、完賽感言、TOC 與參考資料們
參考資料
不想看我的系列文也沒關係(嗚),但這些文章你絕對不能錯過。
文章
環境設置
測試金字塔
單元測試
測試斷言庫
測試替身
- Teddy Chen - Test Double(1):什麼是測試替身?
- Teddy Chen - Test Double(2):五種替身簡介
- Teddy Chen - Test Double(3):Dummy Object
- Teddy Chen - Test Double(4):Test Stub
- Teddy Chen - Test Double(5):Test Spy
- Teddy Chen - Test Double(6):Fake Object
- Teddy Chen - Test Double(7):Mock Object
- Martin Fowler - TestDouble
- 被蛇咬到的魯卡 - Unit Test 中的替身:搞不清楚的Dummy 、Stub、Spy、Mock、Fake
- Julian Chu - 測試中常見的名詞:Stub, Dummy, Mock..等等
覆蓋率
- Teddy Chen - 透過測試涵蓋率讓重構更有信心(上):分支涵蓋率
- Teddy Chen - 透過測試涵蓋率讓重構更有信心(中):突變測試
- Teddy Chen - 透過測試涵蓋率讓重構更有信心(下):特徵測試
- Martin Fowler - TestCoverage
TDD
突變測試
最佳實踐
書籍
- XUnit Test Patterns
- Robert C. Martin - 無瑕的程式碼-敏捷軟體開發技巧守則
- Martin Fowler - 重構|改善既有程式的設計, 2/e
- Roy Osherove - 單元測試的藝術
- Kent Beck 的測試驅動開發:案例導向的逐步解決之道
- Mark Ethan Trostler - 可測試的 JavaScript
- Edd Yerburgh - Vue.js 應用測試
- CODE COMPLETE:軟體開發實務指南, 2/e
Facebook 追蹤
相關工具
– 希望將來還有機會與各位鐵人一起共襄盛舉!–