Capybara Datalist Select 不可见答案

【问题标题】：Capybara Datalist Select not visibleCapybara Datalist Select 不可见
【发布时间】：2018-04-26 17:28:31
【问题描述】：

我有以下 HTML sn-p:

<input type="text" id="manufacturer" list="manufacturers" placeholder="Search by manufacturer name or supplier code" class="form-control form-control-2-3" value="" name="manufacturer">


 <datalist id="manufacturers">
     <select>
      <div>
       <option value="Jaguar">AA</option>
       <div></div>
      </div>
      <div>
       <option value="Audi">AB</option>
       <div></div>
      </div>
     <div>
       <option value="Mercedes">AC</option>
       <div></div>
     </div>
     </select>
    </datalist>

这是一个下拉菜单，我想选择其中一个选项。无论我尝试使用任何查找命令或选择功能。我总是遇到同样的错误：

Selenium::WebDriver::Error::ElementNotVisibleError: element not visible: Element is not currently visible and may not be manipulated

有人对如何确定这些选项的范围并选择一个有任何建议吗？

谢谢。

【问题讨论】：

这是一个非常有趣的问题，你的整个数据列表处于隐藏模式，当我点击 text_field 时，列表会弹出，但 selenium 仍然没有检测到这个列表是可见的，这就是这个错误的原因。
泡菜对吧
我尝试了所有可能的方法，我不知道如何与这个元素进行交互，也许这可以通过activebuilder实现，但我不知道如何！
你好，如果你不是我的，你能添加标签WATIR吗？人们也许会在你的路上回答你的答案。可以吗？
如果你使用 Capybara go 和 capybara 标签，如果你使用 watir go 和 watir 标签——它们是相互排斥的工具，添加两个标签只会让人们感到困惑跨度>

标签： ruby cucumber capybara

【解决方案1】：

您当前无法执行此操作，因为它实际上不是下拉选择元素。选项元素在页面上实际上是不可见的，因为标准规定“在渲染中，datalist 元素不代表任何内容，它及其子元素应该被隐藏”。 -https://html.spec.whatwg.org/dev/form-elements.html#the-datalist-element。相反，datalist 中的任何

fill_in("manufacturer", with: 'Jaguar')

【讨论】：

好的，希望这可能会有所改变。谢谢，汤姆。
在针对 webdriver 的推荐推荐（截至目前）w3c 规范中，人们认识到处理显示性特别具有挑战性 (w3.org/TR/webdriver/#element-displayedness)。话虽如此，理论上作为选择标签的后代的选项标签不应被评估为模糊（w3.org/TR/webdriver/#x11-1-element-interactability）。我不确定为什么datalist 的存在应该使这种行为有所不同（尽管在这种情况下显然是这样）。
我用 Firefox 尝试了这个例子（它试图完全兼容 w3c），我什至无法让它在浏览器中正确显示，甚至尝试使用驱动程序.所以，也许这应该被记录为 Firefox 错误，看看 Mozilla 是否同意应该改变这种行为。
@titusfortner 链接到文本输入的数据列表与带有嵌套选项元素的选择完全不同。它实际上只是提供自动填充建议，用户无法点击实际的选项元素。
@Tom 仅供参考 - 有一个 PR -github.com/teamcapybara/capybara/pull/2021 - 这将允许您将 select 与数据列表输入一起使用。假设它没有任何不可预见的副作用，它可能最终会出现在 Capybara 3.1 - 您可以在此之前从 datalist 分支尝试它。它最终只是做了一个fill_in，但验证该选项之前是否在数据列表中。