Laravel5.4 Duskを試してみる!

はじめに

たまには、ブログも書かないと。
まぁいろいろとネタは書き溜めているんだけど、吐き出すのがめんどくさい。でもがんばるよ!!

今回のネタは「Laravel Dusk」(ららべる だーすく:夕暮れ)ブラウザの自動操作をしてくれる凄いやつ。

予算あるならテスト自動化!無いんなら目視!
永続的プロジェクトならテスト自動化!非永続なら目視!
まあいろいろと考え方はありますわな。

ということで、試してみる!

試してみる環境

macOS Sierra 10.12.6
PHP 7.0.9
Laravel 5.4
MariaDB 10.1.16
※PHPやMariaDBはXAMPP7.0.9-0を使用。

参考にしたURL

https://readouble.com/laravel/5.4/ja/dusk.html
http://qiita.com/amymd/items/0a5f2705e29972d0d22e

まずは準備

Laravelのプロジェクト作成やDBの準備ははしょる。

認証系の動作が見れれば良いから、Laravel標準の認証を使用。

$ php artisan make:auth
Migration table created successfully.

                                                                                                      
  [Illuminate\Database\QueryException]                                                                
  SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too long; max key length  
   is 767 bytes (SQL: alter table `users` add unique `users_email_unique`(`email`))                   
                                                                                                      

                                                                                                      
  [PDOException]                                                                                      
  SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too long; max key length  
   is 767 bytes

あれ?調べた結果、XAMPPについてるMariaDBではstringのデフォルトサイズを変更してあげないとダメっぽい。

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Illuminate\Support\Facades\Schema;    ← この行を追加

class AppServiceProvider extends ServiceProvider
{
    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
    // マイグレーション時に以下のエラーが発生するため、stringのサイズは191文字をデフォルトとする。
    // SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too long; max key length is 767 bytes
    // 参考)https://teratail.com/questions/63441
    Schema::defaultStringLength(191);   ← この行を追加
    }
    :
    :
    :

再度実行すれば大丈夫だと思う。これで、ブラウザで表示するとログインやらユーザーの登録やらができるようになる。

Duskインストール

$ composer require --dev laravel/dusk
Using version^2.0forlaravel/dusk
./composer.json has been updated
Loading composer repositories with package information
Updating dependencies (including require-dev)
Your requirements could not be resolved to an installable set of packages.

  Problem 1
    - Installation request for laravel/dusk ^2.0 -> satisfiable by laravel/dusk[v2.0.0].
    - laravel/dusk v2.0.0 requires illuminate/console ~5.5 -> satisfiable by illuminate/console[5.5.x-dev] but these conflict with your requirements or minimum-stability.


Installation failed, reverting ./composer.json to its original content.

うーん。Laravel5.5リリースの影響で使えない…っぽい?
じゃあバージョン指定してインストール。

$ composer require --dev laravel/dusk ^1.1
./composer.json has been updated
Loading composer repositories with package information
Updating dependencies (including require-dev)
Package operations: 2 installs, 0 updates, 0 removals
  - Installingfacebook/webdriver(1.4.1) Downloading:100%       
  - Installinglaravel/dusk(v1.1.0) Downloading:100%       
Writing lock file
Generating optimized autoload files
> Illuminate\Foundation\ComposerScripts::postUpdate
> php artisan optimize
Generating optimized class loader
The compiled services file has been removed.

めっさ遅い…インストールできた。

サービスプロバイダを以下の感じで登録する。

<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Illuminate\Support\Facades\Schema;
use Laravel\Dusk\DuskServiceProvider;    ←追加

class AppServiceProvider extends ServiceProvider
{
    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
        // マイグレーション時に以下のエラーが発生するため、stringのサイズは191文字をデフォルトとする。
        // SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too long; max key length is 767 bytes
        // 参考)https://teratail.com/questions/63441
        Schema::defaultStringLength(191);
    }

    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        if ($this->app->environment('local', 'testing')) {   ←追加
            $this->app->register(DuskServiceProvider::class);←追加
        }                                                    ←追加
    }
}

local環境とtesting環境のときだけDuskを有効にするみたいな感じ。
まあ準備完了!次にDuskをインストールする。

$ php artisan dusk:install
Dusk scaffolding installed successfully.
/tests/Browser ってディレクトリができる。
/tests/DuskTestCase.php ってファイルができる。

これでインストール作業はおしまい。

とりあえず動かしてみる。

以下のファイルを修正して、

protectedfunctiondriver()
{
    returnRemoteWebDriver::create(
    //'http://localhost:9515', DesiredCapabilities::chrome()
    'http://localhost/xxxxx/', DesiredCapabilities::chrome()
);
}

とりあえず動かしてみる!

$ php artisan dusk

エラーが出る!

DuskTestCase.phpは修正したらダメだった。
もとに戻して、
$ php artisan dusk
PHPUnit 5.7.21 by Sebastian Bergmann and contributors.

.                                                                   1 / 1 (100%)

Time: 2.91 seconds, Memory: 10.00MB

OK (1 test, 1 assertion)
よかった。chromeが一瞬起動しましたよ!よかったよかった。

 

テストシナリオ

ユーザー登録→ホーム→ログアウト→ログイン
まぁこんな感じで。

<?php

namespace Tests\Browser;

use Tests\DuskTestCase;
use Laravel\Dusk\Browser;
use Illuminate\Foundation\Testing\DatabaseMigrations;

use DB;

class LoginTest extends DuskTestCase
{
	/**
	 * A Dusk test example.
	 *
	 * @return void
	 */
	public function testExample()
	{

		DB::table('users')->truncate();	// データ全削除
		$this->browse(function ($browser) {
			// ユーザー登録
			$browser->visit('/register')
			->type('name', 'テスト 太郎')
			->type('email', 'test_taro@regrex.jp')
			->type('password', '1qaz2wsx')
			->type('password_confirmation', '1qaz2wsx')
			->press('Register');

			$browser->pause(1000);	// 待機!
			$browser->assertPathIs('/xxxxx/home');	// パスの部分全てで一致しないとダメっぽい。

			$browser->pause(1000);	// 待機!
			$browser->clickLink('Logout');
			$browser->assertPathIs('/xxxxx/');

			$browser->pause(1000);	// 待機!
			$browser->clickLink('Login');
			$browser->assertPathIs('/xxxxx/login');

			$browser->type('email', 'test_taro@regrex.jp')
			->type('password', '1qaz2wsx')
			->press('Login');
			$browser->assertPathIs('/xxxxx/home');

			$browser->pause(3000);	// 待機!


			// 異常系
			$browser->clickLink('Logout');
			$browser->clickLink('Login');
			$browser->type('email', 'aa@aa.com')
			->type('password', 'aa')
			->press('Login');

			$browser->assertSee('エラーメッセージ');
			$browser->pause(10000);	// 待機!

		});
	}
}

ってな感じで作って、以下を実行するとchromeが起動して自動で動いてくれる。

$ php artisan dusk

テストロジック作るのが面倒だけど、正常系よりも異常系の方がどうなるかが重要なんで、積極的に取り入れようかなぁ…

今後の課題

  • テストDBへの切り替え
  • 他のブラウザでのやり方