利用可能なアサーション

Dusk は、利用可能な一連のアサーション メソッドを提供します。すべてのアサーションは次のとおりです:

ページ タイトルが指定されたテキストと一致することをアサートします。

// HTML...
<profile dusk="profile-component"></profile>
// 定义组件...
Vue.component('profile', {
    template: '<div>{{ user.name }}</div>',
    data: function () { 
               return {
                         user: {
                                  name: 'Taylor' 
                                  }        
                           };    
                      }
              });

##assertTitleContains

/**
 * 一个简单的 Vue 测试例子。
 *
 * @return void
 */
 public function testVue(){ 
    $this->browse(function (Browser $browser) {    
        $browser->visit('/')            
            ->assertVue('user.name', 'Taylor', '@profile-component');  
        });
    }

##assertUrlIs現在の URL (クエリ文字列なし) が指定された文字列と一致することをアサートします:

$browser->assertTitle($title);

現在の URL が指定された文字列と一致することをアサートします:

$browser->assertTitleContains($title);

現在の URL 一致が指定された文字列と一致しないことをアサートします:

$browser->assertUrlIs($url);

# # assertHostIs

現在の URL のホストが指定された値と一致することをアサートします:

$browser->assertSchemeIs($scheme);

$browser->assertSchemeIsNot($scheme);

##assertPortIs

現在の URL をアサートしますURL ポート値は指定された値と一致します:

$browser->assertHostIs($host);

$browser->assertHostIsNot($host);

$browser->assertPortIs($port);

現在のパスが指定されたパスと一致することをアサートします:

$browser->assertPortIsNot($port);

現在のパスが指定されたパスと一致しないことをアサートします:

$browser->assertPathBeginsWith($path);

$browser->assertPathIs('/home');

#assertQueryStringHas

$browser->assertPathIsNot('/home');

指定されたクエリ文字列パラメータが存在し、パラメータの値が指定された値であることをアサートします。 :

$browser->assertRouteIs($name, $parameters);

指定されたクエリ文字列パラメーターが存在しないことをアサートします:

$browser->assertQueryStringHas($name);

assertFragmentIs

現在のフラグメントが指定されたフラグメントに準拠していることをアサートします:

$browser->assertQueryStringHas($name, $value);

assertFragmentBeginsWith

現在のフラグメントが指定されたフラグメントで始まることをアサートします:

$browser->assertQueryStringMissing($name);

$browser->assertFragmentIs('anchor');

指定された Cookie が存在することをアサートします:

$browser->assertFragmentBeginsWith('anchor');

$browser->assertFragmentIsNot('anchor');

$browser->assertHasCookie($name);

$browser->assertCookieMissing($name);

$browser->assertCookieValue($name, $value);

$browser->assertPlainCookieValue($name, $value);

##assertSeeIn

$browser->assertSee($text);

assertDontSeeIn

$browser->assertDontSee($text);

#assertSourceHas指定されたソース コードが現在のページに存在することをアサートします:

$browser->assertSeeIn($selector, $text);

指定されたソース コードが現在のページに存在しないことをアサートします:

$browser->assertDontSeeIn($selector, $text);

現在のページが存在することをアサートします指定されたリンク:

$browser->assertSourceHas($code);

指定されたリンクが現在のページに存在しないことをアサートします:

$browser->assertSourceMissing($code);

##assertInputValue

指定された値が入力ボックスに存在することをアサートします:

$browser->assertSeeLink($linkText);

assertInputValueIsNot

指定された値が存在しないことをアサートします。入力ボックスに存在する:

$browser->assertDontSeeLink($linkText);

assertChecked

指定されたチェックボックスがチェックされていることをアサートします:

$browser->assertInputValue($field, $value);

assertNotChecked

指定されたチェックボックスがチェックされていないことをアサートします:

$browser->assertInputValueIsNot($field, $value);

$browser->assertChecked($field);

指定されたラジオ ボタンが選択されていないことをアサートします:

$browser->assertNotChecked($field);

$browser->assertRadioSelected($field, $value);

$browser->assertRadioNotSelected($field, $value);

$browser->assertSelected($field, $value);

$browser->assertNotSelected($field, $value);

$browser->assertSelectHasOptions($field, $values);

$browser->assertSelectMissingOptions($field, $values);

#assertVisible

$browser->assertSelectHasOption($field, $value);

assertPresent

$browser->assertValue($selector, $value);

assertMissing

$browser->assertVisible($selector);

assertDialogOpened

