Кнопки диалогового окна пользовательского интерфейса jQuery не отвечают на click_button или selenium.click в Selenium / Webrat

Кто-нибудь смог заставить кнопки диалогового окна jQuery UI реагировать на click_button или selenium.click? Кажется, я не могу заставить это работать.

По сути, я пытаюсь протестировать форму в диалоговом окне jQuery UI в приложении Rails, используя Cucumber / Webrat / Selenium.

У меня есть страница с множеством строк таблицы, и каждая строка при щелчке запускает диалоговое окно с формой. Каждый элемент формы имеет уникальный идентификатор, поэтому разметка действительна.

Так как кнопки могут быть созданы динамически с помощью подключаемого модуля Dialog, я инициализирую диалоговое окно, добавляя кнопки «Сохранить» и «Отменить». Интересно, что плагин вставляет тег кнопки, а не тег ввода. Я также добавляю идентификаторы при открытии, как показано ниже, чтобы на кнопки можно было нацелить платформу тестирования.

$('.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>

Мой шаг с огурцом (в настоящее время) выглядит так:

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 и он попадает в отладчик, я могу вручную ввести 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 истекло, что означает, что она не видит этот элемент.

Я застрял...


person cotopaxi    schedule 07.12.2009    source источник
comment
В вашей разметке не отображается кнопка. Правильно ли создана кнопка?   -  person AutomatedTester    schedule 07.12.2009
comment
Кнопки создаются динамически плагином диалога jQuery, поэтому я не включаю его в исходную разметку.   -  person cotopaxi    schedule 08.12.2009


Ответы (3)


Проблема исчезнет, ​​если вы измените его на «fireEvent ... click» или на clickAt?

person Patrick Lightbody    schedule 07.12.2009
comment
Я еще не пробовал это (извините), но, похоже, моя проблема связана с response.body, выплевывающим несколько кнопок с одним и тем же идентификатором, хотя в браузере идентификаторы уникальны. Я в недоумении. - person cotopaxi; 08.12.2009

Возможно, было бы лучше найти вашу кнопку с помощью другой стратегии размещения, такой как XPath или CSS. Если вы добавите HTML-код кнопок, я постараюсь дать несколько советов.

Если ваша целевая кнопка имеет класс «отправить», например, вы можете использовать:

css=input.submit

Если целевая кнопка имеет значение Click Me, вы можете использовать:

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

Еще одно предложение - использовать атрибут id без уникального номера, поэтому для вас может сработать следующее:

//input[substring(@id, string-length(@id) -11, 12) = '_save_button']
person Dave Hunt    schedule 08.12.2009

У меня была аналогичная проблема, и вот как я ее решил (используя Capybara / Selenium / Factory_Girl).

Кнопки диалогового окна пользовательского интерфейса jQuery генерируют этот 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
person iuri    schedule 28.10.2010