Ujian Penyemak Imbas (Laravel Dusk)

• Pengenalan
• Pemasangan
  • Gunakan pelayar lain
• • s
  • Jalankan ujian
Pengendalian alam sekitar .
• Klik pautan
  • teks, nilai dan Atribut
  • Gunakan borang
  • Lampirkan fail
  • Gunakan papan kekunci
  • Gunakan tetikus
  • Waktu pilihan skop
  Pernyataan komponen Vue
  • Pernyataan yang tersedia
  • Halaman
  • Buat halaman
Konfigurasikan halaman
Navigasi ke halaman
• hor atau pilih halaman kaedah
  Komponen
  Buat komponen
  Gunakan komponen
  • Integrasi berterusan
CircleCI
• Codeship
  • vis CI
• Pengenalan
  • Laravel Dusk menyediakan automasi penyemak imbas yang ekspresif dan mudah digunakan dan API ujian. Secara lalai, Dusk tidak memerlukan JDK atau Selenium dipasang pada mesin anda. Sebaliknya, anda perlu menggunakan ChromeDriver
  yang berasingan untuk pemasangan. Sudah tentu, anda juga bebas menggunakan pemacu lain yang serasi dengan Selenium.

  • Pemasangan

    Anda harus menambahkan laravel/dusk pada kebergantungan Komposer anda terlebih dahulu: 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} Jika anda mendaftar penyedia perkhidmatan Dusk secara manual, anda mestilah tidak kuat> Daftar dalam persekitaran pengeluaran anda, yang mungkin membenarkan sesetengah pengguna yang tidak dikawal mengawal aplikasi anda.

    Selepas memasang pakej Dusk, jalankan perintah dusk:install:

    php artisan dusk

    Direktori Browser akan berada di bawah tests direktori dicipta dan mengandungi kes ujian. Seterusnya, tetapkan pembolehubah APP_URL dalam fail .env anda. Nilai ini harus sepadan dengan URL yang membuka apl dalam penyemak imbas anda.
    Untuk menjalankan ujian, gunakan perintah senja. Arahan dusk boleh menggunakan parameter yang sama seperti perintah phpunit: 🎜

    php artisan dusk:fails

    🎜Jika ujian gagal kali terakhir anda menjalankan perintah dusk, anda boleh menggunakan perintah < code>dusk:fails untuk menjimatkan masa dengan menjalankan semula ujian yang gagal: 🎜

    php artisan dusk --group=foo

    🎜{Nota} Keperluan senja Perduaan ChromeDriver🎜 boleh dilaksanakan. Jika anda menghadapi masalah semasa Senja berjalan, anda boleh menggunakan arahan berikut untuk memastikan binari boleh dilaksanakan: chmod -R 0755 vendor/laravel/dusk/bin. 🎜

    🎜🎜🎜
    🎜

    Gunakan pelayar lain

    🎜Lalai Di Bawah, Senja menggunakan Google Chrome dan pemasangan berasingan ChromeDriver🎜 untuk menjalankan ujian penyemak imbas anda. Sudah tentu, anda boleh menjalankan perkhidmatan Selenium anda sendiri dan mengujinya menggunakan mana-mana pelayar yang anda mahukan. 🎜🎜Jika anda ingin melakukan ini, buka fail tests/DuskTestCase.php Ini ialah kelas asas untuk kes ujian aplikasi. Dalam fail ini, anda boleh mengalih keluar panggilan ke kaedah startChromeDriver. Dengan cara ini Senja tidak akan memulakan ChromeDriver secara automatik. 🎜

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

    🎜Anda kemudian boleh mengubah suai kaedah driver untuk menyambung ke URL dan port pilihan anda. Selain itu, anda boleh mengubah suai "keupayaan yang diingini" (keupayaan yang diingini), yang akan diserahkan kepada WebDriver: 🎜

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

    🎜🎜🎜

    🎜🎜Mulakan🎜🎜🎜🎜

    🎜

    Buat Ujian

    🎜Untuk mencipta Senja Untuk menguji, gunakan perintah dusk:make. Ujian yang dibuat akan diletakkan dalam direktori 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');      
                        });   
               }
           }

    🎜🎜🎜🎜🎜🎜

    Jalankan Ujian

    Gunakan perintah senja untuk menjalankan ujian penyemak imbas anda: 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;
        }

    Jika ujian gagal kali terakhir anda menjalankan perintah dusk, anda boleh menjalankannya dengan menggunakan perintah The dusk:fails menjalankan semula ujian yang gagal untuk menjimatkan masa:

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

    Perintah dusk menerima sebarang parameter yang membenarkan PHPUnit berjalan dengan betul. Contohnya, membenarkan anda menjalankan ujian dalam kumpulan tertentu: 🎜

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

    🎜

    Jalankan ChromeDriver secara manual

    🎜Secara lalai, Dusk akan cuba menjalankan ChromeDriver secara automatik. Jika ia tidak berfungsi pada sistem tertentu anda, anda boleh menjalankan ChromeDriver secara manual sebelum menjalankan perintah senja. Jika anda memilih untuk menjalankan ChromeDriver secara manual, anda perlu mengulas baris berikut dalam fail tests/DuskTestCase.php anda: 🎜

    $browser->clickLink($linkText);

    🎜Selain itu, jika ChromeDriver anda berjalan pada port bukan 9515, anda perlu mengubah suai kaedah driver dalam kelas yang sama: 🎜

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

    🎜🎜

    🎜🎜 Pemprosesan persekitaran🎜🎜Untuk Dusk menggunakan fail persekitarannya sendiri untuk menjalankan ujian, anda perlu mencipta fail .env.dusk.{environment} dalam direktori akar projek. Ringkasnya, jika anda ingin menggunakan persekitaran local untuk menjalankan perintah dusk, anda perlu mencipta fail .env.dusk.local . 🎜🎜Apabila menjalankan ujian, Dusk akan menyandarkan fail .env anda dan menamakan semula fail persekitaran Dusk anda kepada .env. Apabila ujian selesai, ia akan memulihkan fail .env anda. 🎜🎜🎜

    🎜🎜Mencipta penyemak imbas🎜🎜Mari kita tulis dahulu kes ujian, contoh ini Boleh mengesahkan bahawa kita boleh log masuk ke dalam sistem. Selepas menjana contoh ujian, kami boleh mengubah suai dan menjadikannya melompat ke antara muka log masuk Selepas memasukkan maklumat log masuk, klik butang "Log Masuk". Kami mencipta tika penyemak imbas melalui kaedah browse: 🎜

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

    🎜Dalam contoh di atas, kaedah browse menerima parameter panggil balik. Senja akan secara automatik menyuntik tika penyemak imbas ini ke dalam proses panggil balik dan tika penyemak imbas ini boleh berinteraksi dan menegaskan dengan aplikasi anda. 🎜

    🎜{tip} Contoh ujian ini boleh digunakan untuk menguji antara muka log masuk yang dijana oleh perintah make:auth. 🎜

    🎜

    Buat berbilang penyemak imbas

    🎜Kadangkala anda mungkin memerlukan berbilang penyemak imbas untuk menguji dengan betul. Contohnya, gunakan berbilang penyemak imbas untuk menguji halaman sembang dalam talian yang berkomunikasi melalui soket web. Jika anda ingin mencipta berbilang penyemak imbas, anda perlu menggunakan nama untuk membezakan tika penyemak imbas dalam panggilan balik kaedah semak imbas dan kemudian hantarkannya ke panggilan balik untuk "memohon" untuk berbilang tika penyemak imbas: 🎜

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

    🎜🎜

    Tukar saiz tetingkap penyemak imbas

    Anda boleh menggunakan kaedah resize untuk melaraskan saiz tetingkap penyemak imbas: 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');

    Kaedah maximize boleh memaksimumkan tetingkap penyemak imbas:

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

    Makro penyemak imbas

    Jika anda ingin menentukan satu, anda boleh menggunakannya dalam pelbagai ujian Untuk menggunakan semula kaedah penyemak imbas tersuai, anda boleh menggunakan kaedah makro dalam kelas Pelayar. Biasanya, anda harus memanggilnya daripada kaedah boot pembekal perkhidmatan:

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

    Kaedah makro menerima nama sebagai parameter pertama dan penutupan parameter kedua. Apabila makro penyemak imbas dipanggil sebagai kaedah pelaksanaan Pelayar, penutupan makro penyemak imbas akan dilaksanakan:

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

    🎜🎜

    🎜

    Pengesahan

    🎜Anda mungkin sering menguji beberapa halaman yang memerlukan pengesahan. Anda boleh menggunakan kaedah loginAs Dusk untuk mengelak daripada melog masuk ke halaman log masuk untuk setiap ujian. loginAs boleh menggunakan ID pengguna atau contoh model pengguna: 🎜

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

    🎜🎜{note} Selepas menggunakan kaedah loginAs, sesi pengguna akan diteruskan untuk digunakan oleh kes ujian lain . 🎜🎜🎜🎜🎜

    🎜

    Database Migration

    🎜Sama seperti contoh pengesahan di atas, apabila ujian Bila anda kes perlu dipindahkan, anda tidak seharusnya menggunakan ciri RefreshDatabase. Ciri RefreshDatabase menggunakan transaksi pangkalan data yang tidak berkenaan dengan permintaan HTTP. Sebaliknya, kami akan menggunakan ciri DatabaseMigration: 🎜

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

    🎜🎜🎜

    🎜

    Berinteraksi dengan elemen

    🎜🎜🎜

    🎜

    Senja pemilih

    🎜Pilih satu Pemilih CSS yang baik untuk interaksi elemen ialah salah satu bahagian yang paling sukar untuk menulis ujian Dush. Dari masa ke masa, perubahan pada bahagian hadapan boleh menyebabkan pemilih CSS seperti berikut untuk memecahkan ujian: 🎜

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

    🎜Pemilih senja membolehkan anda menumpukan pada menulis ujian yang berkesan dan bukannya menghafal pemilih CSS. Untuk menentukan pemilih, cuma tambahkan atribut dusk pada elemen HTML anda. Kemudian, tambahkan @ di hadapan pemilih untuk mengendalikan elemen tambahan dalam ujian Senja: 🎜

    $browser->acceptDialog();

    🎜🎜🎜

    🎜

    Klik pautan

    🎜Untuk mengklik pautan, anda boleh menggunakan kaedah clickLink pada contoh penyemak imbas. Kaedah clickLink akan mengklik pada pautan dengan teks paparan yang ditentukan: 🎜

    $browser->dismissDialog();

    🎜🎜{Nota} Kaedah ini boleh berinteraksi dengan jQuery. Jika tiada jQuery pada halaman, Dusk akan menyuntiknya secara automatik ke dalam halaman untuk memastikan ia tersedia semasa ujian. 🎜🎜🎜🎜🎜🎜🎜🎜

    Teks, Nilai & Sifat

    Dapatkan dan tetapkan nilai

    Senja menyediakan beberapa cara untuk berinteraksi dengan teks, nilai dan sifat yang dipaparkan pada masa ini. Contohnya, untuk mendapatkan "nilai" elemen yang sepadan dengan pemilih yang ditentukan, gunakan kaedah 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 teks teks Kaedah ini boleh digunakan untuk memadankan teks yang dipaparkan bagi elemen dalam pemilih yang ditentukan:

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

    Ambil atribut 🎜🎜Akhir sekali, < kod>atribut Kaedah ini boleh digunakan untuk memadankan atribut elemen dalam pemilih yang ditentukan: 🎜

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

    🎜🎜🎜

    🎜🎜Menggunakan borang🎜

    🎜🎜Nilai input🎜🎜Senja menyediakan pelbagai kaedah untuk berinteraksi dengan borang dan elemen input. Mula-mula mari kita lihat contoh memasukkan teks dalam kotak input: 🎜

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

    🎜Perhatikan bahawa walaupun kaedah type boleh melepasi pemilih CSS sebagai parameter, ini tidak diperlukan. Jika tiada pemilih CSS disediakan, Senja mencari input dengan atribut name yang sama. Jika masih tidak ditemui, Dusk akan cuba mencari textarea dengan nilai yang sama dengan atribut name. 🎜🎜Untuk menambahkan teks pada medan tanpa mengosongkan kandungannya, anda boleh menggunakan kaedah tambah: 🎜

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

    🎜Anda boleh menggunakan kaedah clear untuk mengosongkan nilai input: 🎜

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

    🎜🎜Menu lungsur🎜🎜Anda perlu memilih nilai dalam menu lungsur, anda boleh menggunakan kaedah select . Sama seperti kaedah type, kaedah select tidak semestinya memerlukan penghantaran dalam pemilih CSS. Apabila menggunakan kaedah select, anda harus lulus nilai sebenar pilihan dan bukannya teks paparannya: 🎜

    $browser->assertTitle($title);

    🎜 Anda juga boleh memilih pilihan secara rawak dengan meninggalkan argumen kedua: 🎜

    $browser->assertTitleContains($title);

    🎜🎜Checkbox🎜🎜Apabila menggunakan kotak semak "check", anda boleh menggunakan kaedah check. Seperti kebanyakan kaedah berkaitan input lain, ia tidak perlu untuk lulus dalam pemilih CSS. Jika pemilih tepat tidak ditemui, Senja akan mencari kotak pilihan yang sepadan dengan atribut nama: 🎜

    $browser->assertUrlIs($url);

    🎜🎜Butang Pilihan Tunggal🎜 🎜Apabila menggunakan pilihan butang radio dalam "pilih", anda boleh menggunakan kaedah radio. Seperti kebanyakan kaedah berkaitan input lain, ia tidak memerlukan pemilih CSS lulus. Jika pemilih tepat tidak ditemui, Senja akan mencari butang radio yang sepadan dengan atribut name atau atribut value: 🎜

    $browser->assertSchemeIs($scheme);

    🎜🎜🎜🎜🎜🎜

    Attachment

    Kaedah attach boleh melampirkan fail pada elemen input fail. Seperti kebanyakan kaedah berkaitan input lain, ia tidak memerlukan pemilih CSS lulus. Jika pemilih tepat tidak ditemui, Dusk akan mencari kotak input fail yang sepadan dengan atribut 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);

    {Nota} Kaedah attach memerlukan PHP Zip sambungan, pelayan anda mesti memasang sambungan ini.

    Menggunakan papan kekunci🎜🎜kunci kaedah Membolehkan anda memasukkan urutan input yang lebih kompleks ke dalam elemen yang ditentukan daripada kaedah type. Sebagai contoh, anda boleh menekan kekunci semasa memasukkan nilai. Dalam contoh ini, apabila menaip taylor, kekunci shift juga ditekan. Apabila taylor selesai menaip, otwell akan ditaip tanpa menekan sebarang kekunci: 🎜

    $browser->assertQueryStringMissing($name);

    🎜Anda juga boleh memilih elemen dalam apl anda dan tekan "Kekunci pintasan": 🎜

    $browser->assertFragmentIs('anchor');

    🎜{Tips} Semua kekunci papan kekunci yang dibungkus dalam {} ditakrifkan sepadan dalam kelas FacebookWebDriverWebDriverKeys, anda boleh a href="https://github.com/ facebook/php-webdriver/blob/community/lib/WebDriverKeys.php">Ditemui dalam GitHub🎜. 🎜

    🎜🎜🎜

    🎜🎜Gunakan tetikus🎜

    🎜

    Elemen klik

    Kaedah 🎜klik boleh digunakan untuk "klik" elemen yang sepadan dengan pemilih yang diberikan: 🎜

    $browser->assertFragmentBeginsWith('anchor');

    🎜

    Mouseover

    Kaedah 🎜mouseover boleh digunakan untuk tindakan alih tetikus pada elemen yang sepadan dengan pemilih yang diberikan: 🎜

    $browser->assertFragmentIsNot('anchor');

    🎜

    Seret dan lepas

    🎜 Kaedahdrag digunakan untuk menyeret elemen yang sepadan dengan pemilih yang ditentukan kepada elemen lain: 🎜

    $browser->assertHasCookie($name);

    🎜Atau, Elements boleh diseret dalam satu arah: 🎜

    $browser->assertCookieMissing($name);

    🎜🎜🎜

    🎜🎜Dialog JavaScript 🎜🎜Dusk menyediakan beberapa Cara untuk berinteraksi Kotak dialog JavaScript: 🎜

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

    🎜 Tutup kotak dialog JavaScript terbuka dengan mengklik butang OK: 🎜

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

    🎜 Tutup kotak dialog JavaScript terbuka dengan mengklik butang Batal (hanya sah untuk kotak dialog pengesahan): 🎜

    $browser->assertSee($text);

    🎜🎜🎜

    🎜🎜Skop pemilih🎜🎜Kadangkala anda mungkin mahu melakukan berbilang operasi dalam skop pemilih tertentu. Sebagai contoh, anda mungkin ingin menegaskan bahawa teks tertentu wujud dalam jadual dan kemudian klik butang dalam jadual. Keperluan ini boleh dicapai menggunakan kaedah with. Semua operasi yang dilakukan dalam fungsi panggil balik adalah terhad kepada pemilih asal: 🎜

    $browser->assertDontSee($text);

    🎜🎜🎜🎜🎜🎜

    Menunggu Elemen

    Apabila menguji aplikasi yang menggunakan JavaScript secara meluas, selalunya perlu "menunggu" elemen atau data yang ditentukan tersedia sebelum ujian. Senja memudahkannya. Menggunakan satu siri kaedah, anda boleh menunggu sehingga elemen halaman tersedia, atau sehingga ungkapan JavaScript yang diberikan dinilai kepada 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

    Tunggu

    Jika anda perlu menguji jeda untuk bilangan milisaat tertentu, anda boleh menggunakan kaedah jeda:

    $browser->assertNotChecked($field);

    Tunggu pemilih

    Kaedah waitFor boleh digunakan untuk menjeda pelaksanaan ujian sehingga elemen pada halaman yang sepadan dengan CSS yang diberikan pemilih dipaparkan. Secara lalai, pengecualian akan dilemparkan selepas jeda lebih daripada 5 saat. Jika perlu, anda boleh melepasi tamat masa tersuai sebagai parameter kedua: 🎜

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

    🎜 Anda juga boleh menunggu sehingga pemilih yang ditentukan hilang daripada halaman: 🎜

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

    🎜🎜 Pilih Skop apabila pemilih tersedia🎜🎜Sesekali anda mungkin mahu menunggu pemilih dan kemudian berinteraksi dengannya. Sebagai contoh, anda mungkin mahu menunggu tetingkap modal tersedia dan kemudian klik butang OK tetingkap modal. Kaedah whenAvailable boleh digunakan dalam situasi ini. Semua operasi elemen yang akan dilakukan dalam panggilan balik yang diberikan akan dihadkan kepada pemilih permulaan: 🎜

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

    🎜🎜tunggu teks🎜🎜waitForText< The /code > kaedah boleh digunakan untuk menunggu teks yang diberikan pada halaman dipaparkan: 🎜

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

    🎜🎜Tunggu pautan🎜🎜waitForLink kaedah digunakan Tunggu sehingga teks pautan yang diberikan dipaparkan pada halaman: 🎜

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

    🎜🎜Tunggu sehingga halaman melompat🎜🎜Selepas memberikan sesuatu seperti $browser->assertPathIs(' Apabila menegaskan laluan /home'), jika window.location.pathname dikemas kini secara tidak segerak, penegasan akan gagal. Anda boleh menggunakan kaedah waitForLocation untuk menunggu halaman melompat ke laluan tertentu: 🎜

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

    🎜 Anda juga boleh menunggu laluan yang dinamakan untuk melompat: 🎜

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

    🎜🎜Tunggu muat semula halaman🎜🎜Jika anda ingin menegaskan selepas halaman dimuat semula, anda boleh menggunakan kaedah waitForReload: 🎜

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

    🎜🎜Tunggu Ungkapan JavaScript 🎜🎜 Kadangkala anda ingin menjeda pelaksanaan ujian sehingga ungkapan JavaScript yang diberikan bernilai benar. Ini boleh dicapai dengan mudah menggunakan kaedah waitUntil. Hantarkan ungkapan kepada kaedah ini tanpa memasukkan kata kunci return atau koma bertitik penutup: 🎜

    $browser->assertVisible($selector);

    🎜🎜🎜Tunggu ungkapan Vue 🎜🎜Kaedah berikut boleh digunakan untuk menunggu sifat komponen Vue yang diberikan Mengandungi atau tidak tidak mengandungi nilai yang diberikan: 🎜

    $browser->assertPresent($selector);

    🎜🎜

    Tunggu panggilan balik

    Banyak kaedah "tunggu" Dusk bergantung pada kaedah waitUsing 方法。可以直接使用此方法来等待给定的回调返回 true。 waitUsing asas untuk menerima bilangan saat maksimum untuk menunggu, selang antara pelaksanaan penutupan, penutupan sedang dilaksanakan dan mesej kegagalan yang boleh dipercayai:

    $browser->assertMissing($selector);

    Buat Penegasan Vue

    Senja juga membolehkan anda membuat penegasan tentang keadaan data komponen Vue. Sebagai contoh, katakan aplikasi anda mengandungi komponen Vue berikut:

    $browser->assertDialogOpened($message);

    Anda boleh membuat penegasan berikut tentang keadaan komponen Vue:

    $browser->assertEnabled($field);

    Available Assertions

    Dusk menyediakan satu siri kaedah penegasan yang tersedia. Semua penegasan adalah seperti berikut:

    .

    assertHostIsNot

    assertPortIs
    assertPortIsNot
    assertPathBeginsWith
    assertPathIs
    assertPathIs
    
    assertRouteIs
    assertQueryStringHas
    assertQueryStringMissing
    assertFragmentIs
    assertFragmentBeginsWithFragmentBeginsWith
    assertHasCookie
    assertCookieMissing
    assertCookieValue
    assertPlainCookieValue
    assertSee
    assertCookieValue
    assertPlainCookieValue
    assertSee
    assertSeeassert
    Seease
    assertDontSeeIn
    assertSourceHas
    assertSourceMissing
    assertSeeLink
    assertDontSeeLinkassert assertInputValueIsNot
    assertChecked
    assertNotChecked
    assertRadioSelected
    assertRadioNotSelected
    assertSelected
    assertNotSelected
    assertSelectHasOptions
    assertSelectMissingOptions
    assertSelectHasOption
    assertValue
    assertValue
    Visible sent
    assertMissing
    assertDialogOpened
    assertEnabled
    assertDisabled
    assertFocused
    assertFocused
    
    assertVue
    assertVueIsNot
    assertVueContainsassertVueDoesNotContain

    assertTitle

    Tegaskan bahawa tajuk halaman sepadan dengan teks yang ditentukan:

    $browser->assertDisabled($field);

    tains Tegaskan bahawa tajuk halaman mengandungi teks yang ditentukan:

    $browser->assertFocused($field);

    assertUrlIsTegaskan bahawa URL semasa (tanpa rentetan pertanyaan) sepadan dengan rentetan yang ditentukan:

    $browser->assertNotFocused($field);

    tegaskan URL yang diberi

    rentetan:

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

    assertschemeisnot

    assert bahawa URL semasa sepadan dengan rentetan yang diberikan:

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

    e

    asserthostis

    assert bahawa tuan rumah url semasa sepadan dengan nilai yang diberikan:

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

    Asserthostisnot

    assert bahawa tuan rumah URL semasa tidak sepadan dengan nilai yang diberikan:

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

    e

    assertportis

    assert bahawa nilai port url semasa sepadan dengan nilai yang diberikan:

    php artisan dusk:page Login

    e

    assertPortIsNot

    Tegaskan bahawa nilai port URL semasa tidak sepadan dengan nilai yang diberikan:

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

    assertPathAsertBegin semasa URL

    rreeee

    assertPathIs

    Tegaskan bahawa laluan semasa sepadan dengan laluan yang ditentukan:

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

    assertPathIs tidak sepadan dengan laluan semasa

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

    assertrouteis

    Assert bahawa url semasa sepadan dengan url yang ditentukan dari laluan yang dinamakan:

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

    e

    assertQuerystringhas

    assert bahawa parameter rentetan pertanyaan yang ditentukan wujud:

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

    e

    assert bahawa parameter rentetan pertanyaan yang ditentukan wujud dan mempunyai nilai yang ditentukan:

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

    assertQueryStringMissing

    Tegaskan bahawa parameter rentetan pertanyaan yang ditentukan tidak wujud:

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

    🎜

    assertFragmentIs

    Tegaskan bahawa serpihan semasa sepadan dengan serpihan yang ditentukan:

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

    assertFragmentBeginsWith

    Assert fragment

    mulakan fragmen semasa:

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

    assertFragmentIsNot

    Assert bahawa serpihan semasa tidak sepadan dengan serpihan yang ditentukan:

    php artisan dusk:component DatePicker

    assertHasCookie

    Tegaskan bahawa kuki yang dinyatakan wujud:

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

    Tegaskan bahawa kuki yang dinyatakan tidak wujud :

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

    assertCookieValue

    Tegaskan bahawa kuki itu wujud dengan nilai yang dinyatakan:

    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

    Pluessertasertayang

    kuki yang tidak disulitkan wujud dengan nilai yang ditentukan:

    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

    .

    assertSeeIn

    Tegaskan bahawa pemilih wujud dalam skop Teks yang ditentukan:

    {  "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" 
                        }  
                      }  
                }
           }

    assertDontSeeIn

    pilih tidak wujud dalam 🜎

    pilih tidak wujud dalam julat yang ditentukan

    assertSourceHas Tegaskan bahawa kod sumber yang dinyatakan wujud pada halaman semasa:

    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

    assertSourceMissingTegaskan bahawa kod sumber yang dinyatakan tidak wujud pada halaman semasa.

    :

    tegaskanSeeLink

    Tegaskan bahawa pautan yang dinyatakan wujud pada halaman semasa:

    APP_URL=http://127.0.0.1:8000

    tegaskanDontSeeLink

    Tegaskan bahawa pautan yang dinyatakan tidak wujud pada halaman semasa

    :

    assertInputValue

    Tegaskan bahawa kotak input mengandungi nilai yang ditentukan:

    rrreee

    assertInputValueIsNot

    Assert input Kotak tidak wujud dengan nilai yang ditentukan:

    rrreee

    Menegaskan bahawa yang dinyatakan kotak semak ditandakan:

    rrreee

    assertNotChecked

    Tegaskan bahawa kotak pilihan yang ditentukan tidak ditandakan:

    rrreee

    assertRadioSelected

    Tegaskan bahawa butang radio yang ditentukan telah dipilih:

    assertRadioNotSelected

    Tegaskan radio yang ditentukan Butang pilih tidak dipilih:

    rrreee

    assertSelected

    Tegaskan bahawa kotak lungsur dipilih dengan nilai yang ditentukan:

    rrreee

    Tegaskan bahawa penurunan- kotak bawah tidak dipilih dengan nilai yang ditentukan Nilai: rrreee

    assertSelectHasOptions

    Menegaskan bahawa nilai yang dipilih bukan nilai dalam tatasusunan yang ditentukan: rrreee

    HasOption

    Tegaskan pilihan kepada nilai yang ditentukan:

    rrreee

    assertValue

    Tegaskan bahawa unsur dalam julat pemilih wujud dengan nilai yang ditentukan:

    rrreee

    tegaskan Elemen dalam skop pemilih boleh dilihat: rrreee

    assertPresent

    Tegaskan bahawa elemen dalam skop pemilih hadir: rrreee

    pilih

    pilih elemen dalam skop pemilih atau skop Tidak wujud:

    rrreee

    assertdialogopened

    assert bahawa kotak dialog JavaScript dengan mesej yang ditentukan telah dibuka:
    rrreeee

    assertenabled

    assert bahawa medan yang ditentukan diaktifkan:

    rrreee

    .

    tegaskan Tidak Fokus

    tegaskan Tumpuan bukan pada medan yang ditentukan:

    rrreee

    assertVue

    Tegaskan bahawa sifat data komponen Vue sepadan dengan nilai yang ditentukan:

    rrreee

    assertVueIsNot

    Tegaskan bahawa sifat data komponen Vue tidak sepadan dengan nilai yang ditentukan:

    rrreee

    assertVueContains

    Tegaskan bahawa tatasusunan itu mengandungi data dan komponen itu nilai yang ditentukan:

    rrreee

    assertVueDoesNotContain

    Tegaskan bahawa sifat data komponen Vue ialah tatasusunan, dan tatasusunan tidak mengandungi nilai yang ditentukan:

    rrreee

    e

    Kadangkala, anda perlu menguji satu siri tindakan yang kompleks, Ini boleh membuat kod ujian sukar dibaca dan difahami. Tindakan semantik boleh ditakrifkan melalui halaman, dan kemudian satu kaedah boleh digunakan dalam halaman yang ditentukan. Halaman juga boleh menentukan pintasan kepada pemilih yang biasa kepada aplikasi atau halaman individu.

    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

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

    Jana halaman

    senja:halaman Perintah Artisan boleh menjana objek halaman. Semua objek halaman terletak dalam direktori tests/Browser/Pages: rrreee

    🎜🎜Halaman konfigurasi🎜🎜Halaman ini mempunyai 3 kaedah secara lalai: url, assert dan elements. Di sini kami mula-mula menerangkan kaedah url dan assert secara terperinci Kaedah elements akan menjadi singkatan pemilih Terperinci dalam 🎜. 🎜

    🎜🎜 Kaedah url 🎜🎜 Kaedah url hendaklah mengembalikan laluan yang mewakili URL halaman. Senja akan menggunakan URL ini dalam penyemak imbas untuk menavigasi ke halaman tertentu: 🎜rrreee

    🎜🎜 kaedahassert 🎜🎜assert < kaedah /code> boleh membuat sebarang penegasan untuk mengesahkan bahawa penyemak imbas berada pada halaman yang ditentukan. Kaedah ini tidak diperlukan. Anda boleh membuat pernyataan ini berdasarkan keperluan anda sendiri. Penegasan ini akan dilaksanakan secara automatik apabila anda menavigasi ke halaman ini: 🎜rrreee🎜🎜🎜

    🎜🎜Navigasi ke Halaman 🎜🎜Setelah halaman dikonfigurasikan, anda boleh menggunakan kaedah lawat untuk menavigasi ke halaman: 🎜rrreee🎜 Kadangkala, anda mungkin sudah berada di halaman yang ditentukan dan anda hanya perlu "memuatkan" pemilihan halaman semasa menambah pembina dan kaedah kepada ujian semasa. Contoh biasa ialah: apabila anda menekan butang, anda akan diubah hala ke halaman yang ditentukan dan bukannya menavigasi terus ke halaman yang ditentukan. Dalam kes ini, anda perlu menggunakan kaedah on untuk memuatkan halaman: 🎜rrreee🎜🎜🎜🎜🎜🎜

    Singkatan pemilih

    Kaedah elemen membolehkan anda mentakrifkan trengkas yang mudah dan mudah diingat untuk mana-mana pemilih CSS dalam halaman. Sebagai contoh, mari kita takrifkan singkatan untuk medan input e-mel pada halaman log masuk apl: 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

    Kini anda boleh menggunakan singkatan ini menggantikan pemilih penuh CSS yang anda gunakan sebelum ini dalam halaman:

    rrreee

    Singkatan pemilih global

    Selepas memasang Dusk, kelas asas Halaman disimpan dalam ujian anda / Pelayar/Halaman direktori. Kelas ini mengandungi kaedah siteElements, yang boleh digunakan untuk mentakrifkan singkatan pemilih global, supaya setiap halaman dalam aplikasi anda boleh menggunakan singkatan pemilih global ini: rrreee

    Kaedah halaman

    Selain kaedah lalai yang telah ditakrifkan dalam halaman, anda juga boleh mentakrifkannya sepanjang proses ujian kaedah lain yang digunakan. Sebagai contoh, katakan kami sedang membangunkan aplikasi pengurusan muzik Dalam aplikasi, kami mungkin memerlukan kaedah awam untuk membuat senarai Daripada menulis semula logik untuk mencipta senarai main dalam setiap halaman dan setiap kelas ujian, pada masa ini anda boleh tentukan kaedah createPlaylist dalam kelas halaman anda:

    rrreee

    Selepas kaedah ditakrifkan, anda boleh menggunakan kaedah ini dalam mana-mana ujian yang menggunakan halaman. Contoh penyemak imbas secara automatik akan melepasi kaedah halaman: rrreee

    komponen

    komponen serupa dengan "halaman Senja" Objek", tetapi ia lebih kepada UI dan serpihan berfungsi yang kerap digunakan semula sepanjang keseluruhan aplikasi, seperti bar navigasi atau tetingkap pop timbul pemberitahuan maklumat. Oleh itu, komponen tidak terikat pada URL eksplisit.

    🎜Penjanaan komponen🎜🎜Untuk menjana komponen, gunakan perintah Artisan senja: komponen untuk menjana komponen. Komponen yang baru dijana terletak dalam direktori test/Browser/Components: 🎜rrreee🎜Seperti yang ditunjukkan di atas, ini ialah contoh menjana komponen "pemilih tarikh" yang boleh digunakan di seluruh banyak halaman dalam permohonan anda. Menulis logik automasi penyemak imbas secara manual untuk pemilihan tarikh merentas sebilangan besar halaman ujian merentas suite ujian akan menyusahkan. Alternatif yang lebih mudah ialah mentakrifkan komponen Senja yang mewakili pemilih tarikh, dan kemudian merangkum logik automasi dalam komponen: 🎜rrreee🎜🎜🎜🎜🎜🎜🎜Penggunaan komponen🎜🎜Setelah definisi komponen selesai, pada mana-mana halaman ujian Memilih tarikh adalah mudah dengan pemilih tarikh. Dan, jika anda perlu mengubah suai logik tarikh yang dipilih, cuma ubah suai komponen ini: 🎜rrreee🎜🎜🎜🎜🎜🎜🎜Integrasi Berterusan🎜🎜🎜🎜🎜🎜🎜

    CircleCI

    Jika anda menggunakan CircleCI untuk menjalankan ujian Senja, anda boleh merujuk kepada fail konfigurasi ini sebagai titik permulaan. Seperti TravisCI, kami akan memulakan pelayan web terbina dalam PHP menggunakan perintah php artisan serve: 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

    🎜Untuk menjalankan ujian Senja dalam Codeship🎜, anda perlu menambahkan perintah berikut pada projek Codeship anda. Sudah tentu, arahan ini hanyalah contoh, jangan ragu untuk menambah arahan tambahan seperti yang diperlukan: 🎜rrreee🎜🎜🎜

    🎜🎜Heroku CI🎜🎜Apabila menjalankan ujian Senja dalam Heroku CI🎜, sila tambah pek binaan dan skrip Google Chrome berikut ke dalam anda Fail Heroku app.json: 🎜rrreee🎜🎜🎜

    🎜 🎜Travis CI🎜🎜Apabila menjalankan ujian Senja dalam Travis CI🎜, anda boleh merujuk kepada konfigurasi .travis.yml. Memandangkan Travis CI bukan persekitaran grafik, kami perlu mengambil beberapa langkah tambahan untuk melancarkan penyemak imbas Chrome. Selain itu, kami akan menggunakan php artisan serve untuk memulakan pelayan web terbina dalam PHP: 🎜rrreee🎜Dalam fail .env.testing, laraskan APP_URL Nilai: 🎜rrreee🎜Artikel ini pertama kali diterbitkan di laman web 🎜LearnKu.com🎜. 🎜🎜

    ← Kit Alat Perdagangan Juruwang

    Alat penyebaran utusan →

    serahkan

    Laman web PHP Cina

    RumahKursusArtikelSoal JawabKamusManualMuat turuncari APPMuat turun