$browser->assertPresent($selector);

##assertEnabled

$browser->assertMissing($selector);

##assertDisabled指定されたフィールド フィールドが無効であることをアサートします:

$browser->assertDialogOpened($message);

assertFocusedフォーカスが指定されたフィールドにあることをアサートします:

$browser->assertEnabled($field);

フォーカスが指定されたフィールドにないことをアサートします:

$browser->assertDisabled($field);

Vue コンポーネント データのプロパティが指定された値と一致することをアサートします:

$browser->assertFocused($field);

assertVueIsNot

Vue コンポーネント データのプロパティが指定された値と一致しないことをアサートします:

$browser->assertNotFocused($field);

$browser->assertVue($property, $value, $componentSelector = null);

$browser->assertVueIsNot($property, $value, $componentSelector = null);

場合によっては、複雑な一連のアクションをテストする必要があるため、テスト コードが読みにくく、理解しにくくなることがあります。セマンティック アクションはページを通じて定義でき、指定されたページで 1 つのメソッドを使用できます。ページでは、アプリケーションまたは個々のページに共通のセレクターへのショートカットを定義することもできます。

Artisan コマンドはページ オブジェクトを生成できます。すべてのページ オブジェクトは、tests/Browser/Pages ディレクトリにあります:

$browser->assertVueContains($property, $value, $componentSelector = null);

このページには、デフォルトで

、assert、elements という 3 つのメソッドがあります。ここでは、まず url メソッドと assert メソッドについて詳しく説明します。elements メソッドについては、Selector の略語 で詳しく説明します。

メソッド

メソッドは、ページの URL を表すパスを返す必要があります。 Dusk はブラウザでこの URL を使用して特定のページに移動します:

$browser->assertVueDoesNotContain($property, $value, $componentSelector = null);

assert

php artisan dusk:page Login

visit

/**
 * 获得页面 URL 路径。
 *
 * @return string
 */
 public function url(){   
  return '/login';
 }

/**
 * 断言浏览器当前处于指定页面。
 *
 * @return void
 */
 public function assert(Browser $browser){ 
    $browser->assertPathIs($this->url());
   }

Selector Shorthand

elements メソッドを使用すると、ページ内の CSS セレクターのシンプルで覚えやすい省略表現を定義できます。たとえば、アプリのログイン ページの email 入力フィールドの省略形を定義してみましょう:

use Tests\Browser\Pages\Login;$browser->visit(new Login);

これで、以前にページで使用した完全な CSS セレクターの代わりに、この省略形を使用できるようになります。

use Tests\Browser\Pages\CreatePlaylist;$browser->visit('/dashboard')  
      ->clickLink('Create Playlist')        
      ->on(new CreatePlaylist)        
      ->assertSee('@create');

グローバル セレクターの略称

Dusk をインストールすると、Page 基本クラスが tests/Browser/Pages## に保存されます。 ＃ 目次。このクラスには、グローバル セレクターの略語を定義するために使用できる siteElements メソッドが含まれており、アプリケーションの各ページで次のグローバル セレクターの略語を使用できるようになります。

ページ メソッド

/**
 * 获取页面的元素简写。
 *
 * @return array
 */
 public function elements(){ 
    return [  
          '@email' => 'input[name=email]',   
         ];
       }

$browser->type('@email', 'taylor@laravel.com');

##コンポーネントコンポーネントは Dusk の「ページ オブジェクト」に似ています。 」とありますが、これは、ナビゲーション バーや情報通知ポップアップ ウィンドウなど、アプリケーション全体で頻繁に再利用される UI および機能フラグメントのほうです。したがって、コンポーネントは明示的な URL にバインドされません。

コンポーネントを生成するには、Artisan コマンド dusk:component## を使用します。 # コンポーネントを生成することができます。新しく生成されたコンポーネントは、

/**
 * 获取站点全局的选择器简写。
 *
 * @return array
 */
 public static function siteElements(){
     return [    
         '@element' => '#selector',   
          ];
        }

上に示すように、これは「日付ピッカー」コンポーネントを生成する例です。このコンポーネントは次のようになります。アプリケーションの多くのページ全体で使用されます。テスト スイート全体の多数のテスト ページにわたる日付選択のためのブラウザー自動化ロジックを手動で記述するのは面倒です。より便利な代替方法は、日付ピッカーを表す Dusk コンポーネントを定義し、そのコンポーネントに自動化ロジックをカプセル化することです。 #コンポーネントの使用

