Get Element By Xpath (Geb)

Question

I have problem with getting Element by Xpath. I use Spock with Geb. I have HTML:

<form class="form" style="display: block;">
<div class="crm-field">
<div class="req label">
<span class="required">*</span>
Моё Имя:
</div>
<div class="value">
<input class="signup" type="text" style="background-color: rgb(255, 255, 255);">
</div>
</div>

<div class="crm-field">
<div class="req label">
<span class="required">*</span>
Login:
</div>
<div class="value">
<input class="signup" type="text" style="background-color: rgb(255, 255, 255);">
</div>
</div>

<div class="crm-field">
<div class="req label">
<span class="required">*</span>
Мой E-mail:
</div>
<div class="value">
<input class="signup" type="text" style="background-color: rgb(255, 255, 255);">
</div>
</div>

<div class="crm-field">
<div class="req label">
<span class="required">*</span>
Пароль:
</div>
<div class="value">
<input class="signup" type="text" style="background-color: rgb(255, 255, 255);">
</div>
</div>

I need get <input class="signup" type="text" style="background-color: rgb(255, 255, 255);"> for write string. But Geb use only CSS search. Please help my get all input and how i can write text to input.

I use for getting element:

 driver.findElement(By.xpath("//html/body/div[3]/div[2]/form/div[2]/div[2]/input")) << arg

But I did not get.

Answer 1

Geb doesn't support XPath expressions but you can still get the elements you need using Geb's indexed css selectors. Please note that those indexes are 0 based in contrary to XPath's 1 based indexes. For example:

$('form.form > div', 1).find('input')

EDIT

Actually, Geb now supports XPath expressions. Bear in mind that it has not yet been released and is only available in the latest snapshot, 0.10.1-SNAPHOT.

Answer 2

You haven't made clear which one you need, since they are all similar. However, in cases like this, work in a slightly different way than positional XPath.

That means, get something that close to what you need, and move about the DOM around that.

For instance, if you need the input need the Email label (presumably to type in the Email). You would first get the Email label (it's near what you need):

//div[contains(text(), 'Email')]

You'd then get the div next door to this, that is, the div directly after this one, making this query:

//div[contains(text(), 'Email')]/following-sibling:div

You've then be able to say, well I want the input inside this div, so it becomes:

//div[contains(text(), 'Email')]/following-sibling:div/input[@type='text']

You then have uniquely identified the input element, where you can enter in the Email.