Закрытие модального окна с помощью Capybara

У меня есть модальное окно, которое закрывается при нажатии на его оверлейный div. Оверлей распространяется на всю страницу, но находится под самим модальным окном. Я хочу закрыть это модальное окно в своих тестах, и важно, чтобы оно закрывалось при нажатии на оверлей.

# modal, simplified
<div class="modal-container" id="modal">
  <div class="overlay"></div>
  <div class="content">Content</div>
</div>

Когда модальное окно закрывается, его тег стиля читается как «отображение: нет».

# modal, closed
<div class="modal-container" id="modal" style="display:none;">
  <div class="overlay"></div>
  <div class="content">Content</div>
</div>

Я не смог закрыть этот модал в Capybara. Я пытался:

1. page.execute_script("$('.overlay').trigger('click')")
2. page.evaluate_script("$('.overlay').trigger('click')")
3. find('.overlay').trigger('click')
4. page.driver.click(10, 10)

Варианты 1 и 2 работают, когда я запускаю их в консоли браузера, но не в своих тестах.

Когда я подглядываю в свой тест, я нахожу это:

find('.overlay')
=> #<Capybara::Element tag="div">
page.has_content?("modal content")
=> true
find('.overlay').trigger('click')
=> "click"
find('.overlay')
Capybara::ElementNotFound: Unable to find css ".overlay"
page.has_content?("modal content")
=> true

Сон тоже не помог:

sleep(3)
page.evaluate_script("$('.overlay').trigger('click')")
sleep(3)
display = page.execute_script("document.getElementById('modal').style.display")

expect( display ).to eq("none")

есть идеи?

RSpec 2, Капибара, Полтергейст 1.5.1


person steel    schedule 15.10.2014    source источник


Ответы (2)


Наиболее вероятная проблема заключается в том, что когда вы делаете это вручную в pry, вы достаточно медленны, чтобы событие щелчка наложения было добавлено к тому времени, когда вы щелкаете по нему, поэтому это приводит к исчезновению модального окна. Ваши тесты, вероятно, выполняются достаточно быстро, чтобы щелкнуть оверлей до того, как будет добавлено событие щелчка.

Вам либо нужно будет добавить явное sleep(n) перед тем, как щелкнуть по нему (не лучшее решение), либо найти какой-то способ программно определить, когда страница готова для нажатия на оверлей.

person Matt Metzger    schedule 15.10.2014
comment
Спасибо, @Мэтт. Я пытался спать в течение 3 секунд перед выполнением и 3 секунды после, перед проверкой, и даже это не помогло этой работе. Однако я обновил свой вопрос с этой попыткой. - person steel; 15.10.2014

Это сработало для меня:

page.evaluate_script("$('#ModalID').modal('hide')")
person Wojtek Kostański    schedule 20.10.2017