コンポーネントの定義が完了すると、テスト ページの日付ピッカーで日付を簡単に選択できます。また、選択した日付のロジックを変更する必要がある場合は、このコンポーネントを変更するだけです:

<?php
    namespace Tests\Browser\Pages;
    use Laravel\Dusk\Browser;
    class Dashboard extends Page{  
      // 其他页面方法...  
      /**
     * 创建一个新的播放列表。
     *
     * @param  \Laravel\Dusk\Browser  $browser
     * @param  string  $name
     * @return void
     */  
      public function createPlaylist(Browser $browser, $name) 
         {     
            $browser->type('name', $name)            
                ->check('share')                
                ->press('Create Playlist');   
           }
       }

Continuous Integration

CircleCI

CircleCI を使用して Dusk テストを実行している場合は、開始点としてこの構成ファイルを参照できます。 TravisCI と同様に、php Artisanserve コマンドを使用して、PHP の組み込み Web サーバーを起動します。

use Tests\Browser\Pages\Dashboard;$browser->visit(new Dashboard)    
    ->createPlaylist('My Playlist')        
    ->assertSee('My Playlist');

#Codeship

Codeship で Dusk テストを実行するには、次のコマンドを Codeship プロジェクトに追加する必要があります。もちろん、これらのコマンドは単なる例であり、必要に応じて自由に追加のコマンドを追加してください:

php artisan dusk:component DatePicker

で Dusk テストを実行する場合は、次の Google Chrome ビルドパックとスクリプトを Heroku app.json ファイルに追加します:

<?php
    namespace Tests\Browser\Components;
    use Laravel\Dusk\Browser;
    use Laravel\Dusk\Component as BaseComponent;
    class DatePicker extends BaseComponent{   
     /**
     * 获取组件的 root selector
     *
     * @return string
     */   
      public function selector()   
       {     
          return '.date-picker';   
        }   
    /**
     * 浏览器包含组件的断言
     *
     * @param  Browser  $browser
     * @return void
     */   
      public function assert(Browser $browser)  
        {      
          $browser->assertVisible($this->selector());  
         }    
    /**
     * 读取组件的元素快捷方式
     *
     * @return array
     */   
      public function elements()   
       {    
           return [        
               '@date-field' => 'input.datepicker-input',       
               '@month-list' => 'div > div.datepicker-months',            
               '@day-list' => 'div > div.datepicker-days',      
         ];   
      }   
     /**
     * 选择给定日期
     *
     * @param  \Laravel\Dusk\Browser  $browser
     * @param  int  $month
     * @param  int  $day
     * @return void
     */  
      public function selectDate($browser, $month, $day)  
        {    
            $browser->click('@date-field')             
               ->within('@month-list', function ($browser) use ($month) {       
                            $browser->click($month);         
                                })                
                 ->within('@day-list', function ($browser) use ($day) {       
                              $browser->click($day);           
                                   });   
          }
       }

#Travis CI

.travis.yml 構成を参照できます。 Travis CI はグラフィカル環境ではないため、Chrome ブラウザを起動するにはいくつかの追加手順を実行する必要があります。さらに、php 職人サーブ を使用して、PHP の組み込み Web サーバーを起動します。

<?php
    namespace Tests\Browser;
    use Tests\DuskTestCase;
    use Laravel\Dusk\Browser;
    use Tests\Browser\Components\DatePicker;
    use Illuminate\Foundation\Testing\DatabaseMigrations;
    class ExampleTest extends DuskTestCase{  
      /**
     * 基本的组件测试示例
     *
     * @return void
     */   
      public function testBasicExample() 
         {    
             $this->browse(function (Browser $browser) {       
                  $browser->visit('/')                
                      ->within(new DatePicker, function ($browser) {                   
                           $browser->selectDate(1, 2018);               
                               })                   
                      ->assertSee('January');     
                       });   
            }
      }

APP_URL## を調整します。 # 値:

version: 2jobs:
    build:
        steps:            
            - run: sudo apt-get install -y libsqlite3-dev            
            - run: cp .env.testing .env            
            - run: composer install -n --ignore-platform-reqs            
            - run: npm install            
            - run: npm run production            
            - run: vendor/bin/phpunit            
            - run:
                name: Start Chrome Driver
                command: ./vendor/laravel/dusk/bin/chromedriver-linux
                background: true            
           - run:
                name: Run Laravel Server
                command: php artisan serve
                background: true            
           - run:
                name: Run Laravel Dusk Tests
                command: php artisan dusk