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
Related
I'm trying to click the continue button after filling in the fields on this webpage. But an exception is thrown saying element is not visible even though I maximize the screen and you can clearly see the button.
I have tried the following even with waiting 10 seconds for the page:
driver.findElement(By.xpath("//*[#id=\"submitButton\"]/span")).click();
driver.findElement(By.cssSelector("#submitButton > span")).click();
driver.findElement(By.partialLinkText("Continue")).click();
driver.findElement(By.className("caret_rebrand")).click();
driver.findElement(By.name("submitButton")).click();
driver.findElement(By.xpath("//span[contains(#class,'red') and contains(text(), 'Continue')]")).click();
Here is the part of the html I am trying to access:
<button style="padding-left: 0px;" type=button" "id=submitButton" class = "nbutton" title = "Continue" onclick=_hblicnk('continue,'continue'); goFeaturePage('true');">
<span style = "padding-right: 12px;" class="red"
"Continue"
<img class="caret_rebrand">
</span>
I expect the continue button to be found and clicked. attached is the picture of the webpage
UPDATE: 8-3-19: I've tested the following pieces of code and it is able to find the element in all cases. But when adding the .click() function to any one of them, it causes a no such element exception.
driver.findElement(By.name("submitButton")).click();
driver.findElement(By.id("submitButton")).click();
driver.findElement(By.cssSelector("#submitButton")).click();
driver.findElement(By.xpath("//*[#id=\"submitButton\"]")).click();
My expectation is that you need to click the <button> element as this <span> might be not clickable at all. You can use i.e. title attribute to uniquely identify the element on the page
It's better to use Explicit Wait to ensure that the button is present and clickable as it might be the case it's not available in DOM right away. Check out How to use Selenium to test web applications using AJAX technology article for more details
Assuming all above I believe you should be able to use below code for clicking the button:
continue_button = WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.XPATH, "//button[#title='Continue']")))
continue_button.click()
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...
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
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");
I have a PHP contact form, with a simple submit button. What i want to do is once the user has clicked submit, add a function which greys out all text boxes within the form.
Or the form disappears altogether so i can place a label on the page to say its been completed. Is there anyway to go about this without the use of javascript or jquery?
Currently the code for the submit button is:
<input type="submit" value=" Continue " style="width:200px;height:40px">
which uses the PHP post method.
Upon submission, the values should be posted to the PHP script. You can then implement a method of checking if the user's value has been accepted.
At the top of your code, implement the method that is being used to save the input:
<?php
$form_submit_success = false;
//Your input processing code here.
$form_submit_success = true; //Set this variable to true if form data was accepted.
if($form_submit_success) {
//Message to inform the user that form submission was a success.
} else {
?>
<!-- HTML Form Code here -->
<?php
}
?>