Category: test

[CI/CD] testcafe/nightwatch.js 總是發生 element not visible/found

最近剛好同事也遇到在 circleCI 上使用 chrome 跑 testcafe 總是發生以下的錯誤 The element that matches the specified selector is not visible. 但在本機使用 chrome 卻總是正常的執行,無任何的錯誤. 其實這個錯誤通常蠻常見於 RWD 的網站,通常都是由於錯誤的 screen size 導致部分 element 可能因為 viewport 過小而被隱藏. 不管是 testcafe/nightwatch.js 或是其他 end-to-end test 都能找到不少 issue,像是 testcafe: https://github.com/DevExpress/testcafe/issues/1988 nightwatch.js: https://stackoverflow.com/questions/43583715/running-nightwatch-js-tests-via-jenkins-windows-size-issue 很大的共通點都是跑在 jenkins/circleCI/travisCI,這些你看不到 GUI 的機器上 XD 這邊提供幾個方向和建議供大家參考及排查: CI/CD 機器上可能不支援 GUI 的 browser以 chrome 為例子請參考 doc […]

[test] Nightwatch.js 如何使用 puppeteer 做測試

還記得之前曾經記錄過 Nightwach.js 血淚史,那時候最大的問題是以 Nightwatch.js 的架構 都是要經過 selenium 去串各 browser 的 web driver 導致排查時的錯誤原因可能會發生在以下三個點 Nightwath.js Selenium Web Driver (chrome driver, gecko driver, ie driver …. .etc.) 導致排查上會需要層層檢查 (血淚) 因此後來在 chrome headless browser 釋出後,我們想試著是否能直接使用 chrome driver 串接 puppeteer 減少 selenium 這層的排查工作,另一方面也可以減少在非 GUI 的機器上跑的 web driver 不同而導致的差異性. 因此我們將 nightwath.js 的設定檔更改如下 將設定分別分為 dev 與 default,差別如下 dev: CI/CD 機器非 GUI […]

[test] Nightwatch.js 如何每次執行測試都是全新的 session

之前寫過 Nightwatch.js 的 debug 血淚史,前一陣子有個需求是想用 Nightwatch.js來做各瀏覽器的速度測試,因此期望每次開啟的 session 都是個乾淨的 session (不要有 cache, cookie 等等…) 在這紀錄一下,如何設定各 driver 每次開啟都是全新的 session 前情提要: 本篇使用 [email protected] ((3.5.0以上可能會有不同的問題… 以下為 nightwatch 設定檔(nightwatch.json) 的 test_settings 部分 IE8 以上 “ie”: { “desiredCapabilities”: { “browserName” : “internet explorer”, “javascriptEnabled”: true, “acceptSslCerts”: true, “ie.ensureCleanSession”: true } } Safari “safari”: { “desiredCapabilities” : { “browserName” : “safari”, “javascriptEnabled” […]

[test] Nightwatch.js debug 血淚史

前情提要: 本篇使用 [email protected] ((3.5.0以上會有不同的問題… 使用 Nightwatch.js 寫前端的 E2E test一段時間了…踩了不少雷 Nightwatch 底下還是使用 selenium 與 支援各瀏覽器的 webdriver ,其實大多狀況都是發生在各 web driver 跟 selenium….啊(嘆~ 來記錄一下使用 Nightwatch.js 遇到的幾個問題~ selenium: Error retrieving a new session from the selenium server Connection refused! Is selenium server started? …. 最常出現以上這個訊息,可以先試著單獨開啟 selenium 在預設 port 4444,透過瀏覽器手動創建 session 確認 selenium 有正常運作。 java -jar selenium-server-standalone-{VERSION}.jar 另外,如果要透過 nightwatch.js 自動開啟 selenium,記得要將 nightwatch.json 設定檔中的 selectium start_process 設為 […]

[test] 單元測試的好幫手 rewire,讓你更容易測試 private 方法及變數

前一陣子在寫單元測試(unit test)時,遇到一些問題,經過同事的提點,看到了 rewire 這個 github repo 當在寫測試時,我們可能會分許多檔案去管理我們的模組,然而模組內可能有一些 private 的方法,這時候如果想測試模組內的 private 方法該如何測試呢? 以往可能的作法: 設定環境變數(例如:test: true),在測試環境時才 export prviate 方法。 但 rewire 這個 npm package 提供一層更方便測試 private 的方法。 接下來看看實際用法吧~ 比如我們有 test.js index.js 則會 require(‘test.js’); 這個模組 當我們要寫 unit test 時會發現 test.js 的 add() 因為沒有 export 所以無法被測試,或是當在測試 test 模組時,也沒辦法把 add 做 stub(因為 js 在 function 會是 call by value) 這時候我們可以使用 rewire […]