Select with Intern over CSS Selector ID Input Field

Question

Hey i want to select with Intern over CSS Selector ID this input field and put some text in.

<div class="controls input-group has-success">
<input id="billingAddress.firstName" class="form-control valid" type="text" required="" value="" name="billingAddress.firstName" from="1..3" placeholder="" autocomplete="given-name">

I try this commands but nothing works for me:

findByCssSelector('form input[name=billingAddress.firstName]')

findByCssSelector('form input[name="billingAddress.firstName"]')

findByCssSelector('form input[ID=billingAddress.firstName]')

findByCssSelector('form input[ID="billingAddress.firstName"]')

findByCssSelector('input#billingAddress\\.firstName')

findById('billingAddress\.firstName')

findById('billingAddress\\.firstName')

Example Code:

findById('billingAddress\.firstName')
        .click()
        .type('test')
        .sleep(200)
        .end()

Could anyone possibly help me with that problem. Thank you everybody for looking in my problem.

Answer 1

For findByCssSelector using attributes, the attribute value should be quoted, like:

.findByCssSelector('input[id="billingAddress.firstName"]')

For findById, you don't need to escape periods (the ID is just a string, not a regex):

.findById('billingAddress.firstName')

In a quick test with your HTML snippet, both of these work.