Question

有没有人能够获得jQuery UI对话框按钮来响应click_button或selenium.click？我似乎无法让这个工作。

基本上，我正在尝试使用Cucumber / Webrat / Selenium在Rails应用程序的jQuery UI对话框中测试表单。

我有一个包含许多表行的页面，点击的每一行都会触发一个带有表单的对话框。每个表单元素都有一个唯一的ID，因此标记有效。

由于可以通过Dialog插件动态创建按钮，因此我会初始化对话框以添加“保存”和“取消”按钮。有趣的是，插件插入了一个按钮标签，而不是输入标签。我还在open上添加了id，如下所示，因此按钮可以被测试框架作为目标。

$('.inventory_dialog').dialog({
  autoOpen: false,
  modal: true,
  buttons: {
    'Save': function() {
      // ajax submit stuff
    },
    Cancel: function() {
      // cancel stuff
    }
  },
  open: function() {
    // add ids to buttons for selenium
    var inventory_id = $(this).attr('id').split('_').pop();
    $('.ui-dialog-buttonpane')
      .find('button:contains("Save")').attr('id', 'inventory_'+inventory_id+'_save_button')
      .end()
      .find('button:contains("Cancel")').attr('id', 'inventory_'+inventory_id+'_cancel_button');
  }
});

标记看起来像：

<div id="inventory_dialog_392827" class="inventory_dialog">
  <form action="/suppliers/22/listings/27738/inventory/392827" class="edit_inventory" id="edit_inventory_392827" method="post"><div style="margin:0;padding:0"><input name="_method" type="hidden" value="put" /></div>
    <div class="input_block">
      <label for="inventory_392827_new_quantity">Quantity</label>
      <input id="inventory_392827_new_quantity" name="inventory[new_quantity]" type="text" value="10" />
    </div>
    <div class="input_block">
      <label for="inventory_392827_claim_quantities">Groups of</label>
      <input id="inventory_392827_claim_quantities" name="inventory[claim_quantities]" type="text" value="6-8" />
    </div>
  </form>
</div>

My Cucumber步骤（目前）看起来像：

When /^I click the "(.+)" button in the inventory dialog$/ do |button_name|
  debugger
  selenium.click "//button[@id='inventory_#{@current_offer.id}_#{button_name.downcase}_button']"
  selenium_wait
end

当我运行Cucumber并点击'debugger'时，我可以在输入字段中手动'selenium.click'。

selenium.click "//input[@id='inventory_392827_new_quantity']"

这成功地将光标放在该字段中。但是，单击该按钮不起作用：

selenium.click "//button[@id='inventory_392827_save_button']"

当我在命令行调试器中键入它时，它返回nil（我相信这是成功的，因为没有异常），但Firefox没有做任何事情。对话框在浏览器中保持打开状态。当我输出response.body时，该按钮存在。

我也试过

click_button "inventory_392827_save_button"

但是'selenium_wait'命令超时，这意味着它没有看到该元素。

我被困了......

Answer 1

如果您将其更改为“fireEvent ... click”或clickAt？问题是否会消失？

Answer 2

最好通过其他位置策略（如XPath或CSS）来定位按钮。如果您添加按钮的HTML，那么我将尝试提供一些建议。

如果你的目标按钮有一个'submit'类，你可以使用：

css=input.submit

如果目标按钮的值为“Click Me”，您可以使用：

//input[@value='Click Me']

另一个建议是使用id属性而没有唯一编号，因此以下内容可能对您有用：

//input[substring(@id, string-length(@id) -11, 12) = '_save_button']

Answer 3

我有类似的问题，这就是我如何完成它（使用Capybara / Selenium / Factory_Girl）。

jQuery UI对话框按钮生成此HTML，在我的情况下有两个按钮添加和取消：

<div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
 <button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false">
   <span class="ui-button-text">Add</span>
 </button>

 <button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false">
   <span class="ui-button-text">Cancel</span>
 </button>
</div>

但是click_button方法不起作用，因为实际的按钮名称是一个范围嵌套在按钮标签内，如上所示。

所以我在.feature步骤中写道：

When I press the jquery dialog "Add" button

我把它添加到我的'base.rb'：

# jQuery Dialog buttons
When /^I press the jquery dialog "([^\"]*)" button$/ do |button_text|
  page.find("div.ui-dialog-buttonpane").find('span', :text => button_text).click
end

jQuery UI对话框按钮不响应Selenium / Webrat中的click_button或selenium.click

3 个答案: