Appium

モバイルアプリのテストをAppium(WebdriverIO)を使って操作するための環境構築

投稿日:

Appiumを使ってモバイルアプリのテストを実行するための環境を構築してみます。
今回テストで使った環境は以下のレポジトリにプッシュしてあります。
webdriverio-typescript

Yarnのインストール

JavaScriptのパッケージマネージャーにYarnを使いますのでインストールします。
今回はグローバルにインストールしています。

# Yarnをグローバルにインストール
npm install -g yarn

# バージョンが表示されればOK
yarn -v

npmとコマンドが若干違いますのでyarnを使ってみたを随時参照するとよいと思います。

AppiumとWebdriverIOのインストール

適当にプロジェクトディレクトリを作成しAppiumとWebdriverIOをインストールします。
AppiumはAppium-Desktopという非常に便利なアプリがあるのですがAppium自体はnodejsで起動できますので今回はアプリではなくパッケージとしてインストールします。
ただAppium-Desktopは便利なのでインストールしておくとよいと思います。

# AppiumとWebdriverIOのインストール
yarn add appium --dev
yarn add webdriverio --dev
# テスト実行時にAppiumを起動してくれる(テスト前にAppiumを起動しておかなくてもよくなる)
yarn add wdio-appium-service --dev

# Testing環境をインストール
yarn add mocha --dev
yarn add chai --dev
yarn add wdio-mocha-framework --dev

# レポーターをインストールする
yarn add wdio-spec-reporter --dev

動作確認のため起動する

一旦この状態で端末を操作してみます。
AndroidのエミュレーターにAppiumのテスト用アプリをインストールしてアプリを起動してみます。
テスト用のアプリはAppiumのサンプルコードで使われているアプリを使用します。
エミュレーターは事前に作成しておくか実機でも問題ないです。
adb devicesで端末idを調べておきます。
テストに使用するアプリはAppiumが自動的にインストールしてくれるので事前にインストールする必要はありません。

WebdriberIOの設定ファイルを準備します。

mkdir config
vim config/wdio.config.js

設定ファイルはconfig/wdio.config.jsとしますがAndroidエミュレーターもしくは実機によって設定を変更する必要があります。
capabilitiesのplatformVersionとdeviceNameは随時変更してください。


exports.config = {
    debug: false,
    specs: [
        './test/specs/*.js',
    ],

    reporters: ['spec'],
    host: '127.0.0.1',
    port: 4730,

    maxInstances: 1,

    capabilities: [
        {
            appiumVersion: '1.8.1',
            browserName: 'Android-Emulator',
            platformName: 'Android',
            app: 'https://github.com/appium/sample-code/blob/master/sample-code/apps/ApiDemos/bin/ApiDemos-debug.apk?raw=true',
            platformVersion: '8.1',
            deviceName: 'emulator-5554',
            waitforTimeout: 30 * 60000,
            commandTimeout: 30 * 60000,
            newCommandTimeout: 30 * 60000,
        }
    ],

    services: ['appium'],
    appium: {
        waitStartTime: 6000,
        waitforTimeout: 30 * 60000,
        command: 'appium',
        logFileName: 'appium.log',
        args: {
            address: '127.0.0.1',
            port: 4730,
            commandTimeout: 30 * 60000,
            sessionOverride: true,
            debugLogSpacing: true
        }
    },

    logLevel: 'silent',
    coloredLogs: true,
    framework: 'mocha',
    mochaOpts: {
        ui: 'bdd'
    },
    onPrepare: function () {
        console.log('Testing Started');
    },
    onComplete: function () {
        console.log('Testing Finished');
    }
};

次にテスト用のspecファイルを作成します。
TypeScriptで作成し最終的にJavaScriptにトランスパイルするのですが、まだ設定してないので動作確認用のJavaScriptファイルを準備します。

vim test.js

test.js


describe('first', () => {
  it('testing', () => {
    browser.pause(3000);
  });
});

ではいよいよ起動してみます。

yarn wdio config/wdio.config.js --spec test.js

起動して何やらAPI Demosという画面が表示されたと思います。

TypeScriptを導入する

続いてTypeScriptを導入します。
今回はTypeScriptで書いてトランスパイルしてtest/specsディレクトリに出力します。

yarn add typescript --dev

# 型定義をインストールする
yarn add @types/chai --dev
yarn add @types/mocha --dev
yarn add @types/webdriverio --dev

TypeScriptの設定ファイルを作ります。

vim tsconfig.json

tsconfig.json


{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "outDir": "test/"
  },
  "exclude": [
    "node_modules"
  ],
  "compileOnSave": false
}

続いてTypeScriptでテストコードを書きます。
AppiumのGetting Startedで書かれているコードを実行してみます。
テストコードはsrc/specs/ディレクトリ以下に書きます。
今回はdemo.tsとしました。
またtsファイルはVisual Studio Code等で補完ができるようになっていると思います。

mkdir -p src/specs
vim src/specs/demo.ts

describe('api demos', () => {
    it('open Alert Dialogs', () => {
        browser.click(`~App`)
            .click(`~Alert Dialogs`)
            .pause(3000);
    });
});

続いてトランスパイルします。

yarn tsc

# demo.jsが生成されている
ls -la test/

では実行してみます。

yarn wdio config/wdio.config.js --spec test/demo.js

画面遷移できることが確認できたと思います。

まとめ

今回はAppiumをつかってモバイルネイティブアプリのテストを実行するための環境を作りました。
Appiumは各言語ごとにクライアントが用意されております。
選択肢があることは迷うことにはなりますが無いよりはよいことだと思います。
今回はサンプル的なアプリですが、いろいろできますのでまた書きたいと思います。

参考

WebdriverIO_Typescript
appium-webdriverio-typescript

-Appium

執筆者:


comment

メールアドレスが公開されることはありません。

関連記事

関連記事はありませんでした