Change value of input using Selenium - selenium

I'm using Selenium IDE to fill out a form. It's not my website, so I cannot change the code. I've managed to do most of the things, the only input I'm struggling to put the data on is this one, which uses a datepicker/calendar instead of the a "traditional" input:
<input class="rich-calendar-input " id="dtEmissaoInputDate" maxlength="10" name="dtEmissaoInputDate" onkeypress="IsNumber(this,event);mascaraData(this,event);" size="15" style="vertical-align: middle; " type="text" value="09/10/2019" readonly="readonly">
Since I'm new to Selenium, I'd like to know how to change the value of that input using the data I have on an array. I've already searched older questions to see what I could find, but most of the answers use older syntax.
Thanks in advance for the answers.

You can use Javascript to accomplish this. You can call executeScript to modify the value attribute of your desired element.
executeScript("document.getElementById('dtEmissaoInputDate').setAttribute('value', 'yourTextHere')");
You can also pass the element in directly:
executeScript("arguments[0].setAttribute('value', 'yourTextHere')", inputElement);
Hope this helps a bit.

Found the solution. Based on #Christine's answer, I was to solve the issue using Javascript and run script command:
"command": "runScript",
"target": "document.getElementById('dtEmissaoInputDate').value='01/01/2018'",

Related

Xpath finder for selenium using python -automation

I am trying to find an unique xpath for the below element, please advice if there are any better xpaths to make it for general text as I have currently given for that specific name.
<td tabindex="4" style="text-align: left;" title="name" class="">Name</td>
xpath i am using: //td[#title='name']
here if the name is changed with something else in the code, this wouldn't work, could someone help me identify unique xpath which works in general for any text. Thanks!
You can concatenate (using and / or) multiple attributes of element to find the element precisely .
By.xpath("//td[#title= 'name' and contains(text(), 'Name')]")
However we need to see more details of the code and your DOM of page to find element.
There will always be some element which will never change in the page(like name of table) using that as a relative point ,we can refer to the row of the table.
the simplest way to find the XPath of any element is to go to the developer options and select the markup of the element you want XPath of.
Right Click -> Copy -> XPath
I believe this is the simplest way. And you will also where you are doing wrong.
Screenshot attached for your reference.
I have used the general syntax - "//td[text()='{}']" and passing the name parameter when i define a method so that it won't be specific to one and others can test using the same locator with their name changed when someone else uses the testcase.
Thanks everyone for your response!

Unable to locate the login box by type attribute or xpath

HTML looks like following
<input class="text-input text-input-md" dir="auto" ng-reflect-klass="text-input" ng-reflect-ng-class="text-input-md" type="email" aria-labelledby="lbl-14" autocomplete="off" autocorrect="off" placeholder="" ng-reflect-type="email">
the code fails to find login box...tried by attribute
var email_xpath = "//*[type='email']"
then xpath
var email_xpath = "/html/body/ion-app/ng-component/ion-split-pane/ion-nav/page-login/ion-content/div[2]/ion-list/ion-item[1]/div[1]/div/ion-input/input"
var email = webDriver.findElement(By.xpath(email_xpath))
but still unable to get the element....
===============Updated===============
most of the solutions posted below works with selenium firefox driver. The issue was really with htmlunit driver that i was using in scala. Probably it cannot handle javascript properly. I changed it with firefox driver and your solutions works well. The application being tested is an Ionic app (angular), hence i will have to look for another headless solution later.
//*[type='email'] is not correct XPath. Try below instead:
//*[#type='email']
Note that type='email' predicate means child node with string value 'email':
<input>
<type>email</type>
</input>
While #type='email' means attribute type with value "email"
The previous answer is correct but You can try this also //input[#type='email']
The generic syntax is something like as mentioned below for xpath
// - means relative xpath, can be present anywhere inside DOM
tagName - means html tags like td,tr,span,br,input etc
#- denotes start of attribute name present inside html tag
value - actual attribute value present inside DOM
//tagName[#attribute='value']
You can use any XPath, as some are already mentioned by #Andersson and #zsbappa
some others are
//input[#class='text-input text-input-md' and #type='email']
//input[contains(#type,'email')]
Since you are using WATIR, you don't have to write xpath, write the below code, it would work.
b.text_field(type: "email").set "abc#gmail.com"

