モバイルアプリケーション用
WebdriverIOテストをApp Percyと統合する
統合の前に、App PercyのWebdriverIO用サンプルビルドチュートリアルをご覧ください。テストスイートをBrowserStack App Percyと統合します。統合手順の概要は次のとおりです。
ステップ1:Percyダッシュボードで新しいアプリプロジェクトを作成する
Percyにサインインし、新しいアプリタイプのプロジェクトを作成します。プロジェクトを作成すると、`PERCY_TOKEN`環境変数が表示されます。Percyは、スクリーンショットをアップロードする組織とプロジェクトを知るために`PERCY_TOKEN`を使用します。次の手順では、この`PERCY_TOKEN`が必要になります。
ステップ2:プロジェクトトークンを環境変数として設定する
PERCY_TOKENを環境変数として設定するには、以下のコマンドを実行します。
export PERCY_TOKEN="<your token here>" // macOS or Linux
$Env:PERCY_TOKEN="<your token here>" // Windows PowerShell
set PERCY_TOKEN="<your token here>" // Windows CMD
ステップ3:Percyパッケージをインストールする
テストスイートの統合環境を構築するために必要なコンポーネントをインストールします。依存関係をインストールするには、次のコマンドを実行します。
npm install --save-dev @percy/cli
ステップ4:依存関係をインストールする
Percy Appiumアプリをインストールします
npm install --save-dev @percy/appium-app
ステップ5:テストスクリプトを更新する
コードに@percy/appium-appをインポートしてください。
percyScreenshot関数を使用したテスト例を以下に示します。スクリーンショットを撮る必要がある場合は、この関数を使用してください。
import percyScreenshot from '@percy/appium-app';
describe('Appium webdriverio test example', function() {
it('takes a screenshot', async () => {
await percyScreenshot('Appium JS example');
});
});
必要な引数をpercyScreenshotメソッドに渡しています。
screenshotメソッドの引数は次のとおりです。
percyScreenshot(driver, name[, options])
ステップ6:テストスクリプトを実行する
`percy app:exec`を使用してテストを実行します。
percyアプリを使用できない場合:execコマンド、またはIDEの実行オプションを使用してテストを実行することを希望する場合は、percy app:execを使用できます:スタートとpercy app:exec:停止コマンド。詳細については、Percyの実行をご覧ください。
$ percy app:exec -- appium test command
このコマンドは、Percyを起動し、新しいPercyビルドを作成し、スナップショットを取得してプロジェクトにアップロードし、Percyを停止します。
[percy] Percy has started!
[percy] Created build #1: https://percy.io/[your-project]
[percy] Snapshot taken "Appium WebdriverIO Example"
[percy] Stopping percy...
[percy] Finalized build #1: https://percy.io/[your-project]
[percy] Done!
詳細については、以下のページをご覧ください:
- WebdriverIOテストをPercyと統合する
- 環境変数ページ
- BrowserStack Automateを使用している場合は、BrowserStack SDKを使用して統合します。
リソース | 説明 |
---|---|
公式ドキュメント | App PercyのWebdriverIOドキュメント |
サンプルビルド - チュートリアル | App PercyのWebdriverIOチュートリアル |
公式ビデオ | App Percyを使用したビジュアルテスト |
ブログ | App Percyのご紹介:ネイティブアプリ向けAI搭載自動ビジュアルテストプラットフォーム |