使用 Capybara 和 Xpath 悬停和单击按钮时遇到问题答案

【问题标题】：Having trouble hovering and clicking button using Capybara and Xpath使用 Capybara 和 Xpath 悬停和单击按钮时遇到问题
【发布时间】：2013-11-27 03:48:32
【问题描述】：

我正在尝试使用 Capybara 单击按钮。我已经尝试了所有我能想到的组合，但没有运气。试图点击“删除”链接。删除链接仅在您将鼠标悬停在表格中的行上时才会显示。

这是 HTML：

    <tbody>
    <tr class="even" id="informal_6">
     <td class="columnOrganizationNameColumnValue" id="informal_7">

       <div>
         <a id="showLink_0" title="Organization Details" class="viewLink">
           Institution / Automation
         </a>
       </div>

       <div class="gridMenuDescription">
          &nbsp;
       </div>

       <div class="gridMenu">
           <a id="gridMenuDirectLink_1" title="Edit Organization" class="gridMenuItem">
             edit
           </a>

           <a id="gridMenuDirectLink_2" class="gridMenuItem delete">
             delete
           </a>
       </div>
     </td>

      </tbody>

我想指出，当您使用 Firebug 将鼠标悬停在“gridMenu”div 上时，它会变成：

       <div class="gridMenu hover gridMenuShow">

我尝试了一些事情，但没有运气：

    find(:xpath, '//*[(@id = "gridMenuDirectLink_2")]').click

    find("#informal_6").find("#informal_7").find(".gridMenu.hover.gridMenuShow").find(".gridMenuItem.delete").click

建议？

【问题讨论】：

您提到的 Xpath 不是按钮，而是链接。试试这个：click_link 'delete'
试过了，没用，我应该补充一点，删除链接只有在您将鼠标悬停在表格中的行上时才会显示

标签： xpath selenium-webdriver capybara

【解决方案1】：

经过大量尝试不同的事情后，我能够让它与这段代码一起工作：

  find('#informal_6').hover.find('.gridMenu').hover.find('.gridMenuItem.delete').click

【讨论】：

【解决方案2】：

尝试使用以下代码将鼠标悬停在该行上。

page.driver.browser.mouse.move_to(page.driver.browser.find_element(:id=>"locator"))

【讨论】：

我在上面调用了一个 .text，我得到了页面上的所有文本，但没有“删除”链接/按钮...
将鼠标悬停在特定行上后尝试获取页面上的文本。

【解决方案3】：

我有一个日历界面，其中 AJAX 编辑和删除链接仅在您将鼠标悬停在每个日历条目上时才会出现。它既漂亮又紧凑，但我很难让 Capybara 点击那些动态显示的元素，并且在父元素上使用 .hover 似乎没有什么不同。所以我尝试了一种到目前为止效果很好的蛮力方法：

# Use Jquery to force display a hidden element. Useful for getting at links
# that are dynamically displayed.
# Call it like: js_show(".entry.scheduled[data-id=\"#{@da3.id}\"] .actions")
def js_show(selector)
  page.execute_script(" $('#{selector}').show(); ")
end

def js_hide(selector)
  page.execute_script(" $('#{selector}').hide(); ")
end

现在，当我需要单击仅在悬停时显示的元素时，我可以调用 js_show(".whatever.container.selector") 强制显示链接，然后 page.find(...).click 起作用。

【讨论】：