How to access onClick attribute in behat+mink? - testing

We have two button named “Inschrijven” in Tab1 section and Tab2 section as shown in below image
Tab 1:
<span class="form-submit-wrapper"><input type="submit" id="edit-submit--3" name="op" value="Inschrijven" class="form-submit"></span>
Tab 2:
<span class="form-submit-wrapper"><input onclick="return validate_course_anywhere(this)" type="submit" id="edit-submit--22" name="op" value="Inschrijven" class="form-submit"></span>
When I click element with id "edit-submit--3" This behat code scenario is worked in Tab 1 section but not in tab 2 section ( When I click element with id "edit-submit--22")
/**
* #When /^I click element with id "([^"]*)"$/
*/
public function iClickElementWithId($class) {
$locator = "#$class";
$element = $this->getSession()->getPage()->find('css', $locator);
if (null === $element) {
throw new \InvalidArgumentException(sprintf('Could not evaluate CSS selector: "%s"', $locator));
}
$element->click();
$this->getSession()->wait(1000);
}
But error message is displaying in Tab 2 section:
Exception thrown by (//html/descendant-or-self::*[#id = 'edit-submit--22'])[1]
Element is not clickable at point (813.5, 16.666671752929688). Other element would receive the click:

It seems that the selector is ok, the issue here is that is not clickable and some other element is in the front of it and receives the click.
Some of the possible issues:
1. wait for the element to be visible
2. you have 2 elements with the same id and the first one is found but not clickable
3. wait for the page to be loaded if needed
To use the onClick attribute you can use a css selector like: [onclick*='some_value_from_attribute']
You should have a method to click by selector and not particular method for just one attribute.
Another thing to avoid is using blind waits, you should try to use conditional waits.

Related

Not able to Enter Text in a TextBox using Selenium Webdriver

I have a TextBox that appears on Radio Button Selection and I have to enter values in a particular format(XYZ989898-99). However I am unable to do so by using the commonly used methods of entering text in selenium.
Background info related to Textbox :
TextBox appears when user clicks on Yes radio button.
TextBox has default value as XYZ already entered.
SendKeys do not concatenate the text given without XYZ as well.
TextBox is inside an Iframe to which focus is shifted correctly.
The code does not fail, it just remained clicked on textbox without entering anything.
Approach 1 :
driver.findElement(locator).SendKeys("989898-99");
Approach 2 :
driver.findElement(locator).clear();
driver.findElement(locator).SendKeys("XYZ989898-99");
Approach 3 :
WebElement element = driver.findElement(locator);
Actions action1 = new Actions(driver);
action1.movetoElement(element).click().perform();
action1.sendKeys("XYZ989898-99");
HTML Sample :
<div class="value" ng-show="selectedValue" style="">
<label class="labelAboveTextBox">XYZ Number*</label>
<input type="text" class="Value" ng-model="XYZNumber" ng-
req="XYZNumber" xyz-input="" maxlength="12" style="value"
id="value" value="XYZ" required="required">
<!-- ngIf: invalidtspmessage -->
<span style="font-family: 'NeueHaasGroteskText';font-size:
0.7rem;color: black;">
Note: Enter XYZ is this format: XXXXXXXXX-XX
</span>
</div>
I would like to know If there is any other approach that can be used to get this problem resolved and also why does the above approaches failed to work.
You have used the wrong methods for sending the keys. (in approach 1 and 2)
Instead of .SendKeys(), you have to use .sendKeys() method for writing anything on UI side
Into the third approach, you have used the wrong method .movetoElement(). The method name is .moveToElement().
For sendKeys() don't need to use Actions class. basically, it is for Keyboard events and for mouse events.
(WebElement).sendKeys("989898-99"); // first approach you can use
(WebElement).clear(); // second approach you can use
(WebElement).sendKeys("XYZ989898-99");
Hope this will help you to solve your errors.
Other way you can use is to set the text is by using the JavaScriptExecutor. Give some delay before performing the action.
Try the below sample code :
Thread.sleep(3000);
((JavascriptExecutor) driver).executeScript("document.getElementById('value').value='XYZ989898-99';");
As the id is unique, you can use the JavaScript's getElementById() function to set the value.
If you want to set the text through the sendKeys() method and before that if you want to clear the text then simple clear() may not work instead you can try to delete the XYZ values first and try to send the values like below again :
// Wait for some time
Thread.sleep(3000);
// Locate the element first and store it in some variable
WebElement element = driver.findElement(By.id("value"));
// Fetch the existing text from the field first
String existingValue = element.getAttribute("value");
// Wait for some time
Thread.sleep(3000);
// Click on that element first so the focus will shift to there
element.click();
// Wait for some time
Thread.sleep(2000);
// Loop until the existing value length
for(int i=0;i<existingValue.length();i++) {
// Remove the existing character text one by one
element.sendKeys(Keys.BACK_SPACE);
}
// Try to send the text at the end, make sure that you should append XYZ as a prefix
element.sendKeys("XYZ989898-99");
I hope it helps...

click only visible element selenium webdriverjs

I have multiple div like below
<div class="one">send Message</div>
<div class="one">send Message</div>
<div class="one">send Message</div>
I have a web page where there is send Message buttons like above, in which only one button is visible at a time.Other two buttons are hidden via some javascript codes.So for example if 2nd button is visible , I should be able to click only that element.But in my selenium code , its trying to click first hidden div and its failing
driver.findElements(by.className(".one")).then((els) => {
var element = els[index];
element.click();
});
So basically I wanna convert below javascript code to Selenium nodejs code,If some one guide me that will be helpful
var all = document.getElementsByTagName("*");
for (var i = 0, max = all.length; i < max; i++) {
if (isHidden(all[i]))
// hidden
else
// visible
}
function isHidden(el) {
var style = window.getComputedStyle(el);
return ((style.display === 'none') || (style.visibility === 'hidden'))
}
Do you want to click the button ( basically a div as far as code is concerned ) which is visible ?
If that is your main agenda, then the code you've written will fail to find desired element. As you are selecting the element by it's classname not its visibility.
Your code will find all the matched class element. As it's a basic element selector and all your buttons have the same class, so they are basically rendered on the page.
Approach 1
driver.findElements(by.className(".one")).then((els) => {
for(var key in els){
var element = els[key];
if(element.isDisplayed()){ //if visible element
element.click();
}
}
});
The Key here is to check if the element you are trying to click is visible on the page.
Approach 2
By giving a unique class to the target button. Some class for eg 'clickable' or 'active'. So it will be a more optimized solution to select the target element using the Css selector. The Key here is to give uniqueness to your target element to be more identifiable.
Usually many Java Scripts are run in the node Js without the convert.
Have you try it in the node Js without converting ???
** Remember to import selenium

How to validate Web element if xpath locator is dynamic in selenium webdriver

ID and Xpath is changing for "OK" button every time while saving(Account).
HTML Code:
<div class="modal-footer" style="display: block;">
<div class="bootstrap-dialog-footer">
<div class="bootstrap-dialog-footer-buttons">
<button id="fe02d6bd-6058-4871-b0e1-c1e914f64a6a" class="btn btn- default">Ok</button>
</div>
</div>
</div>
</div>
Xpath:.//*[#id='fe02d6bd-6058-4871-b0e1-c1e914f64a6a']
"ID"/XPath is not constant and it is varying while saving.
use the below code:
driver.findElement(By.cssSelector("div.bootstrap-dialog-footer-buttons>button.btn.btn-default"));
You can devise your own XPath locator to find the OK button by it's text content like so:
//button[.='Ok']
The first part of the XPath expression - //button - will select all <button> WebElements within the currently focused content.
The second part - [.='Ok'] - is a predicate that will filter out any WebElements whose exact text content is not equal to 'Ok'.
If it is the only OK button available on the page then you can probably use below code.
driver.findElement(By.xpath("//button[contains(.,'Ok')]"));
Else you can take a reference of parent window and locate a button on it as below
WebElement modalWin = driver.findElement(By.id("modal-window-id"));
modalWin.findElement(By.xpath("//button[contains(.,'Ok')]"));
This below code helps to click OK button in any page.
just call this method with parameter saying OK
public void buttonClick(String buttonname){
WebElemennt button = driver.findelement(by.xpath("//button[text(),'Ok']"))
or
WebElemennt button = driver.findelement(by.cssselector(".btn btn- default"))
for(int i=0; i<button.size;i++)
{
if(button.get(i).gettext().equalIgnorecase(buttonname))
{
button.get(i).click
}
}
}
Let me know result..

Click on hyper link is not loading webpage using Selenium webdriver

Here is how my html looks like on the web page:
<form id ="invoice request">
<div id = "charges">
<div id = "charges">
<div id= "billing">
<a id = "modify" class="modify_link" href = "#"> Modify </a>
I am unable to load Web page by clicking on Modify charges link. Selenium test passes without actually loading webpage.
Here are my trails:
driver.findElement (By.id ("modify")).click ();
wait.until (ExpectedConditions.presenceOfElementLocated (By.id ("modify")).click ();
What's wrong in the code?
You're expected condition doesn't actually do anything there. You're HTML shows that the element is already present when you click, because it's what you clicked. That element will still be on the DOM. You need to find an element (on what I am assuming is an AJAX call) that is presented only after you have clicked the modify button to ensure that the click button you invoked did anything.

Issue selecting Radio button in Selenium Webdriver

<table id="Content_Content_Content_ctlCaseInfo_rdochldplcm" class="fltLeft">
<tr>
<td><input type="radio" id="Content_Content_Content_ctlCaseInfo_rdochldplcm_0" name="ctl00$ctl00$ctl00$Content$Content$Content$ctlCaseInfo$rdochldplcm" value="0" /><label for="Content_Content_Content_ctlCaseInfo_rdochldplcm_0">No</label></td><td><input type="radio" id="Content_Content_Content_ctlCaseInfo_rdochldplcm_1" name="ctl00$ctl00$ctl00$Content$Content$Content$ctlCaseInfo$rdochldplcm" value="1" /><label for="Content_Content_Content_ctlCaseInfo_rdochldplcm_1">Yes</label></td>
</tr>
</table>
When I try
driver.FindElement(By.Id("Content_Content_Content_ctlCaseInfo_rdochldplcm")).Click();
it clicks to "Yes"
When I try driver.FindElement(By.Id("Content_Content_Content_ctlCaseInfo_rdochldplcm_0")).Click();
OR
driver.FindElement(By.Id("Content_Content_Content_ctlCaseInfo_rdochldplcm_1")).Click();
Nothing happens and no radio button gets selected.
Please suggest ways to handle this situation ..thanks a lot!!
It would probably be better to click the Radio buttons through XPath.
In your specific case, the XPath for:
Yes - Radio Button:
"//input[contains(#id, 'rdochldplcm') and contains(#value, 1)]"
No - Radio Button:
"//input[contains(#id, 'rdochldplcm') and contains(#value, 0)]"
In this instance, if you wanted to click the 'Yes' Radio button, you can do this:
string yesRadioButtonXPath = "//input[contains(#id, 'rdochldplcm') and contains(#value, 1)]"
IWebElement yesRadioButton = driver.FindElement(By.XPath(yesRadioButtonXPath));
yesRadioButton.Click();
For the 'No' Radio button, you would use this:
string noRadioButtonXPath = "//input[contains(#id, 'rdochldplcm') and contains(#value, 0)]"
IWebElement noRadioButton = driver.FindElement(By.XPath(noRadioButtonXPath));
yesRadioButton.Click();
Since you're using a table, there may be a chance that the XPath may return more than one element. You'd need to use a different method to sort out the elements in that case, but for what you're looking for, this method should work.
this solved my problem perfeclty
I have a page with 18 radio buttons in 6 groups which represented "Yes" "No" and "No Answer"
I was trying to get them by ID but it was randomized by the app
But using a name and value tags made it work.
radios were defined basically like this:
input value="2" class=" x-form-radio x-form-field" autocomplete="off" id="randID_13578" name="emailNotifiyOptionAllow" type="radio">
and every time i opened this page id was different so using
"//input[contains(#name, 'emailNotifyOptionAllow') and contains(#value, 1)]"
solved it.
Thanx
Use this :
//First get the list of values from the radio button
List < WebElement > elements = driver.findElements(By.cssSelector("table[id='Content_Content_Content_ctlCaseInfo_rdochldplcm'] > td"));
WebElement value;
//use loop for searching the particular element
for(WebElement element : elements){
//Getting the value of the element
value = element.findElement(By.cssSelector("label")).getText();
//condition to click on the element
if(value.trim().equals("No")){ //Here value is hard coded. You can take from excel sheet also
// If condition satisfies, it will click on the element
element.findElement(By.cssSelector("input").click();
}
}
This can be used as a common function also.
try [0] and [1] instead of the underscore.
Try your code with the given below CSS :
Step 1:
By Provided HTML Piece we can derive the CSS of the Radio Button
css=#Content_Content_Content_ctlCaseInfo_rdochldplcm input
Step 2:
Click on the radio button using Web Driver Code
driver.findElement
(By.cssSelector("#Content_Content_Content_ctlCaseInfo_rdochldplcm input"))
.click();