We Keep Coding

Unable to locate and click checkbox ::before using Selenium Webdriver

I'm trying to click a checkbox but it's keep clicking the link 'terms and conditions'. Although my xpath (mentioned below) work on a minimized window but it's failing to click the checkbox when the window is maximized because the href (image) appears in the second line next to checkbox. Looking for some suggestions on clicking the checkbox widget on maximized window. I need to get a focus on it.
Interestingly, when i hover over the ::before (css selector) only than the widget gets highlighted.
<div class="checkbox u-mar-bot-5">
<div class="checkbox__container">
<input class="checkbox__input" type="checkbox" id="basket-contact-terms" required data-parsley-multiple="basket-contact-terms" style>
<label class="checkbox__label checkbox__label--has-link checkbox__label--small" for="basket-contact-terms" style>
::before
"I have read and agree to " <a class="text-link text-link--base text-link- small" href="/terms-conditions" target="_blank">Terms and Conditions</a>
</label>
</div>
</div>
image: Terms and Conditions
I tried a few options that keep failing to check the box and instead the link 'terms and conditions' gets the click. I must be missing something basic.
driver.findElement(By.xpath("//label[#for='basket-contact-terms']")).click();
driver.findElement(By.xpath("//label[contains(#class,'checkbox__label checkbox__label--has-link checkbox__label--small')]")).click();
I did looked around and found someone suggested to use this (below) so i tried but didn't work:
WebElement elem = driver.findElement(By.xpath("//div[contains(#class,'checkbox u-mar-bot-5')]"));
Actions action = new Actions(driver);
action.moveToElement(elem).click().build().perform();
Any suggestion would be appreciated.

Since you tried the ID of the INPUT and it threw an error that it wasn't visible, I would first try a wait to see if it will become visible. (I'm assuming it won't but it's worth a try first).
new WebDriverWait(driver, 10).until(ExpectedConditions.elementToBeClickable(By.id("basket-contact-terms"))).click();
If that doesn't work, I would next try to click a different position on the element. By default, Selenium clicks on the center of the element. In your case, I think this is what's causing the issue. You can use Actions to click the upper left (1,1) of the element.
WebElement label = driver.findElement(By.xpath("//label[#for='basket-contact-terms']"));
new Actions(driver).moveToElement(label, 1, 1).click().perform();

You can try with
WebElement elem = driver.findElement(By.id("basket-contact-terms"))

Selenium sees textbox as hidden even if I can see it in the browser

I have a password textbox that is something like this
<input class="blahblah" id="someId" type="password"></input>
I am able to see this textbox in the browser and am able to manually insert password.
However when I test this ui using selenium, although it finds the element correctly, but when it tries to click the element, it throws an error
"org.openqa.selenium.ElementNotVisibleException: Element is not currently visible and so may not be interacted with"
I did a check in code using
Boolean isDisplayed=el.isDisplayed();//false
Boolean isEnabled=el.isEnabled();//true
The isDisplayed came up false and isEnabled came up true. There is a 15 second delay added to give the page enough time to load (the page loads instantly). So adding a delay will not fix the problem.
I verified using firefox developer tools that the id it was finding was of the correct element.
Why does selenium think its invisible even if I am able to see it in the browser? Could it be that one of the parent elements has some style attribute that selenium doesn't like? Or is it a bug in the selenium driver?
I am using selenium driver for java version 2.45.0

