Кнопки диалогового окна пользовательского интерфейса jQuery не отвечают на кнопки click_lena или selenium.click в Selenium / Webrat - PullRequest
1 голос
/ 07 декабря 2009

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

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

Я застрял ...

Ответы [ 3 ]

0 голосов
/ 08 декабря 2009

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

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

css=input.submit

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

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

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

//input[substring(@id, string-length(@id) -11, 12) = '_save_button']
0 голосов
/ 28 октября 2010

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

Кнопки JQuery UI Dialog генерируют этот HTML, в моем случае с двумя кнопками Add и Cancel:

<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 не работает, потому что фактическое имя кнопки - это span вложенный в тег кнопки, как вы можете видеть выше.

Итак, я написал на шаге .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
0 голосов
/ 07 декабря 2009

Устранится ли проблема, если вы измените ее на "fireEvent ... click" или на clickAt?

...