C# chromedriver 中的“元素不可交互”异常

Question

I am using selenium chromedriver in c# to try and click a print button however I am receiving an exception of "element not interactable", here is the website source of the print button:

<p _ngcontent-c27="" class="print"><span _ngcontent-c27="" class="floatRight">Print</span><img _ngcontent-c27="" class="printImg" src="../../../../../assets/images/Print.svg"></p>

What I've tried:

driver.FindElementById("clippedTab").Click(); // Successfully clicks on the 'Clipped' tab

//None of the below worked:

driver.FindElementByClassName("print").Click();
// and
driver.FindElementByClassName("printImg").Click();
// and
driver.FindElementByClassName("floatRight").Click();

However none of these worked for me.

The website used is bjs.com and the print button and can be found on the Clipped tab.

What am I doing wrong, why is the element not intractable and how could I solve this?

Answer 1

The element has to be visible (that's usually what makes it "interactable") before you can Click() it. Are you opening the "Clipped" tab before you Click()?

Answer 2

The Xpath you are making is actually causing issue.

All the above Xpaths are not unique and actually point to 2 Xpaths 1 is Print you want to click, and other is not interactable(or hidden) one. Since it is trying to click on hidden one, it is throwing Error. See image

Simple solution:- use XPath as:: //*@id="clipped"]/div/div[1]/div[3]/div/p/span

Answer 3

The desired element is an Angular element so to Click() on the element you have to induce WebDriverWait for the ElementToBeClickable() and you can use either of the following Locator Strategies :

• CssSelector :

   new WebDriverWait(driver, TimeSpan.FromSeconds(20)).Until(ExpectedConditions.ElementToBeClickable(By.CssSelector("img.printImg"))).Click();

• XPath :

   new WebDriverWait(driver, TimeSpan.FromSeconds(20)).Until(ExpectedConditions.ElementToBeClickable(By.XPath("//img[@class='printImg']/h2"))).Click();