The problem is that the desired input is really invisible due to the display: none being set on it's parent table:
<table title="Type a password."
class="dxeTextBoxSys dxeTextBox_MyCompany "
id="ctl00_ctl00_MasterContent_MainContentPlaceHolder_ViewCredentials_TopicPanel1_credentialGrid_editnew_4_txtPassword_P_PB"
style="width: 100%; border-collapse: collapse; display: none;"
border="0" cellpadding="0" cellspacing="0">
Most likely, the table is becoming visible on a particular user action that you need to determine.
But, alternatively, you can make the table visible through javascript:
WebElement table = driver.findElement(By.id("ctl00_ctl00_MasterContent_MainContentPlaceHolder_ViewCredentials_TopicPanel1_credentialGrid_editnew_4_txtPassword_P_PB"));
JavascriptExecutor jse = (JavascriptExecutor)driver;
jse.executeScript("arguments[0].style.display = 'block';", table);
In case the above doesn't make any difference.
There is an another hidden password input that can be important:
<input value=""
name="ctl00$ctl00$MasterContent$MainContentPlaceHolder$ViewCredentials$TopicPanel1$credentialGrid$editnew_4$txtPassword$P$PB$CVS"
type="hidden">
You can try making it visible and sending keys to it:
WebElement password = driver.findElement(By.name("ctl00$ctl00$MasterContent$MainContentPlaceHolder$ViewCredentials$TopicPanel1$credentialGrid$editnew_4$txtPassword$P$PB$CVS"));
JavascriptExecutor jse = (JavascriptExecutor)driver;
jse.executeScript("arguments[0].setAttribute('type', 'text');", password);
password.sendKeys("MyPassword");
In case the above doesn't work.
You can set the input value through javascript:
JavascriptExecutor jse = (JavascriptExecutor)driver;
jse.executeScript("document.getElementById('ctl00_ctl00_MasterContent_MainContentPlaceHolder_ViewCredentials_TopicPanel1_credentialGrid_editnew_4_txtPassword_P_PB_I').setAttribute('value', 'MyPassword');");

Possibly, Selenium is going too fast through your DOM. Has happened with me several times and your element hasn't fully loaded into DOM.
I am more familiar with the PHP/PHPUnit libraries available for Selenium, but perhaps you can introduce a temporary wait with a command similar to waitForElementPresent.
Also, if you have control of the code, can you give a 'name' attribute to your input field as well? It could not hurt anything to do so.

Have a look at the DOM elements and verify that there is no parent element with a display: none etc, when i encountered an issue like this that was the problem.
Are you able to get information from the element by XPath? This was my work around.

I have faced this kind of issue many times. the first thing comes into my mind is probably the selector you are using is not unique or not returning THE element you are looking for. Since,
Boolean isDisplayed=el.isDisplayed();//false
Boolean isEnabled=el.isEnabled();//true
does not return NoSuchElement exception I do not think it's a element load issue. A quick check can tell you what's going on
driver.findElements(By.cssSelector("the css")).size(); and see how many count it returns.

How to identify an element in selenium even if xpath is same

