Sam M Sam M - 1 month ago 17
C# Question

How to fix "Element is Currently not Visible" Selenium <a> Element

I am trying to click on an

<a>
element inside of a
<div>
.
Here is the html:

<div class="cart__checkout cart__checkout--small">
<a class="button button--lg button--info button--checkout" title = "Checkout" href = "https://shop.adidas.ae/en/checkout/onepage/">
<span> Checkout </span>
<i class="icon-sprite icon-sprite-arrow-white-right-type-4"></i>
</a>
</div>
<button id="update_cart_action" class = "button btn-update" style = "display: none;" type = "submit" name = "update_cart_action" value = "update_qty" title = "Update Shopping Cart"></button>


If you want to see the original site its https://shop.adidas.ae/en/checkout/cart/ (you will have to add something to your cart to see what I am seeing)

I have tried three different ways:

The first way, I am targeting the
div
with:

var checkoutButton = driver.FindElement(By.ClassName("cart__checkout cart__checkout--small"));


(then clicking)

To which I get the error:


An unhandled exception of type 'OpenQA.Selenium.InvalidSelectorException' occurred in WebDriver.dll
Additional information: The given selector cart__checkout cart__checkout--small is either invalid or does not result in a WebElement. The following error occurred:
InvalidSelectorError: Compound class names not permitted


To Combat the compound class names error, I have tried the code:

var checkoutButton = driver.FindElement(By.CssSelector("div[class*= 'cart__checkout cart__checkout--small']"));


to which nothing happens, and I am assuming it was clicked, but not the actual link was clicked (2nd option).

I think this could be a valid way to click the actual element, except the div is actually much bigger than the link. I am assuming selenium is clicking in the center of the div, but as you can see from the screenshot below there is no link in the center of the div. Is there any way to offset my
Click()
function?

Or, I have tried to target the
a
with:

var checkoutButton = driver.FindElement(By.CssSelector("a[class*='button button--lg button--info button--checkout']"));


This just gives the error that its not in current view, most likely because the
a
is under the
div


the error:


An unhandled exception of type 'OpenQA.Selenium.ElementNotVisibleException' occurred in WebDriver.dll
Additional information: Element is not currently visible and so may not be interacted with


Thank you for helping. I think my second option is the best bet. Is there any way to offset a
Click()
? Thanks.

Answer

I've been able to get that button and click on it with the following XPATH:

//*[@id = 'cart-form']//a[@title = 'Checkout']

So in C# you would do this:

var checkoutButton = driver.FindElement(By.XPath("//*[@id = 'cart-form']//a[@title = 'Checkout']"))

I can break down the XPATH for you if you want to better understand it.

Comments