laravel - 我们如何使用 Laravel Dusk 检查 Twitter Bootstrap 单选按钮？

Question

根据 twitter bootstrap ，这就是我们制作 radio 的方式:

<div class="radio">
  <label>
    <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
    Option one is this and that&mdash;be sure to include why it's great
  </label>
</div>

这是我的代码:

$browser->click('#menu-reports')
        ->waitForText('Users')
        ->click('#menu-reports-users')
        ->radio('sitesActive', '2')
        ->radio('includeDisabled', '2')
        ->radio('includeNonCertifiable', '2')
        ->press('Apply')
        ->waitForText('Showing 0 to 0 of 0 entries')
;

在 label 标签内输入。但问题是 Dusk(实际上是 Facebook Webdriver)无法通过这种方式找到它。它不断提高:

Facebook\WebDriver\Exception\ElementNotVisibleException: element not visible

为了让它工作，我将输入放在了标签之外，但是，当然，boostrap radio 不再像它应该的那样显示了。

<div class="radio">
  <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
  <label>
    Option one is this and that&mdash;be sure to include why it's great
  </label>
</div>

使用 ID 也不起作用:

甚至没有为输入设置 ID:

<input 
   type="radio" 
   name="sitesActive" 
   id="sitesActive3" 
   value="2"
>

并尝试以这种方式选择它:

->radio('#sitesActive3', '2')

问题是 Dusk (Webdriver) 甚至看不到页面中的元素，因为这个简单的 like 以完全相同的方式失败:

$browser->waitFor('#sitesActive3');

导致:

Facebook\WebDriver\Exception\TimeOutException: Waited 5 seconds for selector [#sitesActive3].

每当我有一个带有标签的输入表单时，就会发生这种情况，如果我从标签中取出输入，它就会起作用。但这对于 radio 来说并不像其他一些输入、 radio 那样简单。

这是一个正确编码的 radio :

这是一个在 label 标签外输入的 radio :

那么，你是怎么做到的？

Answer 1

我的表单有一个单选按钮。我就是这样检查的。

userCreate.blade.php

<div class="row">
    <div class="col-md-12">
        <div class="form-group">
            <label>Gender</label>
            <div>
                <label class="radio-inline">
                    <input type="radio" id="gender" name="gender" value="m">Male
                </label>
                <label class="radio-inline">
                    <input type="radio" id="gender" name="gender" value="f">Female
                </label>
            </div>
        </div>
    </div>
</div>

CreateUserTest.php

class CreateUserTest extends DuskTestCase
{

    public function  testCreateForm()
    {
        $this->browse(function (Browser $browser) {
            $browser->visit('/user/create')
                ->radio('#gender', 'm')
                ->click('button[type="submit"]')
                ->assertSee('Successfully created user.');
        });
    }
}

这对我有用。我认为这会对您有所帮助。