元素存在于 DOM 中，但无法与之交互

Question

我正在用这个网站练习 https://automationtesting.co.uk/并且我的程序需要按下切换按钮（显示/隐藏侧边栏内容），以防我无法与我尝试在那里执行的任何操作进行交互（单击中的超链接）我的情况）。

问题是，每当侧边栏不可见时，其中的所有元素仍然会出现在我的 DOM 中。通过搜索 h2 选择器并关闭侧边栏来亲自查看。即使您在页面上看不到“菜单”标签，它也会找到它。对于其中的每个元素也是如此。

所以我无法检查它们是否显示、启用或可点击 - 因为这样的条件检查由于某种原因总是返回 true，因此它们是无用的。同时，我不能在侧边栏关闭时单击（）侧边栏内的任何内容。

那么解决办法是什么呢？

我尝试过：

1. 定期条件检查：isDisplayed(); isEnabled()。
2. 将代码包装在 try-catch 块中，并尝试通过显式等待检查元素是否满足特定条件。

Answer 1

存在意味着该元素位于 DOM 中，但并不意味着它是可见的。可见性是一种不同的检查。事实上，您可以使用

.isDisplayed()

来测试元素是否可见/显示。请参阅下面的代码示例，该示例检查“按钮”链接，单击左侧导航开关，然后再次检查“按钮”链接。正如您所期望的那样，它会打印

true

然后

false

。

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;

...

String url = "https://automationtesting.co.uk/";

driver = new ChromeDriver();
driver.manage().window().maximize();
driver.get(url);

WebElement buttons = driver.findElement(By.xpath("//a[text()='Buttons']"));
System.out.println(buttons.isDisplayed()); // true
driver.findElement(By.cssSelector("a.toggle")).click();
System.out.println(buttons.isDisplayed()); // false