Wie überprüfen wir Twitter Bootstrap Radio Buttons mit Laravel Dusk?

Question

Nach twitter bootstrap, das ist, wie wir ein Radio tun:

<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> 

Und dies ist mein Code:

$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') 
; 

Mit der Eingabe in dem Label-Tag. Aber das Problem ist, dass Dusk (eigentlich Facebook Webdriver) es nicht so finden kann. Es hält Anhebung:

Facebook\WebDriver\Exception\ElementNotVisibleException: element not visible 

Um es Ich habe den Eingang außerhalb des Etiketts setzen funktioniert, aber dann natürlich die Bootstrap-Radio zeigt nicht, wie es sollte mehr.

<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> 

Funktioniert nicht IDs unter Verwendung von entweder:

noch keine ID an die Eingangseinstellung:

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

und zu versuchen, es auf diese Weise zu wählen:

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

Die Problem ist, dass Dusk (Webdriver) das Element auf der Seite nicht einmal sehen kann, da dies genauso scheitert wie der gleiche Weg:

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

in Resultierende:

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

Und das geschieht jedes Mal, wenn ich ein Formular mit einem Eingang habe mit einem Etikett um ihn herum, wenn ich aus dem Etikett den Eingang nehmen, es funktioniert. Aber das ist bei Radios nicht so einfach, wie bei einigen anderen Eingängen, Radios.

Dies ist ein richtig codiert Radio:

Dies ist ein Radio mit dem Eingang außerhalb des Label-Tag:

Also, wie machst du das?

Answer 1

Sie können nicht glücklich sein, Ihre Ansichten zum Wohle Ihrer Testskript zu bearbeiten, aber wenn Sie zu, dass offen, was eine Klasse zum

<input type="radio" ... > 

Hinzufügen und dann

 ->click('.yourClass') 

mit

in Ihrem Dusk-Test?

Answer 2

Mein Formular hat eine Optionsschaltfläche. So wie ich es überprüft habe.

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

Dies funktioniert für mich. Ich denke, das wird dir helfen.