Autifyの2022年1月25日のリリースで、Autify公式のGitHub Actions・Circle CI Orbがリリースされました。
私自身GitHub ActionsもCircle CI Orbあまり触ったことがないので、練習がてら触って、ちゃんと動いた方法を書いておきます。
Atutifyは基本的に公式のドキュメントが充実していますが、
少し技術的なこと（JSステップとかCI/CDツールとの連携とか）になると記載の仕方が、触ったことがない人にとっては少しだけ難しい気がします…
※あくまで個人の感想です。
なので公式ドキュメントを見て、はて？と思った方がここを見て解決できればいいな、と思います。

今回はGitHub Actionsとの連携についてです。
CircleCIは別の機会に書きます。

はじめに

実現したこと

対象のリポジトリにPushがある毎にAutifyのテストプランを動かす。

環境について

Autifyを使用するには下記を準備する必要があります。

• Autifyのユーザー
• Google Chromeと拡張機能「Autify Recorder」

これらについては公式ページが詳しく書いていますので、ユーザー登録と環境セットアップをご確認いただくのが良いと思います。

テストプランについて

テストプランについても動かしたいものを作成しておいてください。
今回私はYamamotoTestというテストプランを作成し、こちらを動かしていこうと思います。

GitHubについて

今回はプライベートリポジトリを作成しました。
このリポジトリにpushがあったら、Autifyのテストが走る感じです。

手順

AutifyをGitHub Actionsと連携する手順はざっくりと下記のような手順です。

1. Autifyでパーソナルアクセストークンを生成する（Autify側の準備）
2. ymlファイルを作成する（GitHub Actions側の準備）
3. 動かしてみる

1. Autifyのパーソナルアクセストークンを生成する

この発行はAutifyのアカウント設定 > 個人設定のページから可能です。
個人設定の真ん中に新しいパーソナルアクセストークンを生成がありますので、こちらに任意の名前を入力し、作成ボタンを押下します。
そうするとパーソナルアクセストークンが生成されます。
これは生成した際に赤字で書かれている通り、ページのリロードやページ移動してしまうと見れなくなってしまうため、
必ずどこかにメモをして、保管してください。

発行されたあとはこんな感じになります。

これでAutify側の準備はOKです。

2. ymlファイルを作成する

次に下記のようなymlファイルを準備します。
準備はMyRepoの直下に\.github\workflowsというフォルダを自分で作成し、その中にymlファイルを格納しました。

name: "example"
# トリガーを決める
on: [push]
jobs:
  test:
    runs-on: ubuntu-latest
    steps:
      - name: Funtional test
        id: functional-test
        uses: autifyhq/[email protected]
        with:
          autify_for_web_api_token: #1.で生成したパーソナルアクセストークンを記載
          test_plan_id: # テストプランのIDを記載※

※テストプランのIDについて
作成したテストプランを選択し、テストプランの詳細を決めるページに飛ぶ。
その際のURLの末尾にある数字がテストプランのIDになる。
今回の私のテストプランだと129932。

上記が記載できて、リポジトリにpushできたらOKです。

3. 動かしてみる

試しに適当なテキストなり、何かを作成し、pushしてみましょう。
pushしたら、Autifyのテスト結果を見に行きましょう。
設定したテストプランが動いていたらOKです。