Appiumを使って、リグレッションテストを自動化する(Webサイト操作編)

みなさんこんにちは!、Biz-Devチームの山口です。

今回の記事は前回紹介した「Appiumを使って、リグレッションテストを自動化する」の続きで、Webサイトの操作について紹介していきます。 OPTiM TECH BLOG Advent Calendar 2020 12/21 の記事です。

前回の記事はこちらをどうぞ!

背景

Optimal Bizは管理サイトで設定内容を作成・変更し、それを各端末にインストールされているクライアントアプリに反映させることで端末の管理を行うことができます。この管理サイトでの操作も自動化することができれば、より多くの項目を自動化することができます。 f:id:optim-tech:20201208161851p:plain

自動化構成

リグレッションテストの自動化は下の画像の流れで実装します。 検証するAndroid端末上で検証アプリとWebサイトの両方を動かします。 前回の内容ではAndroidアプリの操作を自動化する方法を紹介しましたが、今回は上の管理サイトの操作を自動化するために実装を行います。

f:id:optim-tech:20201208161945p:plain

Selenium

AppiumはWebブラウザの自動テストを実行する際に使用される「Selenium WebDriver」から派生したものであるため、AppiumでもWebブラウザでの操作を行うことができます。

ただ操作方法は前回紹介した方法とは異なり、Seleniumに準拠した操作方法に変わります。(大きな違いはありませんが、要素の取得方法などが異なっています。-Selenium公式ページ)

Webページを操作するための準備

AppiumでWebページを操作するためにはWebドライバを用意すれば操作を行うことができます。 今回はChromeを使ってWebページを操作します。

こちらのサイトからChromeのバージョンにあったドライバを選択しダウンロードします。保存先のフォルダはどこに保存しても大丈夫です。(Pathが短くなる場所に保存しておくと良いと思います)

これだけの操作で大丈夫です!

テストコードの作成

Webページを触る場合は少し面倒ですが、Webページの構成を直接みる必要があります。 操作したいWebページにアクセスし、「F12」を押し、デベロッパーツールを起動します。

f:id:optim-tech:20201208161845p:plain

例えばテックブログのタイトルの要素を取りたいなと思った場合、要素を展開して、該当する要素を見つけ出します

Webページを操作するサンプルコードの作成

今回はこのテックブログから自分の書いた記事にアクセスするプログラムを作成します。

処理の説明

処理の流れとしては、以下の通りになります

  1. テックブログにアクセス
  2. タグが <a></a>で囲われている要素をすべて取得する
  3. 要素を検索し、タイトルが一致したものがあればクリックし、記事へアクセスする。ない場合は「次のページ」のボタンをクリックし、次のページにアクセスする
  4. アクセス後はページタイトルを取得し、表示する

サンプルコード

sample.rb

require 'rubygems'
require 'appium_lib'

def func(title)
    # ChromeDriver 開始
    driver = Appium::Driver.new(
        {
            caps: {
                "deviceName" => "Android Device",
                "browserName" => "Chrome",
                "platformName" => "Android",
                "newCommandTimeout" => 30,
                "chromedriverExecutable" => "C:\\workspace\\appium-andoroid\\other\\driver\\chromedriver.exe", # chromedriverまでのPATHを指定,環境によって変更する
                "chromeOptions" => {'w3c' => false }, # 設定をしていない場合、find_elementの設定の仕方が大きく異なります
                "unicodeKeyboard" => true,
                "resetKeyboard" => true
            },
            appium_lib: {
                wait: 30
            }
        }, true).start_driver

    # webページにアクセス
    driver.navigate.to "https://tech-blog.optim.co.jp/"
    flag = true
    while flag do
        # <a></a>のタグで囲まれている要素を取得する
        elements = driver.find_elements(:tag_name,'a')
        # 上から順に要素を見ていくのでfor文で回す
        for element in elements do
            # タイトルが一致しているものがあればクリック
            if element.text == title then
                element.click
                flag = false
                break
            end
            # ない場合は「次のページ」のボタンを押す
            if element.text == "次のページ" then
                element.click
                sleep 5
                break
            end
        end
    end
    # 確認のため、webページのタイトルを取得
    result = driver.title
    sleep 5
    # ページを閉じる
    driver.close
    # ドライバを破棄
    driver.quit

    return result
end

if $0 == __FILE__
    p func(ARGV[0])
end

実行結果

>ruby sample.rb Appiumを使って、リグレッションテストを自動化する
"Appiumを使って、リグレッションテストを自動化する - OPTiM TECH BLOG"

f:id:optim-tech:20201208164657g:plain

まとめ

今回はAppiumでWebサイトを操作する際の環境構築やコードの作成の仕方などを紹介しました。 Webサイトを操作ができるようになれば、自動化の幅も広がりより多様なテストを行うことができます。

オプティムではタスクの自動化に興味があるエンジニアを募集しています。