Selenium-Java : Unable to click on an a date picker - angularjs

I am trying to click on a date picker text box so that a calendar pops up where I can choose the date.
I am able to identify the element since it has easy accessible "id" attribute.
Manually clicking on the textbox, results in the calendar pop being displayed.
However, I am not able to click on the date picker using native Selenium click commands/ Javascript/ Jquery clicks.
Below is the HTML code :
<input class="ng-touched ng-dirty ng-valid" formcontrolname="effectiveDate" id="date_start" name="date_start" placeholder="dd/mm/yyyy" readonly="" type="text" ng-reflect-name="effectiveDate" autocomplete="off" value="22/09/2017" ng-reflect-model="22/09/2017">
Any reason why such a behavior? In what instances can we expect the Selenium native commands/ JS/ Jquery command to fail?

Using JavascriptExecutor You can enter date..
((JavascriptExecutor) wd).executeScript(
"document.getElementsByClassName('ng-touched ng-dirty ng-valid')[0].setAttribute('value', '2017-10-21')");

As per code this is written in angularjs so selenium driver is not able to locate such type of elements.Try to use cssSelector which is the best approach to locate angular based elements you can use By.cssSelector("input [id=date_start]").Don't forget to use proper wait before locating element.

You can try any of the following approaches:
#1
WebElement datePicker = driver.findElement(By.id("date_start"));
WebDriverWait wait = new WebDriverWait(driver,20);
wait.until(ExpectedConditions.visibilityOf(datePicker));
wait.until(ExpectedConditions.elementToBeClickable(datePicker));
datePicker.click();
#2
Actions act = new Actions(driver);
act.moveToElement(datePicker).click().build().perform();
#3
JavascriptExecutor js= (JavascriptExecutor ) driver;
js.executeScript("arguments[0].click‌​();",datePicker);

I think you will have to take coordinates of text box and width and height of the textbox and try to click on centre of the calendar sign present in textbox...

Related

Knock out js selenium web driver accept text input

I have a text box and button where I used knock out js binding as follows
<textarea id="txtSite" cols="40" rows="5" data-bind="value: cellSite" data-required-msg="required" required="required" class="k-valid"></textarea>
<button id="btnSubmit" value="Submit" data-bind="click: SubmitCell">Submit</button>
I am trying to automate using selenium by entering some required text in to textbox and submit but it is always firing an validation even though the value is present. How to make the button understand the value is entered in to textbox
driver = new EdgeDriver(#"C:\Tools\EdgeDriver");
driver.Url = "myurl";
driver.Manage().Window.Maximize();
Thread.Sleep(3000);
Helper.SendKeys(driver, By.Id("txtSite"), "xyz");
WebElement submitBtn = (WebElement)driver.FindElement(By.Id("btnSubmit"));
Helper.JavaScriptClick(driver, submitBtn);
I keep on getting alert asking to enter value in textbox field is there a way to handle this
OK here is what I found and it works as expected
Helper.SendKeys(driver, By.Id("txtSite"), "test");
Thread.Sleep(2000);
IJavaScriptExecutor jse = (IJavaScriptExecutor)driver;
IWebElement webElement = driver.FindElement(By.Id("txtSite"));
jse.ExecuteScript("$(arguments[0]).change();", webElement);
Can't test with Selenium but I'd recommend trying the textInput binding, Unlike the value binding, textInput provides instant updates from the DOM.
Looks like you're bumping that change event manually, which is equivalent to clicking out of the input (triggering change event) as you would as a user - to click the submit button.
https://knockoutjs.com/documentation/textinput-binding.html

Enable to handle an element in html-5 using protractor

I newbie to protractor and my requirement is automating third party tools.
I was unable to detect an web element, the functionality of element is on click it changes its state and pulls data from other application it is changing its class value
FROM
ui-select-container ui-select-multiple select2 select2-container select2-container-multi ng-empty ng-valid ng-touched
TO
ui-select-container ui-select-multiple select2 select2-container select2-container-multi ng-empty ng-valid ng-touched select2-container-active select2-dropdown-open open
I am curious about the tag:
'select2-container-disabled
In what way it can affect my code?
I have tried to find the element using xpath & ng attribute but was unable to detect element and i found
ng-disabled="$select.disabled"
I tried css,xpath and input tag source code.
Can you please suggest me how to deal with this element?
If the element is disabled can i handle that element using some code in protractor
Thanks in Advance :-)
If it's disabled then it's not clickable. the isElementClickable function is mostly testing for whether an element is enabled or not.
You can maybe scrape data from it though

strange Selenium2 No Such Element error

