将 CSS 与 Selenium 2 / Webdriver 一起使用答案

【问题标题】：Using CSS with Selenium 2 / Webdriver将 CSS 与 Selenium 2 / Webdriver 一起使用
【发布时间】：2013-04-29 19:15:50
【问题描述】：

所以我是 Selenium 的新手，我几乎没有任何编程等方面的背景。所以这是我的困境：通常我会使用 firefox 插件来查找 Xpath 定位器来创建自动化测试脚本。我知道使用 CSS 定位器要好得多，但是当我右键单击并打开“检查元素”窗口时，我在尝试解密浏览器中看到的 CSS 时遇到了麻烦。我的问题：有没有一种方法可以让我学会如何很好地阅读 CSS 以在我的测试脚本中使用 CSS 定位器，而无需从内而外地学习整个事情？也许某种参考可以很容易地学习到足以在任何 Web 元素上找到 CSS 信息。提前致谢！

【问题讨论】：

标签： css selenium automation webdriver qa

【解决方案1】：

您使用什么 Firefox 插件来查找 Xpath？试试Firepath，它位于Firebug 之上，并且像xpath 一样具有css 评估器。请看截图。

【讨论】：

+1，这可能是 OP 想要避免跑腿的最好方法。虽然，OP，我强烈建议您花时间阅读 CSS 规范，首先了解选择器及其背后的逻辑。否则，您将不知道如何制作可靠的选择器。如果有人问“这个选择器是做什么的？”，你会怎么做？你不知道，因为你只是用了一个插件？

【解决方案2】：

使用 Firepath 查找 CSS 定位器是个好主意，但我建议您不要使用 CSS 定位器来编写自动化脚本。这是因为 CSS 定位器严重依赖于 .CSS 文件中定义的 CSS 属性。

因此，如果开发人员更改了任何元素的单个属性，那么 Selenium IDE 可能会也可能不会找到您想要的相同 CSS 选择器。

因此最好先使用 ID，因为它们不会经常更改。如果 Selenium 没有找到 ID，那么您可以使用 xpaths，然后剩下的最后一个选项是 CSS 定位器。

【讨论】：

CSS 选择器几乎与 XPath 一样灵活，并且在几乎所有情况下都应优先于 XPath。每个现代浏览器都实现了原生 CSS 选择器引擎；并非每个浏览器都实现了 XPath-over-HTML 引擎。 WebDriver 可以利用可用的本地实现，这意味着 CSS 选择器通常几乎总是比 XPath 快。此外，使用 CSS 选择器并不一定意味着您使用样式表样式的属性。你可能会，但不一定。