Как запустить функцию изменения JQuery из теста Капибара / Полтергейст - PullRequest
Новая
       50

Как запустить функцию изменения JQuery из теста Капибара / Полтергейст

0 голосов
/ 25 сентября 2018

В форме у нас есть следующее поле выбора: 

<select class="hundred js-select2 js-country-check select2-hidden-accessible" name="pledge[pledgor_home_country]" id="pledge_pledgor_home_country" tabindex="-1" aria-hidden="true">
  <option value="GB">United Kingdom</option>
  <option value="US">United States</option>
  <option value="DE">Germany</option>
  <option value="AU">Australia</option>
  <option value="BR">Brazil</option>
  <option value="BG">Bulgaria</option>
  <option value="CA">Canada</option>
  <option value="CN">China</option>
  <option value="DK">Denmark</option>
  <option value="EE">Estonia</option>
  <option value="FI">Finland</option>
  <option value="FR">France</option>
  <option value="HK">Hong Kong</option>
  <option value="IS">Iceland</option>
  <option value="IN">India</option>
  <option value="IE">Ireland</option>
  <option value="IL">Israel</option>
  <option value="KE">Kenya</option>
  <option value="LB">Lebanon</option>
  <option value="LU">Luxembourg</option>
  <option value="NL">Netherlands</option>
  <option value="NO">Norway</option>
  <option value="PL">Poland</option>
  <option value="PT">Portugal</option>
  <option value="SG">Singapore</option>
  <option value="ES">Spain</option>
  <option value="SE">Sweden</option>
  <option value="CH">Switzerland</option>
  <option value="TR">Turkey</option>
</select>

И с ним связана функция JQuery: 

 $('#pledge_pledgor_home_country').change(function() { //change stuff on the page})

Я хочу провести какую-то проверкуэто в наших функциональных тестах, поэтому я попробовал варианты этого: 

When("I select a non-EU country such as Switzerland") do
  find('#pledge_pledgor_home_country').find('option[value="CH"]').select_option    
  script = "$('#pledge_pledgor_home_country').change();"
  page.execute_script(script)
end

Но я не могу заставить его работать - метод Capybara # execute_script всегда возвращает nil, поэтому я неполучить любую обратную связь, и содержимое страницы не меняется, как ожидалось.Если я save_and_open_page и просто запускаю строку $('#pledge_pledgor_home_country') из консоли, он возвращает элемент html <select>, а не объект JQuery, который я получаю при запуске того же сценария на той же странице в Chrome.Но я не уверен, связано ли это с проблемой теста или проблемой с запуском скриптов в браузере без монитора.

Я также попытался использовать этот скрипт в этом тесте на Capybara: script = "$('#pledge_pledgor_home_country').trigger('change');".Это также не сработало.

В Gemfile у нас есть это: 

group :development, :test do
  gem "poltergeist", "~> 1.18.1"
  gem "phantomjs", "~> 2.1.1.0", require: 'phantomjs/poltergeist'
end

В папке features / support проекта Rails я настроил драйвер JS таким образом: 

Capybara.javascript_driver = :poltergeist

Capybara.register_driver :poltergeist do |app|
  Capybara::Poltergeist::Driver.new(app, timeout: 1.day, js_errors: false)
end

И файл функций Cucumber выглядит следующим образом: 

@javascript
@vcr
Scenario: Updating GDPR display by country
  Given I am on the new pledge page # (just loads the page) in question
  When I select a non-EU country such as Switzerland
  ...

Я не уверен, что еще можно попробовать на этом этапе.Есть ли (хороший) способ сделать это?

1 Ответ

0 голосов
/ 25 сентября 2018

Вы используете Poltergeist для своего драйвера, который в основном эквивалентен 7-летней версии Safari с точки зрения поддержки JS / CSS (из-за отказа от PhantomJS).Это приводит к двум возможным причинам вашей проблемы. Во-первых, на вашей странице может быть установлен современный JS, который не совместим с PhantomJS, что препятствует установке вашего обработчика изменений.Вторая возможная проблема заключается в том, что событие изменения не может быть вызвано, пока выбор не потеряет фокус.

Вторую проблему проще всего проверить - щелкните другой элемент на странице после выбора параметра.

Первая проблема сложнее, поскольку PhantomJS не сообщает о некоторых несовместимостях (например, использование let/ const) и просто молча не разбирает JS.Сначала начните с включения ошибок в регистрации вашего драйвера (js_errors: true), чтобы вы не скрывали ошибки активно и исправляли сообщения об ошибках JS.Однако реальное решение состоит в том, чтобы перейти на использование безголового хрома или firefox с помощью драйвера селен-капибары, а не полтергейста, поэтому у вас есть поддержка текущего JS / CSS.

По другим вопросам execute_script невернуть любые результаты, но evaluate_script будет и будет то, что вы должны использовать, если вы ожидаете результатов от вашего JS.Однако использование execute/evaluate_script в тестах для обхода «проблем» является ужасной идеей, поскольку вы сейчас делаете вещи, которые пользователь никогда не сможет и эффективно скрывает реальные проблемы в своем приложении.

Обратите внимание, что из класса js-select2на вашем элементе select я предполагаю, что у вас действительно есть управляемый JS виджет выбора, который заменяет select.Это дает больше свидетельств в отношении первой потенциальной проблемы, поскольку, если бы эта библиотека загружалась, вы, вероятно, не смогли бы использовать select_option. Это связано с тем, что виджеты JS обычно скрывают исходный элемент, что делает его не взаимодействующим, и вам нужно найтии щелкните отдельные элементы, из которых состоит виджет (часто это элементы ul / li).

...