css - 在 cucumber 中查找带有标题文本的跨度下方的特定 div 元素

Question

我正在使用 cucumber 和 capybara 来测试具有以下大纲的网页。

<span> Title 1 </span>
<span> Some text </span>
<div> link Y </div>
<span> Title 2 </span>
<span> Some text </span>
<div> link Y </div>
<span> Title 3 </span>
<span> Some text </span>
<div> link Y </div>

我想单击标题 2 下方的链接。但是由于所有链接都具有相同的名称和相同的 css，除了异步 ajax 调用，我可以在查找器中以某种方式使用它吗？
我还想设计一个辅助方法来获取 Title 并找到它的链接，这样一个精确的 xpath 就不起作用了。

到目前为止我已经尝试过:

within(find("span", :text => title)) do
  within(find(:xpath, "../div")) do
    click_link 'publish'
  end
end

如您所知，xpaths 不是我的强项。

我还尝试通过 native 获取 capybara:node:element 的路径，使用: find("span", :text => title).path希望使用它来提取标题跨度的子 nbr 来获取这样的 div find(:xpath, "/div[N]" )。但是 .path给我一个错误，告诉我我的 webdriver 不支持它，我正在使用 selenium webdriver，因为该页面包含异步 ajax 调用。

我也试过查看 .native selenium webdriver 元素，但在那里没有找到任何帮助。

请帮忙!另外在你告诉我之前，不，我不能以任何方式更改网页。

Answer 1

你想做:

title = "Title 2"
within( find(:xpath, "//span[normalize-space(text())='#{title}']/following-sibling::div[1]") ) do
    click_link 'publish'
end

xpath的解释:

//span[normalize-space(text())='#{title}']查找带有标题的跨度。请注意 normalize-space(text())用于通过删除多余的空格来更轻松地处理空格。这允许指定 title作为“Title 2”而不是“Title 2”(即必须指定前导/尾随空格)。

/following-sibling::div[1]表示从找到的跨度中，找到后面的第一个 div 元素。