使用 Capybara 查找 JQuery/AngularJS 向元素添加的数据答案

【问题标题】：Find JQuery/AngularJS added data to an element with Capybara使用 Capybara 查找 JQuery/AngularJS 向元素添加的数据
【发布时间】：2015-12-24 05:22:28
【问题描述】：

我需要测试一个网页，其中 jQuery/AngularJS 将一些数据添加到元素的属性中，在本例中为“值”，默认选择器不可见。我正在使用 Capybara 和 Poltergeist。我想验证元素值，但标准方式失败：

expect(find(:xpath, "//input[@type='text']").value).to eq('3')

或

find("//input[@type='text']/@value='3'")

元素看起来像这样（值出现在属性中）：

<input type="text" ng-model="link.days_until_expiration" placeholder="Never" maxlength="4" ng-change="passPositiveNumbers(link);" class="ng-pristine ng-valid">

在 Chrome 控制台中，我可以选择它

$('input[type="text"]').data('value', '3')

但是Capybara中没有数据方法。

【问题讨论】：

标签： jquery angularjs capybara poltergeist

【解决方案1】：

JS 将影响 value 属性而不是 value 属性，这意味着您无法使用 xpath 查询它（您只能查询页面加载/解析时存在的 value 属性） - 如果它是唯一的使用“从不”作为占位符/id/名称/标签的输入，或者您可以使用父元素对其范围进行限定，因此它是唯一匹配的输入，那么以下应该可以工作（如果需要范围，请将页面替换为找到的父元素）

expect(page).to have_field('Never', with: '3')

【讨论】：