通过硒是一套服务和工具，可以用来在web浏览器中运行脚本自动化测试，以验证web应用程序的功能。编写Selenium脚本可能很有挑战性，但是如果脚本需要找到并选择通过后端更改或通过JavaScript或CSS库进行动态更改的页面元素，那么它们就会变得特别复杂。
New Relic的人工合成物提供在Selenium上构建的复杂脚本浏览器监控，我们依靠该功能来测试自己的产品。作为综合团队的工程师，我首先知道我们的脚本浏览器一致，可靠，可读的重要性，特别是如果警报触发了深夜调试会话。
幸运的是，有一些方法可以使Selenium脚本更有弹性，因此您不必担心将来对web应用程序的更新是否会改变您所测试页面的结构。
两个常用选择器:XPath还是CSS?
Selenium提供了几个定位器，其中两个是常用的:CSS和XPath．元素中的元素都指向域对象模型(DOM)-a编程接口，表示页面结构的视觉模型 - 但它们表现得略有不同。例如，XPath包括CSS没有的一些功能，例如能够从父元素遍历父元素。XPath定位器也可以在较旧的浏览器中遍历DOM。因此，例如，如果您正在运行针对IE8的脚本，则可能需要使用XPath。
然而，对于现代浏览器来说，这种选择通常是个人偏好的问题。但是，您确实需要选择一个策略，并保持一致，以便任何可能使用您的脚本的人都可以阅读和维护它们。
这篇文章将专注于CSS选择器;它们是可读，可访问的，突出的 - 毕竟，您可以在每个网站上找到它们。请记住，申请页面上的好CSS不一定转化为Selenium选择器中的良好CSS。例如，Web开发人员通常在串联中更改页面的标记及其CSS。虽然这不一定会在页面上打破选择器，但它可能导致硒脚本中的损坏选择器。同样，当开发人员使用CSS键入页面时，它们针对符合选择器的所有元素。但在您的Selenium脚本中，您希望将特定元素隔离以验证其内容或选择它。这些不同的目标赋予了不同的CSS使用。
使用开发人员工具使您的生活更轻松
在我们深入研究在Selenium脚本中使用CSS选择器的例子之前，我想指出谷歌chrome中的一个工具(以及其他开发人员工具附带的浏览器)，它可以使编写脚本变得更加容易。
在Chrome中，你可以复制一个元素的CSS选择器到剪贴板，然后直接粘贴到你的脚本。要做到这一点，打开Chrome的开发者工具(视图>开发人员>开发人员工具)，检查所需的元素，然后右键单击该元素(在下一节的示例中，我选择h1元素),并选择复制>复制选择器．这个方便复制选择器快捷方式通常是在脚本中包含CSS选择器的最快方法，而不必担心引入拼写错误或更改页面的DOM结构。(注意，执行此任务所需的具体步骤可能因浏览器而异。)
研究选择器
让我们仔细看看CSS选择器。
在下面的页面中，我将选择“在您的客户做之前捕获问题”h1元素-它会导致以下CSS选择器:
#main-content > div.p12-text-image-header > section > div > div > div.col-sm-12。Col-md-7 > div > div > div > h1
选择器将为您提供到所选对象的整个DOM树路径h1，但它非常冗长。它也是非常通用的，几乎没有为编写或调试Selenium脚本提供有用的上下文。这种冗长的选择器类型也很脆弱，因为它向选择器添加了更多的元素。向页面添加更多元素可能会中断选择器并破坏脚本。
为什么环境问题
假设我们的营销团队坚持认为，这个页面始终保留这个标题，因为它很棒的转换。在这种情况下，我们希望我们的测试脚本来验证主标记不会改变并仍然存在h1元素。
确保我们瞄准这一节的一种方法是使选择器更具体、更简洁，并使它更接近目标。例如，让我们看看最初的选择器:
#main-content > div.p12-text-image-header > section > div > div > div.col-sm-12。Col-md-7 > div > div > div > h1
选择器的末尾是h1元素作为目标。它是a的子元素div;还有一些，大多是无名的，div标记组成了选择器的其余部分，它并没有提供太多的上下文。看看围绕我们的h1元素，我们看到以下内容:
如果我们仔细看看这个例子，我们会看到一个非常常见的情况:几乎所有的元素都使用类而不是id。这就是为什么选择器h1元素是如此冗长。
下面是一种创建有用选择器的方法:
首先，删除任何隐含元素或本身不提供上下文的元素。例如,#主要内容元素并不是真正必要的，因为它只是暗示元素在页面的主部分(而不是在，例如，页眉或页脚)，我总是期望英雄部分(在其中h1坐在)在主要部分。要使这个元素选择器更具体，请确保h1元素总是英雄区段的一部分，可以这样验证。为此，将原始选择器替换为如下内容.hero h1．
这个目标h1元素，位于hero类(它定义了hero部分)元素中的某个位置。这应该充分考虑到我们如何h1标记用于内容创建(例如，一个页面上不应该有多个标记)。但是，由于我们通常不控制正在监视的标记，所以可以在选择器中包含一个CSS伪类，以确保您的目标是第一个h1元素中的英雄类。这个伪类看起来像这样.hero h1: first-of-type．
像这样对选择器做一个细微的调整，就能精确地指定你想要的东西，也能让你的脚本在任何人对你的web应用程序做出更改时更有弹性。
简单脚本的四条指导原则
当然，没有人能让Selenium脚本100%不受web应用程序的变化影响，但是遵循以下四个简单的指导原则可以帮助您使脚本更加健壮和一致。
- 为元素使用最特定的属性。如果元素有一个ID，使用这个ID而不是类或名称，因为ID是页面上元素的唯一标识符。
- 在选择选择器时，尽可能接近目标，并为您期望选择器做什么提供大量上下文(如上所示)。清晰的意图将使您的脚本更易于维护和调试。
- 让你的选择器尽可能的短，并使他们具体。使用CSS伪类，但要谨慎使用，以避免模糊选择器的上下文。例如,
div: nth-child (5)告诉我们是5号div的内容将被选择，但它并没有给我们更多关于div． - 如果没有办法让你的选择器简短，提供尽可能多的冗长的上下文。
你的web应用程序是动态的;它们会像你的业务一样发展。这些简单的技巧应该使您能够创建更通用、更有弹性的Selenium脚本。
尝试你的硒脚本与新的Relic合成
New Relic synthes让你主动监控你的web应用程序与硒供电的谷歌Chrome浏览器构建使用硒WebdriverJS图书馆．这是一种扩展和自动化测试、监视和警报的灵活方法。您可以使用New Relic脚本浏览器运行你的脚本从一个(或所有!)的合成上市或者私人监视全球各地的位置，并全面了解您的应用程序在哪些地方如预期的那样运行，以及在哪些地方可能需要注意。
通过
通过
通过
通过