きっかけ
最近UIを担当してるのですが、我ながらひどいコードで、テストコードを書いて下さっている方に非常にご迷惑をおかけしている現状。貴重な皆さんの時間を奪うのは申し訳ない...。
さらに、画面上レイアウトを変えてしまうと、e2eのコードもまた変えないといけなくなります。
ということで、すくなくともテストを書いて下さる側に、『UI上のここが変わってこういう動作を期待してます』ということが伝わるように、コミットの際にできるだけ簡単なテストコードを書いてみようと思い立ちました。
テストが早すぎて目がついていけない
上記の通り、なんちゃってe2e用のコードを書いてみたのですが、protractor(というかブラウザ）のテスト実施のスピードが早すぎて、目が追いつきません...。
いや、ブラウザとコードが判定してくれるはずなので問題は無いかもしれませんが、モーダルがちゃんと出て期待したメッセージもちゃんと出てるかとか、目で確認したいのですが、とにかく早くて目が追いつきません...。
ゆっくりさせる方法発見！
もうちょっとゆっくり進めてくれないかな...と切なく思っていたら、下記の投稿を見つけました。
上記のコードを参考に、簡単にテスト用コードを書いてみると、おかげさまで多少人間に優しい自動実行になってくれました。
JavaScript
/* AngularJSじゃないサイトでもprotractor使う場合のおまじない */
browser.ignoreSynchronization = true;
/* ここから */
origFn = browser.driver.controlFlow().execute;
browser.driver.controlFlow().execute = function() {
var args = arguments;
// 処理速度をゆっくりにする（exp. 100ms)
origFn.call(browser.driver.controlFlow(), function() {
return protractor.promise.delayed(100);
});
return origFn.apply(browser.driver.controlFlow(), args);
};
/* ここまで */
// 実際の処理
describe('これこれこういう画面にアクセス', function() {
beforeEach(function() {
targetUrl = '登録画面'
browser.get(browser.baseUrl + targetUrl);
});
it('登録フォームのボタンが無効化されている', function() {
// 現在のパス確認
expect(browser.getCurrentUrl()).toContain('登録画面');
// まだ何も埋めてないので、Submitボタンは無効化されている
target = browser.element(By.id("btnSubmit"));
expect(target.getAttribute('disabled')).toEqual('true');
});
});
各処理で、browser.sleep(2000); みたいなものを挟まなくても良くなっています。
AngularJSのようなSPAだと、もともと画面遷移が早いため、自動化すると本当にあっという間に流れてしまいますので、今回はこの方法で助かりました。
ほかにも良い方法があれば、まだまだ勉強中ですので、教えて頂けると幸いです。