liguofeng29’s blog

個人勉強用ブログだっす。

groovy,geb(selenium),spockによる自動化テスト その4

Geb API

form, input, checkbox, radioなどのHTMLElementの操作する

script4.html

<form id="form1">
    <div class="input1">
        <input name="username1" type="text" placeholder="input your name">
        <input name="password1" type="text" placeholder="input your password">
    </div>
    <div class="input2">
        <input name="username2" type="text" placeholder="input your name">
        <input name="password2" type="text" placeholder="input your password">
    </div>
        <div class="input3">
        <input name="username3" type="text" placeholder="input your name">
        <input name="password3" type="text" placeholder="input your password">
    </div>
</form>


<form id="form2">
    <input type="checkbox" name="checkbox1" value="single-check1"/>
    <input type="checkbox" name="checkbox2" value="single-check2"/>
</form>

<form id="form3">
    <input type="checkbox" name="multicheck" value="multi-check1"/>
    <input type="checkbox" name="multicheck" value="multi-check2"/>
    <input type="checkbox" name="multicheck" value="multi-check3"/>
</form>

<form id="form4">
    <input type="radio" name="sex" value="male" />
    <input type="radio" name="sex" value="female" />
</form>

<form id="form5">
    <input type="file" name="csvFile" />
</form>

<form id="form6">
    <select name="optionlist1">
        <option value="1">option1</option>
        <option value="2">option2</option>
        <option value="3">option3</option>
    </select>
    <select name="optionlist2">
        <option value="1">option1</option>
        <option value="2">option2</option>
        <option value="3">option3</option>
    </select>
</form>

script4_Geb_API.groovy

/**
 * Geb API
 *
 * http://www.gebish.org/manual/
 */
import geb.Browser

def testPage = new File('src/main/java/html/script4.html')

Browser.drive {
    // 指定URLでブラウザオープン
    go testPage.toURI().toString()

    /**************/
    /** for form **/
    /**************/
    // direct
    $('input', name: 'username1').value("ユーザ1")
    $('input', name: 'password1').value("パスワード1")

    // use shortcuts
    def form = $('#form1')
    form.username2 = "ユーザ2"
    form.password2 = "パスワード2"

    // use with
    $('#form1').with {
        username3 = 'ユーザ3'
        password3 = 'パスワード3'
    }

    // get value
    println ($('input', name: 'username1').value())
    println ($('#form1').password1)

    /******************/
    /** for checkbox **/
    /******************/
    // click and set value
    $('input', name: 'checkbox1').click()
    $('checkbox', name: 'checkbox1').value(true) // or false

    // click and set value with shortcut
    $('#form2').checkbox2().click()
    $('#form2').checkbox2().value(false)       // or true

    // get value
    println ($('input', name: 'checkbox1').value())
    println ($('#form2').checkbox2().value())


    /************************/
    /** for multi-checkbox **/
    /************************/
    $('#form3').multicheck = true // check all
    println ($('#form3').multicheck) // [multi-check1, multi-check2, multi-check3]

    /************************/
    /** for radio          **/
    /************************/
    $('#form4').sex = "female" // set
    println ($('#form4').sex)  // get female
    assert $('#form4').sex == 'female' // assert

    /************************/
    /** for input file     **/
    /************************/
    // need to set absolute path
    $('#form5').csvFile = new File("src/main/java/csv/data.csv").getAbsolutePath()
    // Or
    // $('input', name : 'csvFile').value('../csv/data.csv')

    /*************************/
    /** for drop-down select**/
    /*************************/
    $('select', name: 'optionlist1').value('2') // Or 'option2'

    // use shortcut
    $('#form6').optionlist2 = 'option3'
    // $('#form6').optionlist = 3

    // get value
    println ($('#form6').optionlist1) // print 2

    // assert
    assert $('#form6').optionlist2 == '3'

    sleep 10 * 1000

}.quit()

f:id:liguofeng29:20170301201129g:plain