點燈坊

spyOn() 是整合測試與單元測試的關鍵，本文深入探討 spyOn() 用於整合測試部分。

WebStorm 雖然提供自動產生 Jasmine Suite、Spec… 等功能，不過預設使用 ES5 的 anonymous function，當然可以自己重構成 arrow function，若能一開始就 arrow function 就更方便了。

很羨慕 Visual Studio 有 Alive 可以即時跑單元測試嗎？只要安裝了 Wallaby，在 Visual Studio Code 也可以如 Alive 一樣為 Angular 即時跑 TypeScript 與 Jasmine 單元測試。

很羨慕 Visual Studio 有 Alive 可以即時跑單元測試嗎？只要安裝了 Wallaby，在 WebStorm 也可以如 Alive 一樣為 Angular 即時跑 TypeScript 與 Jasmine 單元測試。

由於 TypeScript 是編譯語言，很多人擔心該如何 debug Angular，尤其是 TypeScript 編譯沒錯，但在瀏覽器執行卻錯了，但因為 TypeScript 已經編譯成 JavaScript，我該怎麼知道錯在 TypeScript 哪一行呢？

Ng lint 預設會檢查是否有 trailing whitespace，尤其在 enter 換行時，WebStorm 為了排版漂亮，會自動新增 whitespace，這將導致 ng lint 的抱怨，希望在存檔時，自動刪除這些 whitespace。

WebStorm 的 auto import 非常方便，不過預設格式不符合 ng lint 要求，且 reformat code 之後，整個預設的 Angular 格式也會重新排版，該如何設定成符合 ng lint 要求的格式呢？

下拉選單為常用的使用者介面，該如何優雅地將資料綁定在元件上，並且優雅地取得使用者的選擇資料呢？

使用了 TypeScript 之後，對於型別就非常敏感，都會要求自己要將傳入參數的型別與回傳型別明確指定，但 Protractor 在 page object 常用的 getText()，到底回傳型別是什麼呢？

Angular CLI 的 Protractor 預設是跑 Chrome，但在 Chrome 59 之後提供了 Headless Chrome，讓我們以類似 PhantomJS 方式跑 E2E 測試。