nightwatch，选择具有相同输入类型的第二个元素答案

【问题标题】：nightwatch, select second element with same input typenightwatch，选择具有相同输入类型的第二个元素
【发布时间】：2017-08-11 11:22:00
【问题描述】：

我正在编写测试以使用 javascript 在 nightwatch 中执行。为了注册一个新帐户，我在填写同一张表格下有两个密码字段。我使用与input[type=password] 连接的表单的id 选择它们，然后使用.setValue() 将一些字符串插入其中。

问题在于区分这两个密码字段。我不想使用 id 或 class 来选择它们，因为我不希望它以这种方式依赖于 css。这是因为测试是针对开发人员不断工作的实时网站，并且每次 css 名称更改时，如果它依赖于元素的 id 而不是它们的类型，则必须修改测试。我无法控制许多开发人员以及他们更改和不更改的名称。我唯一的选择是尽可能独立于 css 编写测试。如果我可以使用类型选择密码字段，我将只依赖用于选择密码字段、用户名字段和登录按钮的表单名称。

有没有办法做到这一点？提前致谢。

【问题讨论】：

标签： javascript nightwatch.js

【解决方案1】：

我不确定您是否可以在不依赖“任何”形式的 css 的情况下智能地做到这一点。 HTML 是一种 DOM 表示，因此您至少必须在该方面工作。

但是，您可以不使用特定的 id、属性和仅在 DOM 类元素中工作。

例如，如果您有以下情况：

<form>
    <input>a</input>
    <input>b</input>
</form>

您可以将"form > input:nth-of-type(2)" 作为您的选择器。所以它总是会抓取form的直接子元素下的第二个input元素

http://www.w3schools.com/cssref/sel_nth-of-type.asp

然而，这假设结构被锁定并且并不总是改变。

希望这会有所帮助！

【讨论】：

实际上我正在使用的是<form> <span> <div> <span> <input type="email"></input> <input type="password"></input> <input type="hidden"></input> <input type="password"></input> ... </span> </div> </span> </form> ，当我尝试调用你给我的命令时，它返回找不到。知道为什么吗？
嘿@NegarNegaru 我给你的选择器假设表单作为直接子元素输入。从您更新的结构来看，里面有一个跨度和 div。尝试从定位器中删除>，使其省略中间的结构。 form input:nth-of-type(2) 也从您更新的评论中，您也有一个类型属性。您也可以使用它。

【解决方案2】：

您可以将 <input> 视为从 1 开始计数的数组因此，如果您想获得第二个输入，只需执行

.setValue('//form[@id="yourformid"]/input[2]','blablabla')

【讨论】：