kakakakakku blog

Weekly Tech Blog: Keep on Learning!

Autify で「JS ステップ」と return を組み合わせて計算結果を入力値に使う

昨日の記事では Autifiy「データ機能」を試した.テストデータのパターンを増やす場合に便利に使える.

kakakakakku.hatenablog.com

さらに E2E テストを検討していくと,「データ機能」のようにパターンを決めるのではなく「シナリオ実行時に動的に入力値を決めたい」という場面もある.例えば「現在時刻(シナリオ実行時刻)に依存したテスト」「乱数を使ったテスト」「リストからランダムに1個選んで使うテスト」など.今回は Autify の「JS ステップ機能」を使って「シナリオ実行時に計算結果を入力値に使う機能」を試す.

「JS ステップ機能」と return を組み合わせる

Autify の「JS ステップ機能」を使うと,任意の要素をクリックするなど「JavaScript コードを自由に実装できる」ことは既に試した.

kakakakakku.hatenablog.com

さらに Autify には「JavaScript で return をした計算結果を次のステップの入力値として使える」という機能がある.個人的には Autify で未サポートな挙動を実現する場合など,シナリオを細かく実装するために幅広く使える機能だと思う.

1.「シナリオ」を作る

シナリオ「kakakakakku blog 検索シナリオ(ランダム)」を作る.基本的な操作は今までと重複するため割愛する.

2. レコーディングをする

今までと同じようにレコーディングをする.今回はシンプルに以下のステップとする.

  1. 「kakakakakku blog」にアクセスする
  2. キーワード「github」で記事を検索する

f:id:kakku22:20200506152543p:plain

3. JavaScript を実装する

検索ステップの前で「JS ステップを挿入」を選ぶ.今回は以下の JavaScript コードを実装する.意味としては「プログラミング言語配列(5種類)からランダムに1個選ぶ」で,ポイントは「2行目で計算結果を return している点」となる.

var languages = ['Python', 'Go', 'Ruby', 'PHP', 'Java'];
return languages[Math.floor(Math.random() * languages.length)];

最終的に以下のような画面になる.

f:id:kakku22:20200506232041p:plain

return を実装したことにより,検索ステップの「入力値」として「他のステップから取得」を選べるようになる.計算結果(プログラミング言語名)を入力値に使えるという意味になる.最終的に以下のようなシナリオになる.

  1. 「kakakakakku blog」にアクセスする
  2. キーワード ${プログラミング言語名} で記事を検索する
    • ${プログラミング言語名}「候補リスト (Python, Go, Ruby, PHP, Java)」からランダムに選択する

f:id:kakku22:20200506153826p:plain

4.「シナリオ」を実行する

シナリオを繰り返し実行すると以下のような結果が得られる.

Java が選ばれた(Autify スクリーンショット)

f:id:kakku22:20200506155346p:plain

Ruby が選ばれた(Autify スクリーンショット)

f:id:kakku22:20200506155400p:plain

PHP が選ばれた(Autify スクリーンショット)

f:id:kakku22:20200506155538p:plain

Autify FAQs

Autify GitHub : autify-javascript-snippets

以下のリポジトリに「JS ステップ機能」に使える JavaScript サンプルが公開されている.例えば generate-random-value.js を読むと「時刻」「乱数」return する実装になっている.見てみると良いかと!

github.com

まとめ

今回は Autify を使って「シナリオ実行時に計算結果を入力値に使う機能」を試した.JavaScript で return をした計算結果を次のステップの入力値として使えるという仕組みは幅広く使えるため,Autify を使うなら覚えておくべき機能だと思う!

Autify 紹介記事