cssSelector("select[title=\"Sort By\"]")

In a selenium script Sorting a dropdown using
new Select(driver.findElement(By.cssSelector("select[title=\"Sort By\"]"))).selectByVisibleText("Name");
Can anybody please explain me this part cssSelector("select[title=\"Sort By\"]" of above statement.
Thanks!
cssSelector("select[title=\"Sort By\"]")
this is one of the technique to locate web element/elements.
You must have heard about xpath, which is one of the way to locate element/elements in a web page.
Further more , select is tag in HTML. title is attribute and Sort By is value of attribute.
Just like this :
HTML :
<select id="sel" class="drop-down" title="Sort By">
<options>..</options>
<options>..</options>
<options>..</options>
</select>
Now If you have to write cssSelector , you can write like this :
tagname[attribute="attribute value"]
select[id="sel"]
or
select[class="drop-dwon"]
or
select[title="Sort By"]
Hope this will be helpful !
new Select(driver.findElement(By.cssSelector("select[title=\"Sort By\"]"))).selectByVisibleText("Name");
You are selecting by CSS selector https://www.w3schools.com/cssref/css_selectors.asp. The alternative is XPath which is more powerful but harder to learn.
What this part By.cssSelector("select[title=\"Sort By\"]") does is select all select elements that have title attributes set equal to "Sort By". Although by prefixing driver.findElement( you are requesting just one element, the first. At least you would be if it was python, Java might differ but was not in your question nor tags.

In Selenium Webdriver, how to get an input element after a text?

In my case, there are some legacy web sites, in which not all the inputs have
id attribute properly set. Such as this:
<div class="form-group">
<label>Amount</label>
<input id="unreasonablename" type="text" value=""></input>
</div>
But human testers can still test it by typing amount value in the input right behind "Amount". I'd like to make web driver do the same thing:
webDriver.inputAfter("Amount", 100); //I do not want to use "unreasonablename" to find the input.
But how can I find the input element after the text "Amount"? Thanks.
There is a relative question here: In Selenium Webdriver, how to get a text after an element?. But I'm not familiar with xpath and do not know if my case can be solved in the same way.
To find the <input> element just after the text Amount you can use the findElement() method along with the Locator Strategy as follows :
webDriver.findElement(By.xpath("//label[contains(.,'Amount')]//following::input[1]"));
you can try following_sibling as
webDriver.findElement(By.xpath("//*[text()='Amount']/following-sibling::Input"));
try this :
driver.findElement(By.xpath("//label[text()='Amount']/following-sibling::input")).sendKeys("amount to be sent");
you can write some generic method like below. It can be used for all the required fileds by passing the label name and input value as argument
void enterInputAfterLabel(String labelname,String value){
driver.findElement(By.xpath("//label[text()='"+labelname+"']]/input")).sendKeys(value);
}

How to set the default value of input item with jQuery EasyUI framework

I am trying to set the default value of an input item from last two days.
For this, i have also searched in google but till not cannot find the solution.
I am using jQuery EasyUI framework.
<div class="fitem">
<tr>
<td></td>
<td>
<input type="text" class="easyui-validatebox" name="insertby" id="insertby" size="20">
</td>
</tr>
</div>
<script>
var s = '<?php echo $logname; ?>';
document.getElementById('insertby').value = s ;
alert(s);
</script>
As I am unable to add a comment to ask you to try stuff, I will try my best to help you out!
Firstly, your code works for me. However, there are times where other javascript codes causes errors and stops the code execution before your block of code. You might want to try pressing F12 on your Chrome browser to see if you encounter any errors before your block of code to ensure that all is well.
this code snip might have you
http://www.jeasyui.com/forum/index.php?topic=2623.0
$('#insertby').validatebox('setValue', s);
I took me while to "get it" too.
Actually, jquery easyUI modifies the DOM on the fly to make its fancy things in a way that the original input box is "gone" while you obtain their fancy widget instead. That's why modifying the input field directly has no effect, it is hidden actually. I guess this is done so because their getters/setters should be used in order to update everything correctly.
EasyUI is very easy to set up and play with, but it's way to operate on elements is rather unintuitive. But once you got the hang of it, it should be all right.
Use
setValue. $('idofcombogrid').('setValue',id_value);
The id_value refers to the value of idField as defined initially for the combogrid.