CodeceptJSを使ってみましたmmj blog

QAエンジニア MY
QAエンジニア MY
2020年08月11日

QAチームで自動テストの導入を検討しているのですが、CodeceptJS を使ってみて便利だなと感じたのでご紹介しようと思います。

CodeceptJSとは

Node.js で動作するテストするためのフレームワークで、ブラウザ操作ライブラリと組み合わせることでブラウザテストが実行できます。
今回は Chrome 上で動かすので、ブラウザ操作ライブラリに Puppeteer を使用します。
CodeceptJS

環境構築

・NodeJS v8.9 以上
・npm
まず上記をインストールし、npm を用いて CodeceptJS と Puppeteer をインストールすれば完了です。

テストコードを書いてみよう

「I.」から始まるちょっと独特なテストコードです。
たとえば、Google のページを表示したい場合は以下のように書きます。

I.amOnPage('https://www.google.co.jp/')

検索する文字「mmj」を入力し、検索したい場合は

I.fillField('検索', 'mmj')
I.click('Google 検索')


これだけの記述でOK!簡単です。

なぜこんな書き方で動くのかというと、Semantic Locatorsという機能があり、文字入力に使うメソッド ‘fillField’ の場合だと <input> <textarea> などの要素のうち、ラベルやプレースホルダに指定されたテキストを持つものを自動的に探してくれるからです。

‘click’ の場合も、<a> <button> <input type=”submit”> などのクリック可能な要素から、指定されたテキストを持つものを探してクリックしてくれます。

すごく便利ですね!
メソッドからも何をテストしようとしているのかなんとなくわかりますし、エンジニア経験のない方でも書けそうです。

もちろん、CSSやXpathを書いても動きます。

I.fillField({xpath: '//*[@id="tsf"]/div[2]/div[1]/div[1]/div/div[2]/input'}, 'マンスリーズ')
I.click('input[name="btnK"]')

動かしてみよう

弊社の自社サービス「MAN3’s管理システム(マンスリーズ)」で、京都駅から15分以内、乗り換えなしの物件を検索するというテストシナリオを作成して、動かしてみます。

Feature('CodeceptJSテスト');

Scenario('マンスリーズ検索シナリオ', async (I) => {

    I.amOnPage('https://man3s.jp/');                        // 「マンスリーズ」にアクセス

    I.click('駅名(かな可)を入力してください');              // 「最寄り駅」をクリック
    I.fillField('input[type="search"]', '京都');            // 検索エリアに「京都」と入力
    I.click(locate('li').withText('京都駅(キョウト)'));   // 「京都駅」をクリック

    I.selectOption('upper_limit', '15分以内');              // 所要時間「15分以内」を選択
    I.selectOption('transfer_count', '乗り換えなし');       // 乗り換え「乗り換えなし」を選択

    I.click('検索');                                        // 「検索」をクリック

    I.waitForText('検索結果', 3);                           // 「検索結果」が表示されるまで3秒待機
    I.saveScreenshot('search_kyoto.png');                   // スクリーンショットを取得する

});

このコードを search_test.js として保存し、コマンド実行すると

$ npx codeceptjs run search_test.js --steps

ブラウザが自動で起動し、テストコードを順次実行します。

正常終了しました。

所感

環境構築も簡単で、テストコードもわかりやすいので、すぐに理解して使うことができました。
良いツールであっても学習コストが高いとそれだけで導入へのハードルが上がってしまうので、学習コストの低さはとても魅力的に感じました。
まずは導入してみて効率化を図り、その後他のシステムにも横展開していくことができたらいいなと思っています。

2020年08月11日

QAエンジニア MY |

« »
このページのトップへ