Tests du navigateur (Laravel Dusk)

• Introduction
• Installation
  • Utiliser d'autres navigateurs
• Démarrer
  • Créer des tests
  • Exécuter le test
  • gestion de l'environnement
  • Création de navigateurs
  • Authentification des utilisateurs
  • Migration de base de données
• Interaction avec les éléments
  • Sélecteur de crépuscule
  • Cliquez sur le lien
  • texte, valeur et attributs
  "Utiliser le formulaire" Assertion du composant Vue
  • Assertions disponibles
  • Page
  • Créer une page
  • Configurer la page
  • Naviguer vers la page
  • Sélecteur d'abréviation
Méthode de page
• Composants
  • Créer des composants "Utiliser des composants"
  • Introduction
  Laravel Dusk fournit une API d'automatisation et de test de navigateur expressive et facile à utiliser. Par défaut, Dusk ne nécessite pas l'installation de JDK ou Selenium sur votre machine. Au lieu de cela, vous devez utiliser un
  • ChromeDriver distinct pour l'installation. Bien entendu, vous êtes également libre d'utiliser d'autres pilotes compatibles Selenium.

• Installation

  Vous devez d'abord ajouter laravel/dusk à votre dépendance Composer : laravel/dusk 依赖 ：

  composer require --dev laravel/dusk

  {note} 如果你是手动注册 Dusk 服务提供者，一定 不能 在你的生产环境中注册，这样可能会导致一些不守规矩的用户拥有控制你应用的权限。

  安装好 Dusk 包后，运行 dusk:install 命令：

  php artisan dusk:install

  Browser 目录将会在 tests 目录下被创建，并且包含一个测试用例。接下来，在你的 .env 文件中设置 APP_URL 变量。这个值应该与你在浏览器中打开本应用的 URL 匹配。

  要运行测试，使用 dusk 命令。 dusk 命令可以使用与 phpunit 命令同样的参数：

  php artisan dusk

  如果上次运行  dusk 命令时测试失败，则可以通过使用 dusk:fails 命令重新运行失败的测试来节省时间：

  php artisan dusk:fails

  {注意} Dusk 要求  ChromeDriver 二进制文件是可执行的。如果在 Dusk 运行时遇到问题，可以使用以下命令确保二进制文件是可执行的：chmod -R 0755 vendor/laravel/dusk/bin。

  使用其他浏览器

  默认情况下， Dusk 使用 Google Chrome 浏览器和一个单独的 ChromeDriver 的安装来运行你的浏览器测试。当然，你可以运行你自己的 Selenium 服务，用任何你想用的浏览器来进行测试。

  如果要这么做，打开 tests/DuskTestCase.php 文件，这个是应用测试用例的基类。在这个文件中，你可以移除对 startChromeDriver 方法的调用。这样 Dusk 就不会自动启动 ChromeDriver 了。

  /**
   * 准备执行 Dusk 测试。
   *
   * @beforeClass
   * @return void
   */
   public static function prepare(){ 
      // static::startChromeDriver();
     }

  然后，你可以修改 driver 方法来连接到你选定的 URL 和端口。此外，你可以修改 「desired capabilities」（期望能力），它将会被传递给 WebDriver：

  /**
   * 创建 RemoteWebDriver 实例。
   *
   * @return \Facebook\WebDriver\Remote\RemoteWebDriver
   */
   protected function driver(){
       return RemoteWebDriver::create(   
            'http://localhost:4444/wd/hub', DesiredCapabilities::phantomjs()    
         );
      }

  开始使用

  创建测试

  要创建一个 Dusk 测试，使用 dusk:make 命令。创建的测试将会被放在 tests/Browser

  php artisan dusk:make LoginTest

  {note} Si vous enregistrez le fournisseur de services Dusk manuellement, vous ne devez pas strong> Enregistrez-vous dans votre environnement de production, ce qui peut permettre à certains utilisateurs indisciplinés d'avoir le contrôle de votre application.

  Après avoir installé le package Dusk, exécutez la commande dusk:install :

  php artisan dusk

  Le répertoire Browser sera sous le tests Le répertoire est créé et contient un scénario de test. Ensuite, définissez la variable APP_URL dans votre fichier .env. Cette valeur doit correspondre à l'URL qui ouvre l'application dans votre navigateur.
  Pour exécuter des tests, utilisez la commande dusk. La commande dusk peut utiliser les mêmes paramètres que la commande phpunit : 🎜

  php artisan dusk:fails

  🎜Si le test a échoué la dernière fois que vous avez exécuté la commande dusk, vous pouvez utiliser la commande < code>dusk:fails pour gagner du temps en réexécutant les tests ayant échoué : 🎜

  php artisan dusk --group=foo

  🎜{Remarque} Exigences du crépuscule Les binaires ChromeDriver🎜 sont exécutables. Si vous rencontrez des problèmes lors de l'exécution de Dusk, vous pouvez utiliser la commande suivante pour vous assurer que le binaire est exécutable : chmod -R 0755 supplier/laravel/dusk/bin. 🎜

  🎜🎜🎜
  🎜

  Utiliser d'autres navigateurs

  🎜Par défaut ci-dessous, Dusk utilise Google Chrome et une installation distincte de ChromeDriver🎜 pour exécuter les tests de votre navigateur. Bien sûr, vous pouvez exécuter votre propre service Selenium et le tester en utilisant le navigateur de votre choix. 🎜🎜Si vous souhaitez faire cela, ouvrez le fichier tests/DuskTestCase.php. Il s'agit de la classe de base pour les cas de test d'application. Dans ce fichier, vous pouvez supprimer l'appel à la méthode startChromeDriver. De cette façon, Dusk ne démarrera pas automatiquement ChromeDriver. 🎜

  /**
   * 为 Dusk 测试做准备。
   *
   * @beforeClass
   * @return void
   */
   public static function prepare(){ 
      // static::startChromeDriver();
   }

  🎜Vous pouvez ensuite modifier la méthode driver pour vous connecter à l'URL et au port de votre choix. De plus, vous pouvez modifier les "capacités souhaitées" (capacités souhaitées), qui seront transmises à WebDriver : 🎜

  /**
   * 创建 RemoteWebDriver 实例。
   *
   * @return \Facebook\WebDriver\Remote\RemoteWebDriver
   */
   protected function driver(){ 
      return RemoteWebDriver::create( 
             'http://localhost:9515', DesiredCapabilities::chrome()   
         );
     }

  🎜🎜🎜

  🎜🎜Commencer🎜🎜🎜🎜

  🎜

  Créer des tests

  🎜Pour créer un Dusk Pour tester, utilisez la commande dusk:make. Les tests créés seront placés dans le répertoire tests/Browser : 🎜

  <?php
      namespace Tests\Browser;
      use App\User;use Tests\DuskTestCase;
      use Laravel\Dusk\Chrome;
      use Illuminate\Foundation\Testing\DatabaseMigrations;
      class ExampleTest extends DuskTestCase{ 
         use DatabaseMigrations;    
        /**
       * 一个基本的浏览器测试例子。
       *
       * @return void
       */   
        public function testBasicExample()  
          {     
             $user = factory(User::class)->create([          
               'email' => 'taylor@laravel.com',      
             ]);        
             $this->browse(function ($browser) use ($user) {      
                   $browser->visit('/login')               
                        ->type('email', $user->email)                    
                        ->type('password', 'secret')                    
                        ->press('Login')                    
                        ->assertPathIs('/home');      
                      });   
             }
         }

  🎜🎜🎜🎜🎜🎜

  Exécuter des tests

  Utilisez la commande dusk pour exécuter les tests de votre navigateur : dusk 命令来运行你的浏览器测试：

  $this->browse(function ($first, $second) {
      $first->loginAs(User::find(1))        
        ->visit('/home')          
        ->waitForText('Message');    
      $second->loginAs(User::find(2))       
           ->visit('/home')          
           ->waitForText('Message')           
           ->type('message', 'Hey Taylor')           
           ->press('Send');   
      $first->waitForText('Hey Taylor')          
            ->assertSee('Jeffrey Way');
          });

  如果上次运行  dusk 命令时测试失败，则可以通过使用 dusk:fails 命令重新运行失败的测试来节省时间：

  $browser->resize(1920, 1080);

  dusk 命令接受任何能让 PHPUnit 正常运行的参数。例如，让你可以在指定 group 中运行测试：

  $browser->maximize();

  手动运行 ChromeDriver

  默认情况下，Dusk 会尝试自动运行 ChromeDriver。如果你在特定的系统中不能运行，可以在运行 dusk 命令前通过手动的方式来运行 ChromeDriver。 如果你选择手动运行 ChromeDriver，你需要在你的 tests/DuskTestCase.php 文件中注释掉下面这一行：

  <?php
      namespace App\Providers;
      use Laravel\Dusk\Browser;
      use Illuminate\Support\ServiceProvider;
      class DuskServiceProvider extends ServiceProvider{  
        /**
       * 注册Dusk的浏览器宏
       *
       * @return void
       */   
       public function boot()  
         {       
            Browser::macro('scrollToElement', function ($element = null) { 
                       $this->script("$('html, body').animate({ scrollTop: $('$element').offset().top }, 0);");
                       return $this;       
                   });    
            }
       }

  另外，如果你的 ChromeDriver 运行在非 9515 端口 ，你需要修改同一个类中的 driver 方法：

  $this->browse(function ($browser) use ($user) { 
     $browser->visit('/pay')         
        ->scrollToElement('#credit-card-details')            
        ->assertSee('Enter Credit Card Details');
     });

  环境处理

  为了让 Dusk 使用自己的环境文件来运行测试，你需要在项目根目录创建一个 .env.dusk.{environment} 文件。简单的说，如果你想用 local 环境来运行 dusk 命令，你需要创建一个 .env.dusk.local 文件。

  运行测试的时候，Dusk 会备份你的 .env 文件并且重命名你的 Dusk 环境文件为 .env。当测试结束后，它会恢复你的 .env 文件。

  创建浏览器

  让我们先来写一个测试用例，这个例子可以验证我们是否能够登录系统。生成测试例子之后，我们可以修改它并让它可以跳转到登录界面，输入登录信息之后，点击「登录」按钮。我们通过 browse 方法来创建一个浏览器实例：

  $this->browse(function ($first, $second) { 
     $first->loginAs(User::find(1))         
           ->visit('/home');
         });

  在上面的例子中，browse 方法接收了一个回调参数。Dusk 会自动将这个浏览器实例注入到回调过程中，而且这个浏览器实例可以和你的应用进行交互和断言。

  {tip} 这个测试例子可以用来测试 make:auth 命令生成的登录界面。

  创建多个浏览器

  有时候你可能需要多个浏览器才能正确的进行测试。例如，使用多个浏览器测试通过 websockets 进行通讯的在线聊天页面。想要创建多个浏览器，需要在 browse

  <?php
      namespace Tests\Browser;
      use App\User;
      use Tests\DuskTestCase;
      use Laravel\Dusk\Chrome;
      use Illuminate\Foundation\Testing\DatabaseMigrations;
      class ExampleTest extends DuskTestCase{
          use DatabaseMigrations;
      }

  Si le test a échoué la dernière fois que vous avez exécuté la commande dusk, vous pouvez l'exécuter en en utilisant la commande The dusk:fails réexécute les tests ayant échoué pour gagner du temps :

  // HTML...
  <button>Login</button>
  // Test...
  $browser->click('.login-page .container div > button');

  La commande dusk accepte tous les paramètres permettant à PHPUnit de fonctionner correctement. Par exemple, vous permettant d'exécuter des tests dans un groupe spécifié : 🎜

  // HTML...
  <button dusk="login-button">Login</button>
  // Test...
  $browser->click('@login-button');

  🎜

  Exécuter ChromeDriver manuellement

  🎜Par défaut, Dusk essaiera d'exécuter ChromeDriver automatiquement. Si cela ne fonctionne pas sur votre système particulier, vous pouvez exécuter manuellement ChromeDriver avant d'exécuter la commande dusk. Si vous choisissez d'exécuter ChromeDriver manuellement, vous devez commenter la ligne suivante dans votre fichier tests/DuskTestCase.php : 🎜

  $browser->clickLink($linkText);

  🎜De plus, si votre ChromeDriver s'exécute sur un port autre que 9515, vous devez modifier la méthode driver dans la même classe : 🎜

  // 检索值...
  $value = $browser->value('selector');
  // 设置值...
  $browser->value('selector', 'value');

  🎜🎜

  🎜🎜 Traitement de l'environnement🎜🎜Pour que Dusk puisse utiliser son propre fichier d'environnement pour exécuter des tests, vous devez créer un fichier .env.dusk.{environment} dans le répertoire racine du projet. En termes simples, si vous souhaitez utiliser l'environnement local pour exécuter la commande dusk, vous devez créer un fichier .env.dusk.local . 🎜🎜Lors de l'exécution des tests, Dusk sauvegardera votre fichier .env et renommera votre fichier d'environnement Dusk en .env. Une fois le test terminé, il restaurera votre fichier .env. 🎜🎜🎜

  🎜🎜Création de navigateurs🎜🎜Écrivons d'abord un cas de test, cet exemple peut vérifier que nous pouvons nous connecter au système. Après avoir généré l'exemple de test, nous pouvons le modifier et le faire passer à l'interface de connexion. Après avoir saisi les informations de connexion, cliquez sur le bouton "Connexion". Nous créons une instance de navigateur via la méthode browse : 🎜

  $text = $browser->text('selector');

  🎜Dans l'exemple ci-dessus, la méthode browse reçoit un paramètre de rappel. Dusk injectera automatiquement cette instance de navigateur dans le processus de rappel, et cette instance de navigateur pourra interagir et s'affirmer avec votre application. 🎜

  🎜{tip} Cet exemple de test peut être utilisé pour tester l'interface de connexion générée par la commande make:auth. 🎜

  🎜

  Créez plusieurs navigateurs

  🎜Parfois, vous aurez peut-être besoin de plusieurs navigateurs pour tester correctement. Par exemple, utilisez plusieurs navigateurs pour tester une page de discussion en ligne qui communique via des websockets. Si vous souhaitez créer plusieurs navigateurs, vous devez utiliser des noms pour distinguer les instances de navigateur dans le rappel de la méthode browse, puis les transmettre au rappel pour "appliquer" à plusieurs instances de navigateur : 🎜

  $attribute = $browser->attribute('selector', 'value');

  🎜🎜

  Modifier la taille de la fenêtre du navigateur

  Vous pouvez utiliser la méthode resize pour ajuster la taille de la fenêtre du navigateur : resize 方法去调整浏览器的窗口大小：

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

  maximize 方法可以将浏览器窗口最大化：

  $browser->type('tags', 'foo')   
       ->append('tags', ', bar, baz');

  浏览器宏

  如果你想定义一个可以在各种测试中重复使用的自定义浏览器方法，可以在 Browser 类中使用 macro 方法。通常，你应该从 服务提供者 的 boot 方法中调用它：

  $browser->clear('email');

  macro 方法接收一个名称作为第一个参数，第二个参数则是一个闭包。 当调用浏览器宏作为一个 Browser 的实现的方法时，浏览器宏的闭包将会执行：

  $browser->select('size', 'Large');

  认证

  你可能经常会测试一些需要认证的页面。你可以使用 Dusk 的 loginAs 方法来避免每个测试都去登陆页面登陆一次。 loginAs 可以使用用户 ID 或者用户模型实例：

  $browser->select('size');

  {note} 使用 loginAs 方法后，该用户的 session 将会持久化的供其他测试用例使用。

  数据库迁移

  就像上面的认证例子一样，当你的测试用例需要迁移的时候，你不应该使用 RefreshDatabase trait。 RefreshDatabase trait 使用了不适用于 HTTP 请求的数据库事务。取而代之，我们要用 DatabaseMigrations trait：

  $browser->check('terms');$browser->uncheck('terms');

  与元素交互

  Dusk 选择器

  选择一个好的 CSS 选择器用于元素交互是编写 Dush 测试最困难的部分之一。随着时间推移，前端的更改可能会导致类似以下的 CSS 选择器中断测试：

  $browser->radio('version', 'php7');

  Dusk 选择器让你专注于编写有效的测试，而不是去记忆 CSS 选择器。要定义一个选择器，只需在你的 HTML 元素中添加一个 dusk 属性。然后，在选择器前面添加 @ 去操作 Dusk 测试中的附加元素：

  $browser->attach('photo', __DIR__.'/photos/me.png');

  点击链接

  要点击链接的话，你可以在浏览器实例上使用 clickLink 方法。clickLink

  $browser->keys('selector', ['{shift}', 'taylor'], 'otwell');

  La méthode maximize peut maximiser la fenêtre du navigateur :

  $browser->keys('.app', ['{command}', 'j']);

  Macro de navigateur

  Si vous souhaitez en définir une, vous pouvez l'utiliser dans diverses tests Pour réutiliser les méthodes de navigateur personnalisées, vous pouvez utiliser la méthode macro dans la classe Browser. Normalement, vous devez l'appeler depuis la méthode boot du fournisseur de services :

  $browser->click('.selector');

  La méthode macro reçoit un nom comme premier paramètre et un deuxième paramètre de fermeture. Lorsque la macro du navigateur est appelée comme méthode d'implémentation d'un Navigateur, la fermeture de la macro du navigateur sera exécutée :

  $browser->mouseover('.selector');

  🎜🎜

  🎜

  Authentification

  🎜Vous pouvez souvent tester certaines pages qui nécessitent une authentification. Vous pouvez utiliser la méthode loginAs de Dusk pour éviter d'avoir à vous connecter à la page de connexion pour chaque test. loginAs peut utiliser l'ID utilisateur ou une instance de modèle utilisateur : 🎜

  $browser->drag('.from-selector', '.to-selector');

  🎜🎜{note} Après avoir utilisé la méthode loginAs, la session de l'utilisateur sera conservée pour être utilisée par d'autres cas de test. 🎜🎜🎜🎜🎜

  🎜

  Migrations de bases de données

  🎜Tout comme l'exemple d'authentification ci-dessus, lorsque votre test When les cas doivent être migrés, vous ne devez pas utiliser le trait RefreshDatabase. Le trait RefreshDatabase utilise des transactions de base de données qui ne sont pas applicables aux requêtes HTTP. À la place, nous allons utiliser le trait DatabaseMigrations : 🎜

  $browser->dragLeft('.selector', 10);
  $browser->dragRight('.selector', 10);
  $browser->dragUp('.selector', 10);
  $browser->dragDown('.selector', 10);

  🎜🎜🎜

  🎜

  Interagir avec les éléments

  🎜🎜🎜

  🎜

  Sélecteurs de crépuscule

  🎜Sélectionnez-en un Les bons sélecteurs CSS pour l'interaction des éléments sont l'une des parties les plus difficiles de l'écriture de tests Dush. Au fil du temps, les modifications apportées au frontend peuvent entraîner l'interruption des tests par des sélecteurs CSS tels que les suivants : 🎜

  // 等待对话框显示：
  $browser->waitForDialog($seconds = null);
  // 断言对话框已经显示，并且其消息与给定值匹配：
  $browser->assertDialogOpened('value');
  // 在打开的 JavaScript 提示对话框中输入给定值：
  $browser->typeInDialog('Hello World');

  🎜Les sélecteurs Dusk vous permettent de vous concentrer sur l'écriture de tests efficaces au lieu de mémoriser les sélecteurs CSS. Pour définir un sélecteur, ajoutez simplement un attribut dusk à votre élément HTML. Ensuite, ajoutez @ devant le sélecteur pour faire fonctionner des éléments supplémentaires dans le test Dusk : 🎜

  $browser->acceptDialog();

  🎜🎜🎜

  🎜

  Cliquez sur un lien

  🎜Pour cliquer sur un lien, vous pouvez utiliser la méthode clickLink sur l'instance du navigateur. La méthode clickLink cliquera sur le lien avec le texte d'affichage spécifié : 🎜

  $browser->dismissDialog();

  🎜🎜{Note} Cette méthode peut interagir avec jQuery. S'il n'y a pas de jQuery sur la page, Dusk l'injectera automatiquement dans la page pour s'assurer qu'il est disponible pendant le test. 🎜🎜🎜🎜🎜🎜🎜🎜

  Texte, valeurs et propriétés

  Récupérer et définir des valeurs

  Dusk propose plusieurs façons d'interagir avec le texte, les valeurs et les propriétés actuellement affichés. Par exemple, pour obtenir la "valeur" d'un élément qui correspond au sélecteur spécifié, utilisez la méthode value : value 方法：

  $browser->with('.table', function ($table) { 
     $table->assertSee('Hello World')         
          ->clickLink('Delete');
       });

  检索文本

  text 这个方法可以用来匹配指定选择器中元素的显示文本：

  $browser->pause(1000);

  检索属性

  最后，attribute 这个方法 可以用来匹配指定选择器中元素的属性：

  // 等待选择器 5 秒时间...
  $browser->waitFor('.selector');
  // 等待选择器 1 秒时间...
  $browser->waitFor('.selector', 1);

  表单的使用

  输入值

  Dusk 提供了与表单和 input 元素交互的各种方法。首先让我们看一个在 input 框中输入文本的例子：

  $browser->waitUntilMissing('.selector');
  $browser->waitUntilMissing('.selector', 1);

  注意， 虽然 type 方法可以传递 CSS 选择器做为一个参数，但这并不是强制要求的。如果没有提供 CSS 选择器， Dusk 会搜索与 name 属性相同的 input 。如果还是没有找到，Dusk 会尝试查找传入值与  name  属性相同的 textarea 。

  要想将文本附加到一个字段之后而且不清除其内容， 你可以使用 append 方法：

  $browser->whenAvailable('.modal', function ($modal) { 
     $modal->assertSee('Hello World')       
        ->press('OK');
     });

  你可以使用 clear 方法清除输入值：

  // 等待指定文本 5 秒时间...
  $browser->waitForText('Hello World');
  // 等待指定文本 1 秒时间...
  $browser->waitForText('Hello World', 1);

  下拉菜单

  需要在下拉菜单中选择值，你可以使用 select 方法。 类似于  type  方法， select 方法并不是一定要传入 CSS 选择器。 当使用 select 方法时，你应该传递选项实际的值而不是它的显示文本：

  // 等待指定链接 5 秒时间...
  $browser->waitForLink('Create');
  // 等待给定链接 2 秒时间...
  $browser->waitForLink('Create', 1);

  你也可以通过省略第二个参数来随机选择一个选项：

  $browser->waitForLocation('/secret');

  复选框

  使用「check」 复选框时，你可以使用 check 方法。 像其他许多与 input 相关的方法，并不是必须传入 CSS 选择器。 如果准确的选择器无法找到的时候，Dusk 会搜索能够与 name 属性匹配的复选框：

  $browser->waitForRoute($routeName, $parameters);

  单选按钮

  使用 「select」中单选按钮选项时，你可以使用 radio 这个方法。 像很多其他的与输入相关的方法一样， 它也并不是必须传入 CSS 选择器。如果准确的选择器无法被找到的时候， Dusk 会搜索能够与 name 属性或者 value

  $browser->click('.some-action')  
        ->waitForReload()        
        ->assertSee('something');

  Retrieve text text Cette méthode peut être utilisée pour faire correspondre le texte affiché de l'élément dans le sélecteur spécifié :

  //等待表达式为 true 5 秒时间...
  $browser->waitUntil('App.dataLoaded');
  $browser->waitUntil('App.data.servers.length > 0');
  // 等待表达式为 true 1 秒时间...
  $browser->waitUntil('App.data.servers.length > 0', 1);

  Récupérer les attributs 🎜🎜Enfin, attribute Cette méthode peut être utilisée pour faire correspondre les attributs des éléments dans le sélecteur spécifié : 🎜

  // 等待组件属性包含给定值...
  $browser->waitUntilVue('user.name', 'Taylor', '@user');
  // 等待组件属性不包含给定值...
  $browser->waitUntilVueIsNot('user.name', null, '@user');

  🎜🎜🎜

  🎜🎜Utilisation de formulaires🎜

  🎜🎜Valeurs d'entrée🎜🎜Dusk fournit diverses méthodes pour interagir avec les formulaires et les éléments d'entrée. Regardons d'abord un exemple de saisie de texte dans une zone de saisie : 🎜

  $browser->waitUsing(10, 1, function () use ($something) { 
     return $something->isReady();
     },"Something wasn't ready in time.");

  🎜 Notez que bien que la méthode type puisse passer un sélecteur CSS en tant que paramètre, cela n'est pas obligatoire. Si aucun sélecteur CSS n'est fourni, Dusk recherche une entrée avec le même attribut name. S'il n'est toujours pas trouvé, Dusk essaiera de trouver un textarea avec la même valeur que l'attribut name. 🎜🎜Pour ajouter du texte à un champ sans effacer son contenu, vous pouvez utiliser la méthode append : 🎜

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

  🎜Vous pouvez utiliser la méthode clear pour effacer la valeur saisie : 🎜

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

  🎜🎜Menu déroulant🎜🎜Vous devez sélectionner une valeur dans le menu déroulant, vous pouvez utiliser la méthode select . Semblable à la méthode type, la méthode select ne nécessite pas nécessairement de passer un sélecteur CSS. Lorsque vous utilisez la méthode select, vous devez transmettre la valeur réelle de l'option plutôt que son texte affiché : 🎜

  $browser->assertTitle($title);

  🎜 Vous pouvez également sélectionner une option au hasard en omettant le deuxième argument : 🎜

  $browser->assertTitleContains($title);

  🎜🎜Checkbox🎜🎜Lorsque vous utilisez la case à cocher "check", vous pouvez utiliser la méthode check. Comme beaucoup d’autres méthodes liées à la saisie, il n’est pas nécessaire de transmettre un sélecteur CSS. Si le sélecteur exact ne peut pas être trouvé, Dusk recherchera une case à cocher qui correspond à l'attribut name : 🎜

  $browser->assertUrlIs($url);

  🎜🎜Bouton de sélection unique🎜 🎜Lorsque vous utilisez l'option du bouton radio dans "select", vous pouvez utiliser la méthode radio. Comme beaucoup d’autres méthodes liées à la saisie, elle ne nécessite pas de passer un sélecteur CSS. Si le sélecteur exact ne peut pas être trouvé, Dusk recherchera un bouton radio qui correspond à l'attribut name ou à l'attribut value : 🎜

  $browser->assertSchemeIs($scheme);

  🎜🎜🎜🎜🎜🎜

  Attachment

  La méthode attach peut joindre un fichier à l'élément d'entrée file. Comme beaucoup d’autres méthodes liées à la saisie, elle ne nécessite pas de passer un sélecteur CSS. Si le sélecteur exact n'est pas trouvé, Dusk recherchera une zone de saisie de fichier qui correspond à l'attribut name : attach 方法可以附加一个文件到  file  input 元素中。 像很多其他的与输入相关的方法一样，他也并不是必须传入 CSS 选择器。如果准确的选择器没有被找到的时候， Dusk 会搜索与 name 属性匹配的文件输入框：

  $browser->assertSchemeIsNot($scheme);

  {注意} attach 方法需要使用 PHP Zip  扩展，你的服务器必须安装了此扩展。

  使用键盘

  keys 方法让你可以再指定元素中输入比 type 方法更加复杂的输入序列。例如，你可以在输入值的同时按下按键。在这个例子中，输入 taylor 时， shift 键也同时被按下。当 taylor 输入完之后， 将会输入 otwell 而不会按下任何按键：

  $browser->assertHostIs($host);

  你甚至可以在你的应用中选中某个元素之后按下「快捷键」：

  $browser->assertHostIsNot($host);

  {提示} 所有包在 {} 中的键盘按键， 都对应定义于 FacebookWebDriverWebDriverKeys 类中，你可以在 GitHub 中找到。

  使用鼠标

  点击元素

  click 方法可用于「点击」与给定选择器匹配的元素：

  $browser->assertPortIs($port);

  鼠标悬停

  mouseover 方法可用于与给定选择器匹配的元素的鼠标悬停动作：

  $browser->assertPortIsNot($port);

  拖放

  drag 方法用于将与指定选择器匹配的元素拖到其它元素：

  $browser->assertPathBeginsWith($path);

  或者，可以在单一方向上拖动元素：

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

  JavaScript 对话框

  Dusk 提供了几种与 JavaScript 对话框交互的方法：

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

  通过点击确定按钮关闭打开的 JavaScript 对话框：

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

  通过点击取消按钮关闭打开的 JavaScript 对话框（仅对确认对话框有效）：

  $browser->assertQueryStringHas($name);

  选择器作用范围

  有时可能希望在给定的选择器范围内执行多个操作。比如，可能想要断言表格中存在某些文本，然后点击表格中的一个按钮。可以使用 with

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

  {Note} La méthode d'attachement nécessite un code PHP Zip extension, votre serveur doit avoir cette extension installée.

  Utilisation du clavier🎜🎜touches méthode Vous permet d'entrer des séquences d'entrée plus complexes dans l'élément spécifié que la méthode type. Par exemple, vous pouvez appuyer sur une touche tout en saisissant une valeur. Dans cet exemple, lorsque vous tapez taylor, la touche shift est également enfoncée. Lorsque taylor aura fini de taper, otwell sera tapé sans appuyer sur aucune touche : 🎜

  $browser->assertQueryStringMissing($name);

  🎜Vous pouvez même sélectionner un élément dans votre application et appuyer sur "Touches de raccourci" : 🎜

  $browser->assertFragmentIs('anchor');

  🎜{Conseils} Toutes les touches du clavier contenues dans {} sont définies en conséquence dans la classe FacebookWebDriverWebDriverKeys, vous pouvez utiliser un href="https://github.com/ facebook/php-webdriver/blob/community/lib/WebDriverKeys.php">Trouvé dans GitHub🎜. 🎜

  🎜🎜🎜

  🎜🎜Utilisez la souris🎜

  🎜

  Cliquez sur l'élément

  La méthode 🎜click peut être utilisée pour "cliquer" sur un élément qui correspond au sélecteur donné : 🎜

  $browser->assertFragmentBeginsWith('anchor');

  🎜

  Mouseover

  La méthode 🎜mouseover peut être utilisée pour les actions de survol de la souris sur les éléments correspondant au sélecteur donné : 🎜

  $browser->assertFragmentIsNot('anchor');

  🎜

  Glisser-déposer

  🎜La méthode drag est utilisée pour faire glisser les éléments correspondant au sélecteur spécifié vers d'autres éléments : 🎜

  $browser->assertHasCookie($name);

  🎜Ou, les éléments peuvent être glissé dans une seule direction : 🎜

  $browser->assertCookieMissing($name);

  🎜🎜🎜

  🎜🎜Boîtes de dialogue JavaScript🎜🎜Dusk propose plusieurs façons d'interagir avec Boîtes de dialogue JavaScript : 🎜

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

  🎜 Fermez une boîte de dialogue JavaScript ouverte en cliquant sur le bouton OK : 🎜

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

  🎜 Fermez une boîte de dialogue JavaScript ouverte en cliquant sur le bouton Annuler (valable uniquement pour les boîtes de dialogue de confirmation) : 🎜

  $browser->assertSee($text);

  🎜🎜🎜

  🎜🎜Étendues du sélecteur🎜🎜Parfois, vous souhaiterez peut-être effectuer plusieurs opérations dans une étendue de sélecteur donnée. Par exemple, vous souhaiterez peut-être affirmer qu'un certain texte existe dans un tableau, puis cliquer sur un bouton du tableau. Cette exigence peut être satisfaite en utilisant la méthode with. Toutes les opérations effectuées dans la fonction de rappel sont limitées au sélecteur d'origine : 🎜

  $browser->assertDontSee($text);

  🎜🎜🎜🎜🎜🎜

  En attente d'éléments

  Lors du test d'applications qui utilisent largement JavaScript, il est souvent nécessaire "d'attendre" que l'élément ou les données spécifiés soient disponibles avant de tester. Le crépuscule rend les choses plus faciles. À l'aide d'une série de méthodes, vous pouvez attendre qu'un élément de page soit disponible, ou même jusqu'à ce qu'une expression JavaScript donnée soit évaluée à true. true。

  等待

  如果需要测试暂停指定的毫秒数，可以使用 pause 方法：

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

  等待选择器

  waitFor 方法可以用于暂停执行测试，直到页面上与给定 CSS 选择器匹配的元素被显示。默认情况下，将在暂停超过 5 秒后抛出异常。如果有必要，可以传递自定义超时时长作为其第二个参数：

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

  还可以等待指定选择器从页面消失：

  $browser->assertSourceHas($code);

  选择器可用时限定作用域范围

  偶尔可能希望等待选择器然后与其互动。例如，可能希望等待模态窗口可用，然后点击模态窗口的「确定」按钮。 whenAvailable 方法能够用于这种情况。给定回调内的所有要执行的元素操作都将被限定在起始选择器上：

  $browser->assertSourceMissing($code);

  等待文本

  waitForText 方法可以用于等待页面上给定文字被显示：

  $browser->assertSeeLink($linkText);

  等待链接

  waitForLink 方法用于等待给定链接文字在页面上显示：

  $browser->assertDontSeeLink($linkText);

  等待页面跳转

  在给出类似  $browser->assertPathIs('/home') 路径断言时，如果 window.location.pathname 被异步更新，断言就会失败。可以使用 waitForLocation 方法等待页面跳转到给定路径：

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

  还可以等待被命名的路由跳转：

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

  等待页面重新加载

  如果要在页面重新加载后断言，可以使用 waitForReload 方法：

  $browser->assertChecked($field);

  等待 JavaScript 表达式

  有时会希望暂停执行测试，直到给定的 JavaScript 表达式执行结果为  true。可以使用 waitUntil 方法轻易地达成此目的。传送一个表达式给此方法，不需要包含 return

  Attendez

  Si vous devez tester une pause pendant un nombre spécifié de millisecondes, vous pouvez utiliser la méthode pause :

  $browser->assertNotChecked($field);

  Attendez les sélecteurs

  La méthode waitFor peut être utilisée pour suspendre l'exécution du test jusqu'à ce qu'un élément de la page correspondant au CSS donné Le sélecteur s’affiche. Par défaut, une exception sera levée après une pause de plus de 5 secondes. Si nécessaire, vous pouvez passer un timeout personnalisé comme deuxième paramètre : 🎜

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

  🎜 Vous pouvez également attendre que le sélecteur spécifié disparaisse de la page : 🎜

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

  🎜🎜 Sélectionnez Cadrage lorsqu'un sélecteur est disponible🎜🎜Parfois, vous souhaiterez peut-être attendre un sélecteur, puis interagir avec lui. Par exemple, vous souhaiterez peut-être attendre qu'une fenêtre modale soit disponible, puis cliquer sur le bouton OK de la fenêtre modale. La méthode whenAvailable peut être utilisée dans cette situation. Toutes les opérations sur les éléments à effectuer dans le rappel donné seront limitées au sélecteur de départ : 🎜

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

  🎜🎜wait for text🎜🎜waitForText< Le /code > La méthode peut être utilisée pour attendre que le texte donné sur la page soit affiché : 🎜

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

  🎜🎜Attendez le lien🎜🎜waitForLink est utilisée Attendez que le texte du lien donné soit affiché sur la page : 🎜

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

  🎜🎜Attendez que la page saute🎜🎜Après avoir donné quelque chose comme $browser->assertPathIs(' Lors de l'affirmation du chemin /home'), si window.location.pathname est mis à jour de manière asynchrone, l'assertion échouera. Vous pouvez utiliser la méthode waitForLocation pour attendre que la page saute vers un chemin donné : 🎜

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

  🎜 Vous pouvez également attendre que la route nommée saute : 🎜

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

  🎜🎜Attendez le rechargement de la page🎜🎜Si vous souhaitez affirmer après le rechargement de la page, vous pouvez utiliser la méthode waitForReload : 🎜

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

  🎜🎜Attendez les expressions JavaScript 🎜🎜 Parfois, vous souhaitez suspendre l'exécution du test jusqu'à ce qu'une expression JavaScript donnée soit évaluée à true. Cela peut être facilement accompli en utilisant la méthode waitUntil. Passez une expression à cette méthode sans inclure le mot-clé return ou le point-virgule fermant : 🎜

  $browser->assertVisible($selector);

  🎜🎜🎜Await Vue expression 🎜🎜Les méthodes suivantes peuvent être utilisées pour attendre une propriété de composant Vue donnée Contient ou fait ne contient pas la valeur donnée : 🎜

  $browser->assertPresent($selector);

  🎜🎜

  Attendez les rappels

  De nombreuses méthodes "d'attente" de Dusk s'appuient sur la méthode waitUsing 方法。可以直接使用此方法来等待给定的回调返回 true。 waitUsing sous-jacente pour accepter le nombre maximum de secondes d'attente, l'intervalle entre les exécutions de fermeture, la fermeture en cours d'exécution et les messages d'échec fiables :

  $browser->assertMissing($selector);

  Make Vue Assertions

  Dusk vous permet également de faire des assertions sur l'état des données des composants Vue. Par exemple, supposons que votre application contienne le composant Vue suivant :

  $browser->assertDialogOpened($message);

  Vous pouvez faire l'assertion suivante sur l'état du composant Vue :

  $browser->assertEnabled($field);

  Assertions disponibles

  Dusk fournit une série de méthodes d'assertion disponibles. Toutes les affirmations sont les suivantes :

  assertTitle
  assertTitleContains
  assertUrlIs
  assertSchemeIs
  assertSchemeIsNot
  assertHostIs
  assertHostIsNot
  assertPortIs
  assertPortIsNot
  assertPathBeginsWith
  assertPathIs
  assertPathIsNot
  assertRouteIs
  assertQueryStringHas
  assertQueryStringMissing
  assertFragmentIs
  assertFragmentBeginsWith
  assertFragmentIsNot
  assertHasCookie
  assertCookieMissing
  assertCookieValue
  assertPlainCookieValue
  assertSee
  assertDontSee
  assertSeeIn
  assertDontSeeIn
  assertSourceHas
  assertSourceMissing
  assertSeeLink
  assertDontSeeLink
  assertInputValue
  assert InputValueIsNot
  assertChecked
  assertNotChecked
  assertRadioSelected
  assertRadioNotSelected
  assertSelected
  assertNotSelected
  assertSelectHasOptions
  assertSelectMissingOptions
  assertSelectHasOption
  assertValue
  assertVisible
  assertPresent
  assertMissing
  assertDialogOpened
  assertEnabled
  assertDisabled
  assertFocused
  assertNotFocused
  assertVue
  assertVueIsNot
  assertVueContains
  assertVueDoesNotContain

  assertTitle

  Assister que le titre de la page correspond au texte spécifié :

  $browser->assertDisabled($field);

  assertTitleContains

  Affirmer que le titre de la page contient le texte spécifié :

  $browser->assertFocused($field);

  assertUrlIs

  Assert que l'URL actuelle (sans chaîne de requête) correspond à la chaîne spécifiée :

  $browser->assertNotFocused($field);

  assertSchemeIs

  Assert que l'URL actuelle correspond à la chaîne donnée :

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

  assertSchemeIsNot

  Assert que l'URL actuelle correspond à la chaîne donnée :

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

  assertHostIs

  Assert que l'hôte de l'URL actuelle correspond à la valeur donnée :

  assertHostIsNot

  Assert que l'hôte de l'URL actuelle ne correspond pas à la valeur donnée :

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

  assertPortIs

  Assert que la valeur du port de l'URL actuelle correspond à la valeur donnée :

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

  assertPortIsNot

  Assert que la valeur du port de l'URL actuelle ne correspond pas à la valeur donnée :

  php artisan dusk:page Login

  assertPathBeginsWith

  Assert que l'URL actuelle commence par le chemin spécifié :

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

  assertPathIs

  Assert que le chemin actuel correspond au chemin spécifié :

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

  assertPathIsNot

  Assert que le chemin actuel ne correspond pas au chemin spécifié : ee

  assertRouteIs

  Assert que l'URL actuelle correspond à l'URL spécifiée d'une route nommée :

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

  assertQueryStringHas

  Assert que le paramètre de chaîne de requête spécifié existe :

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

  Assert que le paramètre de chaîne de requête spécifié existe et a la valeur spécifiée :

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

  assertQueryStringMissing

  Assert que le paramètre de chaîne de requête spécifié n'existe pas :

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

  assertFragmentIs

  Assert que le fragment actuel correspond au fragment spécifié :

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

  assertFragmentBeginsWith

  Assert que le fragment actuel commence par le fragment spécifié :

  <?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');   
             }
         }

  assertFragmentIsNot

  Assert que le fragment actuel ne correspond pas au fragment spécifié :

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

  assertHasCookie

  Assert que le cookie spécifié existe

  php artisan dusk:component DatePicker

  assertCookieMissing

  Affirmer que le cookie spécifié n'existe pas :

  <?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);           
                                     });   
            }
         }

  assertCookieValue

  Assert que le cookie existe avec la valeur spécifiée :

  <?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');     
                         });   
              }
        }

  assertPlainCookieValue

  Assert que le chiffrement Le cookie ed existe avec la valeur spécifiée :

  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

  assertSee

  Assert que le texte spécifié existe sur la page actuelle :

  phpenv local 7.2
  cp .env.testing .env
  mkdir -p ./bootstrap/cache
  composer install --no-interaction --prefer-dist
  php artisan key:generate
  nohup bash -c "php artisan serve 2>&1 &" && sleep 5
  php artisan dusk

  assertDontSee

  Assert que le texte spécifié n'existe pas sur la page actuelle :

  {  "environments": { 
         "test": { 
              "buildpacks": [    
                  { "url": "heroku/php" },        
                  { "url": "https://github.com/heroku/heroku-buildpack-google-chrome" }    
                    ],      
                "scripts": {      
                   "test-setup": "cp .env.testing .env",        
                   "test": "nohup bash -c './vendor/laravel/dusk/bin/chromedriver-linux > /dev/null 2>&1 &' && nohup bash -c 'php artisan serve > /dev/null 2>&1 &' && php artisan dusk" 
                      }  
                    }  
              }
         }

  assertSeeIn

  Affirmer que le sélecteur existe dans la portée Texte spécifié :

  language: php
  php: 
   - 7.3
  addons:
    chrome: stable
  install:
    - cp .env.testing .env  
    - travis_retry composer install--no-interaction --prefer-dist --no-suggest  
    - php artisan key:generate
  before_script:  
     - google-chrome-stable --headless --disable-gpu --remote-debugging-port=9222 http://localhost &  
     - php artisan serve &
   script:
     - php artisan dusk

  assertDontSeeIn

  Affirmer que le texte spécifié n'existe pas dans la plage du sélecteur :

  APP_URL=http://127.0.0.1:8000

  assertSourceHas

  Assert que le code source spécifié existe sur la page actuelle :

  rrreee

  assertSourceMissing

  Assert que le code source spécifié n'existe pas sur la page actuelle 

  rrreee

  assertSeeLink

  Assister que le lien spécifié existe sur la page actuelle :

  rrreee

  assertDontSeeLink

  Affirmer que le lien spécifié n'existe pas sur la page actuelle :

  rrreee

  assertInputValue

  Affirmez que la zone de saisie a la valeur spécifiée :

  rrreee

  assertInputValueIsNot

  Assert input La boîte n'existe pas avec la valeur spécifiée :

  rrreee

  assertChecked

  Affirme que le spécifié la case est cochée :

  rrreee

  assertNotChecked

  Assert que la case spécifiée n'est pas cochée :

  rrreee

  assertRadioSelected

  Assert que le bouton radio spécifié est sélectionné :

  rrreee

  assertRadioNotSelected

  Assert la radio spécifiée Le bouton de sélection n'est pas sélectionné :

  rrreee

  assertSelected

  Assert que la liste déroulante est sélectionnée avec la valeur spécifiée :

  rrreee

  assertNotSelected

  Affirmer que la baisse- la case vers le bas n'est pas sélectionnée avec la valeur spécifiée Valeur :

  rrreee

  assertSelectHasOptions

  Assert que la valeur sélectionnée n'est pas une valeur dans le tableau spécifié :

  rrreee

  assertSelect HasOption

  Assert facultatif à la valeur spécifiée :

  rrreee

  assertValue

  Assert que l'élément dans la plage du sélecteur existe avec la valeur spécifiée :

  rrreee

  assertVisible

  assert Éléments dans la portée du sélecteur sont visibles :

  rrreee

  assertPresent

  Affirmer que les éléments dans la portée du sélecteur sont présents :

  rrreee

  assertMissing

  Assert les éléments dans la sélection ou portée N'existe pas :

  rrreee

  assertDialogOpened

  Assert que la boîte de dialogue JavaScript avec le message spécifié a été ouverte :
  rrreee

  assertEnabled

  Assert que le champ spécifié est Enabled :

  rrreee

  assertDisabled

  Assert que le champ spécifié est désactivé :

  rrreee

  assertFocused

  Assert que le focus est sur le champ spécifié :

  rrreee

  assertNotFocused

  assert Le focus n'est pas sur le champ spécifié :

  rrreee

  assertVue

  Affirmer que les propriétés des données du composant Vue correspondent à la valeur spécifiée :

  rrreee

  assertVueIsNot

  Assert que la propriété des données du composant Vue ne correspond pas à la valeur spécifiée :

  rrreee

  assertVueContains

  Assert que la propriété des données du composant Vue est un tableau et que le tableau contient le valeur spécifiée :

  rrreee

  assertVueDoesNotContain

  Assert que la propriété des données du composant Vue est un tableau et que le tableau ne contient pas la valeur spécifiée :

  rrreee

  Page

  Parfois, vous devez tester une série d’actions complexes, ce qui peut rendre le code de test difficile à lire et à comprendre. Des actions sémantiques peuvent être définies via la page, puis une seule méthode peut être utilisée dans la page spécifiée. Les pages peuvent également définir des raccourcis vers des sélecteurs universels pour des applications ou des pages individuelles.

  Générer une page

  dusk:page La commande Artisan peut générer des objets de page. Tous les objets de page se trouvent dans le répertoire tests/Browser/Pages : dusk:page Artisan 命令可以生成页面对象。所有的页面对象都位于 tests/Browser/Pages 目录：

  rrreee

  配置页面

  页面默认拥有 3 个方法： url， assert 和 elements。 在这里我们先详述 url 和 assert 方法， elements 方法将会 选择器简写 中详述。

  url 方法

  url 方法应该返回表示页面 URL 的路径。 Dusk 将会在浏览器中使用这个 URL 来导航到具体页面：

  rrreee

  assert 方法

  assert 方法可以作出任何断言来验证浏览器是否在指定页面上。这个方法并不是必须的。你可以根据你自己的需求来做出这些断言。这些断言会在你导航到这个页面的时候自动执行：

  rrreee

  导航至页面

  一旦页面配置好之后，你可以使用 visit 方法导航至页面：

  rrreee

  有时候，你可能已经在指定页面了，你需要的只是「加载」当前页面的选择器和方法到当前测试中来。常见的例子有：当你按下一个按钮的时候，你会被重定向至指定页面，而不是直接导航至指定页面。在这种情况下，你需要使用 onrrreee

  Page de configuration

  La page dispose de 3 méthodes par défaut : url, assert et elements. Ici, nous décrivons d'abord les méthodes url et assert en détail. La méthode elements sera la . abréviation du sélecteur. Détaillée dans 🎜. 🎜 Méthode

  🎜🎜 Méthode url 🎜🎜 La méthode url doit renvoyer le chemin représentant l'URL de la page. Dusk utilisera cette URL dans le navigateur pour accéder à la page spécifique : 🎜rrreee

  🎜🎜assert méthode 🎜🎜assert < La méthode /code> peut faire n’importe quelle assertion pour vérifier que le navigateur se trouve sur la page spécifiée. Cette méthode n'est pas obligatoire. Vous pouvez faire ces affirmations en fonction de vos propres besoins. Ces assertions seront automatiquement exécutées lorsque vous accéderez à cette page : 🎜rrreee🎜🎜🎜

  🎜🎜Navigation vers la page 🎜🎜Une fois la page configurée, vous pouvez utiliser la méthode visit pour accéder à la page : 🎜rrreee🎜 Parfois, vous êtes peut-être déjà sur la page spécifiée et il vous suffit de "charger" le la sélection de la page actuelle ajoute les constructeurs et les méthodes au test en cours. Exemples courants : lorsque vous appuyez sur un bouton, vous serez redirigé vers la page spécifiée au lieu de naviguer directement vers la page spécifiée. Dans ce cas, vous devez utiliser la méthode on pour charger la page : 🎜rrreee🎜🎜🎜🎜🎜🎜

  Raccourci du sélecteur

  La méthode elements vous permet de définir un raccourci simple et facile à retenir pour n'importe quel sélecteur CSS de la page. Par exemple, définissons une abréviation pour le champ de saisie email sur la page de connexion de l'application : elements 方法允许你为页面中的任何 CSS 选择器定义简单易记的简写。例如，让我们为应用登录页中的 email 输入框定义一个简写：

  rrreee

  现在你可以用这个简写来代替之前在页面中使用的完整 CSS 选择器：

  rrreee

  全局的选择器简写

  安装 Dusk 之后，Page 基类存放在你的 tests/Browser/Pages 目录。该类中包含一个 siteElements 方法，这个方法可以用来定义全局的选择器简写，这样在你应用中每个页面都可以使用这些全局选择器简写了：

  rrreee

  页面方法

  除了页面中已经定义的默认方法之外，你还可以定义在整个测试过程中会使用到的其他方法。例如，假设我们正在开发一个音乐管理应用，在应用中都可能需要一个公共的方法来创建列表，而不是在每一页、每一个测试类中都重写一遍创建播放列表的逻辑，这时候你可以在你的页面类中定义一个 createPlaylist 方法：

  rrreee

  方法被定义之后，你可以在任何使用到该页的测试中使用这个方法了。浏览器实例会自动传递该页面方法：

  rrreee

  组件

  组件类似于 Dusk 的 「页面对象」，不过它更多的是贯穿整个应用程序中频繁重用的 UI 和功能片断，比如说导航条或信息通知弹窗。因此，组件并不会绑定于某个明确的 URL。

  组件的生成

  为了生成一个组件，使用 Artisan 命令 dusk:component 即可生成组件。新生成的组件位于 test/Browser/Componentsrrreee

  Vous pouvez désormais utiliser cette abréviation à la place du sélecteur CSS complet que vous avez utilisé précédemment dans la page :

  rrreee

  Abréviation du sélecteur global

  Après l'installation de Dusk, la classe de base Page est stockée dans vos tests / Répertoire Navigateur/Pages. Cette classe contient une méthode siteElements, qui peut être utilisée pour définir des abréviations de sélecteur global, afin que chaque page de votre application puisse utiliser ces abréviations de sélecteur global : rrreee

  Méthodes de page

  En plus des méthodes par défaut déjà définies dans la page, vous pouvez également définir tout au long du processus de test d'autres méthodes utilisées. Par exemple, supposons que nous développons une application de gestion musicale. Dans l'application, nous pouvons avoir besoin d'une méthode publique pour créer une liste. Au lieu de réécrire la logique de création d'une liste de lecture dans chaque page et chaque classe de test, vous pouvez alors définir une. Méthode createPlaylist dans votre classe de page :

  rrreee

  Une fois la méthode définie, vous pouvez utiliser cette méthode dans n'importe quel test utilisant la page. L'instance du navigateur transmettra automatiquement la méthode page : rrreee

  component

  component est similaire à la "page" de Dusk Object", mais il s'agit plutôt d'une interface utilisateur et d'un fragment fonctionnel fréquemment réutilisé dans l'ensemble de l'application, comme une barre de navigation ou une fenêtre contextuelle de notification d'informations. Le composant n’est donc pas lié à une URL explicite.

  🎜Génération de composants🎜🎜Pour générer un composant, utilisez la commande Artisan dusk : composant pour générer le composant. Le composant nouvellement généré se trouve dans le répertoire test/Browser/Components : 🎜rrreee🎜Comme indiqué ci-dessus, il s'agit d'un exemple de génération d'un composant "sélecteur de date" qui peut être utilisé sur plusieurs pages de votre candidature. Écrire manuellement une logique d'automatisation du navigateur pour la sélection de dates sur un grand nombre de pages de test dans une suite de tests serait fastidieux. Une alternative plus pratique consiste à définir un composant Dusk qui représente le sélecteur de date, puis à encapsuler la logique d'automatisation dans le composant : 🎜rrreee🎜🎜🎜🎜🎜🎜🎜Utilisation du composant🎜🎜Une fois la définition du composant terminée, sur n'importe quel page de test La sélection d'une date est facile avec le sélecteur de date. Et, si vous avez besoin de modifier la logique de la date sélectionnée, modifiez simplement ce composant : 🎜rrreee🎜🎜🎜🎜🎜🎜🎜Intégration continue🎜🎜🎜🎜🎜🎜🎜

  CircleCI

  Si vous utilisez CircleCI pour exécuter des tests Dusk, vous pouvez vous référer à ce fichier de configuration comme point de départ. Comme avec TravisCI, nous utiliserons la commande php artisan serve pour démarrer le serveur Web intégré de PHP : php artisan serve 命令启动 PHP 的内置 Web 服务器：

  rrreee

  Codeship

  在 Codeship 中运行 Dusk 测试，需要在你的 Codeship 项目中添加以下命令。当然，这些命令只是作为范例，你可以根据需要随意添加额外的命令：

  rrreee

  Heroku CI

  在 Heroku CI 中运行 Dusk 测试时，请将下列 Google Chrome 构建包和脚本添加到你的 Heroku app.json 文件中：

  rrreee

  Travis CI

  在  Travis CI 中运行 Dusk 测试时，你可以参考 .travis.yml 的配置。由于 Travis CI 不是图形环境，因此我们需要采取一些额外的步骤来启动 Chrome 浏览器。此外，我们将使用 php artisan serve 启动 PHP 的内置 Web 服务器：

  rrreee

  在 .env.testing 文件中，调整 APP_URLrrreee

  Codeship

  🎜Pour exécuter des tests Dusk dans Codeship🎜, vous devez ajouter les commandes suivantes à votre projet Codeship . Bien entendu, ces commandes ne sont que des exemples, n'hésitez pas à ajouter des commandes supplémentaires si nécessaire : 🎜rrreee🎜🎜🎜

  🎜🎜Heroku CI🎜🎜Lors de l'exécution de tests Dusk dans Heroku CI🎜, veuillez ajouter les buildpacks et scripts Google Chrome suivants dans votre Fichier Heroku app.json : 🎜rrreee🎜🎜🎜

  🎜 🎜Travis CI🎜🎜Lors de l'exécution des tests Dusk dans Travis CI🎜, vous pouvez vous référer à la configuration .travis.yml. Étant donné que Travis CI n'est pas un environnement graphique, nous devons suivre quelques étapes supplémentaires pour lancer le navigateur Chrome. De plus, nous utiliserons php artisan serve pour démarrer le serveur Web intégré de PHP : 🎜rrreee🎜Dans le fichier .env.testing, ajustez le APP_URL Valeur : 🎜rrreee🎜Cet article a été publié pour la première fois sur le site Web 🎜LearnKu.com🎜. 🎜🎜

  ← Boîte à outils de trading de caissier

  Outil de déploiement Envoy →

  soumettre

  Site Web PHP chinois

  MaisonCoursArticleQuestions et réponsesDictionnaireManuelTéléchargerrecherche APPTélécharger