Why Behat/Mink cant't find input field by ID, only by name? - testing

I am testing page with behat and filling form.
I have two password inputs in page html.
First is on top:
<input id="login_password_0" class="form-control " type="password" placeholder="Slaptažodis" autocomplete="off" name="password">
Second at the bottom:
<input id="password" class="form-control validate" type="password" value="" name="password">
Then I run behat/mink test with:
And I fill in "password" with "test"
It fills first one and I need second to be filled.
How to understand documentation, that element can be found and filled by 'id|name|label|value'.
P.S. Changing HTML is not an option.

Haven't tested but it looks like that Behat is performing a task only once. He has no idea that there could be two elements with the same name. "Name" attribute should be unique for one form. Otherwise, you'll be posting two elements with the same name.
Without fixing your HTML nothing is possible, unless you implement your own test which overcomes this issue. Now "password" is both "id" and 2x "name" attribute. Selector should be unique.

Related

How do I locate makemytrip.com 'From City' input field in Selenium?

Below is the html details for the field:
<input type="text" autocomplete="off" role="combobox" aria-autocomplete="list" aria-owns="react-autowhatever-1" aria-expanded="true" class="react-autosuggest__input react-autosuggest__input--open" placeholder="From" value="">
Tried below for the same field but not working:
//div[#class='fsw_inputBox searchCity inactiveWidget activeWidget']/div/div/div/div/input
Here you go:
//input[#id='fromCity']
Just a suggestion, please try to avoid using indexes in your xpaths as much as possible. With indexes, in case if there is one more element added in the DOM(may be because of change in design or for some new feature addition) the xpaths may no more remain valid and will result in your script failure.
Please try with CSS selector
input[placeholder="From"]
Above selector will give you only one result.

Get selected content in a number input when click

I guess is not too much difficult but your help will be useful as always.
I had before a text input where the user if click in it select all the content from this input to be able to replace faster his content like in the next example:
<input type="text" value="whatever" onclick="this.setSelectionRange(0, this.value.length)">
So, my question will be, how can I do the same behaviour in a numeric input like the next one?
<input type="number" value="1111">
I tried to add obviously this onclick="this.setSelectionRange(0, this.value.length)" but seems only to work on the text inputs.
Actually, was easy.
I found this solution that works good.
<input type="number" value="111" onclick="this.select();">

A field in my app has 2 html codes. When I use OR in its Xpath then it is not detecting the Element. Can anyone help me making an appropriate xpath

A field in my application has two HTML codes. I want to use OR in its XPath so that in any HTML code the command can run. But I am unable to use OR in the xpath. It's not detecting the field when I use OR. Below are both the two HTML code. Can anyone make an XPath using OR so that it runs always?
First HTML Code-
<input autocomplete="off" class="text" maxlength="30" tabindex="2" type="password" id="pswd-input" name="password" onfocus=" pswdLabel.style.display='none';pswdWrap.style.margin='0' " onblur="if(this.value==''){pswdLabel.style.display='block';pswdWrap.style.margin='0 0 -14px'}else{pswdWrap.style.margin='0'} ">
and this is Second HTML code-
<input type="password" name="password" maxlength="35;" autocomplete="off" size="37" value="">==$0
Any help will be appreciated...
Try using Pipe (|) operator
driver.findElement(By.xpath("//input[#id='pswd-input'] | //input[#type='password']"));
You were pretty close:
driver.findElement(By.xpath("//input[#id='pswd-input' or #type='password']"));
but why do you need to OR when both versions have type="password" and name="password"? Wouldn't a simple By.name be better? It would match both of these elements:
driver.findElements(By.name("password"));

Geb: How to add new attribute and its value

I have an input element where I need to set one extra attribute and its value.
<input autocomplete="off" id="to_input" name="to" class="form-control arrival ui-autocomplete-input" placeholder="To" data-input-component="searchCondition" data-input-support="suggest" type="text">
I need to add the below attribute:
How can I do this in Geb?
To say a little more details, when I enter TPE in the input text box, some dropdown items appears and when I select one of them like
"Taipei, XXX.. (TPE)"
Than the new attributes are set automatically same as the picture above.
The only way to do it, is using JavaScript executor:
browser.driver.executeScript("your script")
And script using jquery will look like:
$('jquery-selector').attr('attribute-name', 'attribute-value');
Of course make sure to fill in your data in quotes!

Can't select label by text when label contains more than text

I am driving myself bonkers with this.
I have three form fields in a form:
Customer: required dropdown field
Weight: required text field
Status: optional text field
Each element has that label. The required fields' labels contain a span with an asterisk.
I'm using Xpather in Chrome. When I search for this, I receive 2 results, when I should get 3:
//*[contains(text(),'t')]
This makes no sense to me At All.
Customer, which is working:
<label for='customer-field'>
<span class='required-marker'>*</span>
Customer
<input id='customer-field' type='text' />
</label>
Weight, which is not working:
<label class='control-label'>
<span id='ctl01_requiredMarker' class='required-marker'>*</span>
Weight
</label>
Status, which is working:
<label class='control-label'>
Status
</label>
The only workaround that works for me is removing the required marker from the Weight label container. However, that doesn't explain how "Customer" gets matched at all.
Noteworthy: I'm trying to automate testing this page, so I can't really remove that span tag.
What's going on? And/or what do I do?
Try changing your XPath to the following:
//*[text()[contains(.,'t')]]
The source of this fix breaks it down far better than I could've done, so refer to that for detailed explanation! I've tested it myself using the XPath Checker extension for Firefox, and it matches your three items.
Try with the below method
driver.findElement(By.xpath("//span[#class='required-marker']/..")).getText().contains("Weight")
Please Let me know above method is working or not.
I think your html is where the issue lies.
This is probably what your html should look like:
<span class='required-marker'>*
<label for='customer-field'>Customer</label>
<input id='customer-field' type='text' />
</span>
<span id='ctl01_requiredMarker' class='required-marker'>*
<label class='control-label'>Weight</label>
</span>
<label class='control-label'>Status</label>
Are you using Selenium or WebDriver? What does WebDriver return as a response? Also make sure you add a "." before the xpath like .//*[contains(text(),'t')]
What does this print?
List<WebElement> elements = driver.findElement(By.xpath(".//*[contains(text(),'t')]"));
s.o.p(elements.size());