在水豚中查找隐藏的元素

Question

学习“水豚”，遇到了通过水豚寻找隐藏元素的问题。

在HTML中，我们有一个文件域，默认情况下是'display: none‘。HTML元素是：

<input class="some_class" id="some_id" name="some_name" type="file">

现在，当我使用cucumber用水豚编写测试用例时，我在我的水豚脚本中找不到这个元素。我的水豚脚本就是这样找到元素的：

find(:xpath, "//input[@name='some_name']")

阅读有关隐藏元素的信息并了解该设置

Capybara.ignore_hidden_elements = false

应该能解决我的问题。但我在其他地方看到上面的设置是默认的。因此，我尝试了显式传递它的其他选项。像这样：

find(:xpath, "//input[@name='some_name']", :visible => false)

这也不管用。还有什么我应该试试的吗？将乐于分享更多细节，以防任何人感兴趣。

Answer 1

visible选项有几个潜在的值

1. true或:visible =>仅查找可见元素
2. false或:all =>仅查找可见和不可见的元素=>

仅查找不可见的元素

因此，如果您尝试的find(:xpath, "//input[@name='some_name']", :visible => false)没有返回元素，则页面中没有与该XPath匹配的元素，您需要检查页面的内容是否为您认为的内容(page.html、page.save_screenshot等)

除此之外，您的示例还存在一些问题。首先，你掉进了XPath // trap。如果(这应该是一个很大的假设)你将经常使用XPath查询来查找你的元素，习惯于用.//开始你的查询，而不仅仅是// -如果你不这样做，你就破坏了Capybara在页面上的所有作用域(within，链式find，等等)。使用CSS选择器没有这个问题，所以对于大多数没有使用Capybara内置选择器类型的查询来说更有意义。

find("input[name='some_name']", visible: false)

知道我们正在寻找一个文件输入，我们可以通过使用Capybara内置的file_field选择器来做得更好

find(:file_field, 'some_name', visible: false)

它更容易阅读，并准确地解释了您正在寻找的内容。下一步，由于您正在查找一个文件字段，因此我假设您实际上想要向其中添加一个文件。这可能是有问题的，因为不可见元素通常不能与之交互。然而，由于文件字段通常是隐藏的，为了允许样式，有一个选项可以帮助实现这一点。

attach_file('some_name', file_path, make_visible: true)

make_visible: true选项将临时更改元素CSS以使其可见(如果默认CSS在您的页面上不起作用，您可以将其设置为CSS值的哈希值，而不是true )，将文件附加到它，然后恢复CSS更改。

最后一点，如果你正在测试一个应用程序，设置Capybara.ignore_hidden_elements = false是一个糟糕的想法(如果只是做自动化就可以了)，因为它导致的测试实际上并不是测试用户可以看到/做什么。