phantom-jasmine 與阿拉丁

前陣子開始寫起 JavaScript 的 test,用的是 Jasmine,用瀏覽器跑都正常,只是用 npm 上的 phantom-jasmine 來跑測試結果都不正常。因為想要把專案丟上 Travis CI,所以今天又花了不少時間下去找問題,結果還真是有些意外。

這個問題最大原因就是 npm phantom-jasmine 和原作者的 phantom-jasmine 的是不同 fork,npm module maintainer 是 rlayte,而 phantom-jasmine 作者是 Joshua Carver,雖然 npm 網站上的使用說明和 Joshua 在 Github 上的幾乎都一樣,Joshua 也在 README 說了可以用 npm 裝,但是實際上用npm install -g phantom-jasmine裝的卻是 rlayte 的 fork,然而 rlayte 的那版,卻是他改很大的版本,整個行為都已經和說明上寫的不一樣了。

本來的 phantom-jasmine 是使用者丟 HTML 檔案進去,不過 rlayte 改到後來,變成是它會自己去特定的路徑找 js 檔案,丟進 tempalte 產生 html 然後跑測試的,而這個路徑好死不死預設是exmample/js/**/*.js,雖然測試的 spec 還是預設在spec/下找,可是要測試的檔案會在example/js/下面找,如果沒有改設定,根本就不會測試到想要測的檔案,這個行為是和原來完全不一樣的,而且也沒寫在文件上。

還好我也有發現,rlayte 其實已經把他的 phantom-jasmine fork 改成 aladdin 了,前面講的那些行為該怎樣用,其實都寫在 aladdin 那邊的 README 內。

aladdin 設計的其實蠻無腦的,spec 檔案放在spec/目錄下,然後在 spec 目錄下新增一個 config.json:

[ 
  'lib/jquery.js',
  'app/**/*.js'
]

這個檔案把你要測試的 src 和 dependency 都照順序放好,然後在專案根目錄執行aladdin就會開始測試了,連 Jasmine 的檔案都不用自己抓。

要在 Travis CI 上跑測試,只要再加上兩個檔案就可以,一個是 .travis.yml,另外一個是 package.json.travis.yml只要設成 Node.js 的就可以,可以直接拷貝範例,然後內容的 nodejs 版本只留一個。然後再加上 before_script 告訴 Travis CI 要安裝 aladdin:

before_script:
    - npm install -g aladdin

至於package.json就稍微複雜一點,以下是範例:

{
  "name": "robst-video",
  "author": "othree",
  "scripts": {
    "test": "aladdin"
  }
}

重點是 scripts 那一塊,要讓npm test執行時會跑aladdin來啟動測試。這樣 Travis CI 就可以幫你跑測試了。

回到 phantom-jasmine,現在的狀況是 npm 的 phantom-jasmine 被搞爛了,我必須說 rlayte 搞出這狀況還蠻不負責任的,所以也 report 了個 issue,還好 npm 可以從本地目錄安裝:

sudo npm install -g /path/to/phantom-jasmine/

只是裝起來後,目前我反而還沒辦法讓原版的 phantom-jasmine 跑起來,可能下次有動力在繼續看問題在哪了吧。 目前我是只有在 robust-video 這個專案跑 Travis CI,有興趣的也可以直接去看看檔案怎樣放。

最後補充一下,不知道有沒有人注意到,迪士尼的阿拉丁電影裡面的公主,就叫做 Jasmine。