I have this HTML code.
`<div> <i class="icon-plus icon-white"></i>
<span>
<input type="file" multiple="multiple" name="uploadFile" value="Attach2" id="1309261001000145" style="visibility:hidden;position:absolute;top:0;left:0"> <input type="button" onclick="fireFileButton('1309261001000145')" value="Attach" name="input" class="btn_grn btn_sm">
</span>
</div>`
the div is in a normal nested divs. The second is the displayed 'attach file', once clicked, the "fireFileButton" function will click the first form(which is hidden on top left 0,0 position). then a pop up window appear as the type is 'file' to select file to upload and an ajax to upload.
I'm to use Selenium2 to simulate the file upload process.
I use the following codes:
WebElement attach = (new WebDriverWait(driver, 15)).until(ExpectedConditions.presenceOfElementLocated(By.cssSelector("//input[name^='input']")));
attach.click();
WebElement upload = (new WebDriverWait(driver, 15)).until(ExpectedConditions.presenceOfElementLocated(By.id("1309261001000145")));
upload.sendKeys("C:\\Users\\Public\\Pictures\\Sample Pictures\\Desert.jpg");
I also tried directly use sendKeys Function on first element. But have the error of NO SUCH ELEMENT both for first and second . I have used By.id,name,cssSelector,xpath but to no avail.
the elements can be selected using javascript.
Any Suggestion is much appreciated.
By.cssSelector("//input[name^='input']")
Selectors should not contain //,so replace the above with :
By.cssSelector("input[name='input']")
You can refer this to know more about Selectors.
First check : ID tag.
It seems that ID for the input buttons are dynamic. So we cant access through the ID's.
Second check : NAME tag.
We can use, since it has a name for it.
WebElement attach = driver.findElement(By.Name("input"));
attach.click();
If it is not clicking, use Actions.
Actions action = new Actions(driver);
action.moveToElement(attach).click().perform();
You cannot pass the values directly using sendkeys for file upload.
Check this page for my solution in order to access with file upload : How to handle Windows file browse window using selenium webdriver

How to browse and upload file through selenium Web driver

I am trying to upload a file through selenium webDriver but selenium gives an error:Unable to locate element. I have used all method to find element and click on browse but not any click occurring on that.
The HTML is <input type="file" onmousedown="this.blur();" onclick="//this.blur();" onchange="$('file-loader').show(); this.form.submit();" name="metadata_item" id="metadata_item">
First check the input element is visible
Then, you don't have to click on the browse button, it will trigger an OS level dialogue box and effectively stop your test dead.
In order to deal with this follow this code:
driver.findElement(By.id("myElementId")).sendKeys("<pathToFile>");
myElementId is the id of that element (button in this case) and in sendKeys you have to specify the absolute path of the content you want to upload. The Webdriver will do the rest for you.
Keep in mind that the upload will work only If the element you send a file should be in the form
cant answer without HTML code.
in order to click Browse button place the pointer in previous field i.e,
email address field and use
Robot robot=new Robot();
robot.keyPress(KeyEvent.VK_TAB);
robot.keyRelease(KeyEvent.VK_TAB);
robot.keyPress(KeyEvent.VK_ENTER);
robot.keyRelease(KeyEvent.VK_ENTER);
and then a system popup displays then use AutoIT tool to handle it
It could be under another frame.
Try switching to that frame and click the element.
It would work.
For Example - If the browse button is under another frame which has Id = "frameUpload", then switch the webdriver to that frame like this:
driver.switchTo().frame("frameUpload");
Now click on the browse button like this:
driver.findElement(By.Id("Id of the button")).click();
once you are done with the click, you can always get back to the default window like this
driver.switchTo().DefaultContent();

How to locate an element in a ExtJS pop window

The system under test uses the ExtJS Framework to create dynamic pages.
The scenario is when a user clicks a button on the main browser page a pop window appears, I want to enter text in a textfield on this child window.
The only element I have located was the outer frame, I then tried to use this to locate textfield I wanted, but it failed.
Element Code
input type="text" size="16" autocomplete="off" id="name" name="name" class="x- form-text x-form-field x-form-invalid x-form-focus" style="width: 233px;"
I have tried the code below:
WebElement parentObj = getDriver().findElement(
By.cssSelector("#parentObj "));
WebElement newObj = parentObj.findElement(
By.xpath("//input[#id='name']"));
newObj.click();
newObj.sendKeys("Text to enter");
Can anyone help map elements in child extJS screens?
Thanks!
Maybe you should stick to CSS selectors as much as you can:
parentObj.findElement(By.cssSelector('input[name="name"]'));
If your popup window is present inside an iframe, you need to switch to that iframe first.
use the below code to switch to iframe, then you can use your existing selector.
var iframe = driver.findElement(By.TagName("iframe"));
driver.SwitchTo().Frame(iframe);
WebElement parentObj = driver.findElement(By.cssSelector("#parentObj "));
WebElement newObj = parentObj.findElement(By.xpath("//input[#id='name']"));
newObj.click();
newObj.sendKeys("Text to enter");

Resources