php（CakePHP）+ seleniumでテスト自動化環境を構築する

概要

プログラミング言語でChromeなどのブラウザを操作することができます。

ブラウザを操作する命令セットがseleniumにパッケージとしてまとめられており、それを通してブラウザを操作するための、Chrome用ドライバを合わせて導入します。

seleniumは様々なプログラミング言語、ブラウザをサポートしていますが、ここではphp（CakePHP）でchromeを操作するための一連の手順を説明します。

環境情報

• XAMPP 8.0.6
• php 8.0.6
• CakePHP 4.2.6
• php-webdriver/webdriver 1.11.1
• GoogleChrome 92.0.4515.107
• ChromeDriver 92.0.4515.107

php（CakePHP）+ seleniumの環境を構築する

php-webdriver/webdriverのインストール

composer require --dev php-webdriver/webdriver
※ --dev：開発環境のみに導入

Windows用 Chrome ドライバを DL

ChromeDriverダウンロードサイト（https://sites.google.com/a/chromium.org/chromedriver/downloads）

bakeコマンドでテストコマンド用ファイルを作成する

bin\cake bake command Hello --no-test
※ --no-test：単体テスト用ファイルを作成しない

src\Command以下にHelloCommand.phpが作成されます。

画像用フォルダを作成しておく

src\Command以下にImagesフォルダを作成します。

HelloCommand.phpを編集する

HelloCommand.phpの中身を以下のように書き換えます。

<?php
declare(strict_types=1);

namespace App\Command;

use Cake\Command\Command;
use Cake\Console\Arguments;
use Cake\Console\ConsoleIo;
use Cake\Console\ConsoleOptionParser;
use Facebook\WebDriver\Chrome\ChromeDriver;
use Facebook\WebDriver\WebDriverBy;
use Facebook\WebDriver\WebDriverExpectedCondition;

/**
 * Hello command.
 */
class HelloCommand extends Command
{
    /**
     * Hook method for defining this command's option parser.
     *
     * @see https://book.cakephp.org/4/en/console-commands/commands.html#defining-arguments-and-options
     * @param \Cake\Console\ConsoleOptionParser $parser The parser to be defined
     * @return \Cake\Console\ConsoleOptionParser The built parser.
     */
    public function buildOptionParser(ConsoleOptionParser $parser): ConsoleOptionParser
    {
        $parser = parent::buildOptionParser($parser);

        return $parser;
    }

    /**
     * Implement this method with your command's logic.
     *
     * @param \Cake\Console\Arguments $args The command arguments.
     * @param \Cake\Console\ConsoleIo $io The console io
     * @return null|void|int The exit code or null for success
     */
    public function execute(Arguments $args, ConsoleIo $io)
    {
        // 環境変数にドライバパスを設定
        putenv('webdriver.chrome.driver=C:\chromedriver.exe');

        // Chromeを起動
        $driver = ChromeDriver::start();

	// ウィンドウサイズを最大化
	$driver->manage()->window()->maximize();

	// 表示したいWEBサイトへ遷移
        $driver->get("https://shojinblog.com/");

	// 検索ボックスの操作
	$driver
		->findElement(WebDriverBy::name('s')) // 検索Boxを取得
		->sendKeys('cakephp-faker')           // 検索Boxに"cakephp-faker"を入力
		->submit();                           // 検索を実行

	// ページ遷移後、指定タイトルになるまで待機
	// 指定タイトルにならずに5秒経過するとエラーとなる
	$driver->wait(5)->until(
		WebDriverExpectedCondition::titleIs('cakephp-faker | shojinblog.com')
	);

	// スクリーンショットを保存（src\Command\Images以下に保存される）
        $file = __DIR__ . '/Images/capture.png';
        $driver->takeScreenshot($file);

	// Chromeを終了
        $driver->close();
    }
}

1. Chromeの起動
2. ウィンドウサイズの最大化
3. 表示したいWEBサイトへの遷移
4. 検索ボックスの操作
5. ページ遷移が完了するまで待機
6. スクリーンショットを保存

上の一連の流れをプログラムで実現しています。

ブラウザ自動操作コマンドを実行してみる

以下のコマンドを実行します。

bin\cake Hello

以下は、実行した際の動画です。

※ 操作を見やすくするため、プログラム内でsleep関数を実行しています。実際は一瞬で操作が完了します。

まとめ

プログラムを応用することで、検証したいWEBページを開き、フォームへの入力を行い、データの登録処理を行う。さらに、データベース管理ソフトウェアのPhpMyAdminを開き、SQLを実行し、新規データが登録されていることを確認できるページを開き、スクリーンショットを撮って終了。などの一連の流れをプログラムで実現することができます。

一度、プログラムを作ってしまえば、他のページのテストプログラムを作成する際もコピペから改変することで、すぐに作ることができてしまいますし、複数のブラウザでJavaScriptの動作検証をしたり、レスポンスデザインのレイアウトチェックをする際に、1プログラムで各ブラウザを呼び出すことができるなど、メリットづくしだと考えています。

今後、実際に検証でそのまま使える形でプログラムのソースコードを公開したいと考えていますので、乞うご期待です！それでは、php（CakePHP）+seleniumでテスト自動化環境を構築する、のご紹介でした。