I am new to selenium and trying to autoamte a web application in junit framework. As many get some problem in identifying web elements,I too stuck at a point where two submit buttons are having same xpath and css selector.
The only difference what I can observe is.. In the two form tags, I can see that className is different(for first form tag it is "feature_space_checkbox" and for second form tag it is "auto_fs_steps_checkbox")
As, I need to identify the second submit button..So I tried to identify the second submit button as below
driver.findElement(new ByChained(By.className("auto_fs_steps_checkbox"),By.xpath("//*[#id='edit_brochure_2863']/input[3]")));
When I try to execute this, I got the error as
org.openqa.selenium.NoSuchElementException: Cannot locate an element using By.chained({By.className: auto_fs_steps_checkbox,By.xpath: //*[#id='edit_brochure_2863']/input[3]})
Can anyone please correct me where I made the mistake
Adding DOM for this scenario
<form action="/brochures/2865/feature_space_checked" class="feature_space_checkbox" id="edit_brochure_2865" method="post"><div style="margin:0;padding:0">
<input name="commit" type="submit" value="Submit">
</form>
For the second submit button it is..
<form action="/brochures/2865/update_auto_fs_steps" class="auto_fs_steps_checkbox" id="edit_brochure_2865" method="post"><div style="margin:0;padding:0">
<input name="commit" type="submit" value="Submit">
</form>

Firstly, XPath and CSS selectors are not definitive. There are many XPath and CSS for every element on a page so to say they have the same Xpath and CSS selectors is incorrect.
For your example, is there any need to use XPath or combine two selectors?
The following CSS would work;
form.auto_fs_steps_checkbox input

There is no need to use chaining as this can all be expressed in XPath:
//*[#id='edit_brochure_2863' and #class='feature_space_checkbox']/input
So this will be in Java:
driver.findElement(By.xpath("//*[#id='edit_brochure_2863' and #class='feature_space_checkbox']/input"));
Of course, for the second submit button it will be
driver.findElement(By.xpath("//*[#id='edit_brochure_2863' and #class='auto_fs_steps_checkbox']/input"));

xpath for the second submit would be
driver.findElement(By.xpath("//form[#class='auto_fs_steps_checkbox']/input"));
This is enough to identify the second button as here class name is unique and id is same for both. So its better we do it by class name .

How to make the hidden element visible using java script executor

Currently am working on Selenium Webdriver with Java
Am trying to click on a button but i can't able to click because it is hidden. Please let me know how to make the hidden element visible 1st then how can click the button.
Please give me some example and my HTML tag is:
<input id="iskpiFilterAction" type="hidden" value="1" name="isKpiFilterAction">

Hmm, your question doesn't make sense for me. But I can exactly answer for your question.
For selenium 2 (webdriver):
WebDriver driver = ...
JavascriptExecutor jsExecutor = (JavascriptExecutor) driver;
jsExecutor.executeScript("document.getElementById('iskpiFilterAction').type = 'button';");
Result is:
This code causes changing type of element (from hidden to button), but it doesn't make sense for all of us. These two elements have different purpose/use. For more information see:
Original purpose of <input type="hidden">?
What's the point of having hidden input in HTML? What are common uses for this?
http://www.w3schools.com/jsref/dom_obj_hidden.asp

I didnt quiet understand the question.. However .. if you have a hidden object which you want to unhide dynamically using JavaScript using some trigger, this is a way you could do that:
<head>
<script>
function unhide()
{
document.getElementById("iskpiFilterAction").type = "button";
}
</script>
</head>
<body onload="unhide()">
<input id="iskpiFilterAction" type="hidden" value="1" name="isKpiFilterAction">
</body>
I am using body onload event to unhide the object so the moment this page loads you will see the button which u can then click. However if you want it some be triggered at some other event you can use the function accordingly.
Hope it helps.

Try this:
WebElement element = driver.findElement(By.id("iskpiFilterAction"));
((JavascriptExecutor) driver).executeScript("arguments[0].style.type = 'button';", element);

WebDriver Select Option from Javascript CSS drop menu works in IDE, not in code

I am having trouble selecting an item from a Javascript dropdown (i.e. the items in the drop list are not hidden in DOM tree, they are not present at all until link is clicked). I have tried using the Actions class in ways like this:
Actions cursor = new Actions(driver);
cursor.moveToElement(linkThataDropsMenu).perform();
cursor.click();
I have tried using the clickAndWait() function but it apparently does not exist in the Java webDriver libraries, and I have tried many variations of pausing and clicking in my code, including clicking twice. clickAndHold() also does nothing.
Below is the DOM tree after the menu has been generated. The only thing that changes on clicking is the insertion of div class="menu"
<div id="divIdActive_2" class="data number active" style="min-height: 21px;">
<a class="opencnl" href="#">
<span id="opencnlSpan" class="active" style="background-color:
transparent;">800-852-2222</span>
</a>
<img class="tollFree" title="Display name(s) for Toll free function properly on
Verizon Wireless devices, but may be omitted by other carriers on
their devices." src="img/nil.gif">
<input id="customNum" type="hidden" value="8008522222" name="number_2">
<div class="menu">
<a class="edit" href="#">Change Custom Number</a>
<a class="copy" href="#">Copy Settings for 0 Selected Lines</a>
<a class="clear" href="#">Clear Settings For this Line</a>
</div>
</div>
Here's the strange part though - I can get the menu to drop from the IDE, using click() or clickAndWait(), and the exact same locator. From my Java code I can use my locators to gather the text of the element I want to click, but I can't click the element. I have hundreds of other click commands in my Java code that work perfectly well, but not here. Any ideas? Thanks for reading at least!

Have you tried using isDisplayed() function ? Whichever option you want to click on should be visible before it can be clicked on . So , instead of the clickAndWait() that selenium 1 had, we have element.isDisplayed(). This has an implicit wait ( which is set when the browser driver is created , check documentation ) . By default, when Selenium encounters an isDisplayed function, it waits for that much amount of time before going forward.

I got it! The trick was to mouse over the item, then click, then mouse over the item again, which leaves the cursor there, and then grab the newly rendered objects. My guess now is that before I added that second moveToElement(), as soon as the click happened the cursor was done doing everything it was asked to do and was garbage collected. Here's my code for that - hope it helps somebody!
Actions cursor = new Actions(driver);
cursor.moveToElement(customNumberLink).perform();
cursor.click();
// move to SAME element to leave cursor where it is while Javascript runs.
cursor.moveToElement(customNumberLink).perform();
// now grab newly generated elements
WebElement clearLink = customNumberCell.findElement(By.cssSelector("a.clear"));
clearLink.click();