作UI自动化你还在手写xpath，绝对xpath，cssSelectors，linkText和partialLinkText定位元素么？你 out啦，快看这里！

前言：AutonomIQ提供了一个开发人员平台ChroPath来生成和验证独特的选择器，例如devtools面板中的相对xpath

ChroPath Chrome插件图片预览

ChroPath-Chrome扩展插件介绍
ChroPath只需单击一下便可生成惟一的相对xpath，绝对xpath，cssSelectors，linkText和partialLinkText。ChroPath也能够用做选择器的编辑器。它能够在任何网页上轻松编写，编辑，提取和评估XPath查询。ChroPath还支持iframe和动态id。

1。右键单击该网页，而后单击“检查”。
2。在“元素”选项卡的右侧，单击“ChroPath”选项卡。若是它不可见，请扩展devtools。
3。要生成选择器，检查元素或单击任何DOM节点，它将生成惟一的相对XPath /绝对XPath / CSS选择器/ linkText / partialLinkText。BR> 4。要评估XPath / CSS，请键入XPath / CSS查询并按Enter键。
若是输入，它将在DOM中查询相关元素/节点。您能够按顺序查看匹配的节点和节点值。周围会出现绿色轮廓以突出显示第一个匹配的元素，并在网页中以蓝色显示。
5。若是将鼠标悬停在ChroPath选项卡中的任何匹配节点上，绿色/蓝色虚线轮廓将转换为点状橙红色以突出显示网页中的相应元素。
6。若是找到的元素不在网页上的可见区域中，则鼠标悬停在ChroPath面板中的找到节点上将在可见区域中滚动该元素，并带有点缀橙红色轮廓。
7。若是找到的元素没有突出显示可是可见，那么在鼠标悬停在ChroPath选项卡上的匹配节点上时，它将突出显示带有橙色红色轮廓的元素。
8。只需单击复制图标便可复制定位器。
9。若是要编辑任何定位器，请单击编辑图标。

iframe feature
*仅支持具备相同src的iframe。结果1。若是iframe中的元素，那么它将突出显示橙色虚线轮廓中的第一个匹配元素。
2。它还会在ChroPath选项卡的输入框中添加一个“if …”图标，以明确该元素位于iframe内。
3。若是你想在iframe中验证你的选择器，那么首先检查那个iframe中的任何元素，以便它得到iframe的DOM，而后验证选择器。
4。再次，若是您要验证iframe外部元素的任何选择器，那么首先检查iframe外部的任何元素，以便它得到顶级DOM，而后验证选择器。

动态ID支持
1。要生成没有id的相对xpath，请取消选中相对xpath行中的复选框。
2。要生成带有id的相对xpath，请选中该复选框。

开/关按钮
1。若是您不想生成选择器，请关闭ChroPath选项卡中的可用按钮。
2。打开按钮再次启用ChroPath。

黑暗主题
1。要使用黑暗主题，请转到devtools设置。
2。将主题从浅色变为暗色。

注意：
1。仅限一个选择器，将标题中的选择器的下拉值更改成rel XPath / abs Xpath / CSS sel。
2。工具将根据顺序出现将xpath / css属性添加到全部匹配节点。例如，列表中第二个出现的匹配节点将具备xpath = 2。若是验证CSS，那么它将添加css = 2.。3。仅支持具备相同src的iframe。