通过Capybara(v2)与Bootstrap模态交互时出现问题

bvn4nwqk  于 12个月前  发布在  Bootstrap
关注(0)|答案(4)|浏览(214)

在一个Rails应用程序中,我试图使用带有capybara-webkit驱动程序的Capybara在Rspec中测试带有jQuery TokenInput field的Bootstrap模型。有问题的部分如下:

click_link 'Create Team Modal'
sleep 1

within('div#modal_popup') do
  fill_in 'input#token-input-team_name', with: 'Fancy team name'
  sleep 1
  fill_in 'input#token-input-team_name', with: '\t'
  sleep 1

  click_button 'Create Team'
end

page.should have_content('Fancy team name')

字符串

  • 点击按钮获取模态
  • 在TokenInput中填写团队名称
  • 模拟按Tab键以选中它
  • 创建团队
  • 验证名称是否显示在页面上

这将只适用于所有这些sleep 1的地方;否则Capybara崩溃在have_content,最终导致服务器错误,因为团队名称永远无法正确选择。其他Bootstrap modals * 没有 * TokenInput字段在加载之前不需要sleep 1
说了这么多,有没有办法摆脱睡眠,让这一切正常进行?水豚2拿出wait_until(有很好的理由)因为它会在默认的等待时间内等待测试某些东西.但这似乎没有反映在我上面的测试中;这就好像水豚在进入/退出这个模式时并不参与等待期。有人对此有任何经验吗?使用Rails 3.2.10,Rspec 2.12,Capybara 2,capybara-webkit 0.14.0,TokenInput 1.6.

7fhtutme

7fhtutme1#

尝试在测试环境layouts/application.html.erb中禁用动画

<% if Rails.env.test? %>
 <style type="text/css">
    .modal.fade, .fade {
      -webkit-transition: opacity 0.01s;
      -moz-transition: opacity 0.01s;
      -ms-transition: opacity 0.01s;
      -o-transition: opacity 0.01s;
      transition: opacity 0.01s;
    }
 </style>
<%end%>

字符串

vmjh9lq9

vmjh9lq92#

我建议在你的测试环境中添加以下css:

div, a, span, footer, header {
      -webkit-transition: none !important;
      -moz-transition: none !important;
      -ms-transition: none !important;
      -o-transition: none !important;
      transition: none !important;
  }

  .modal {
    display: none !important;
  }

  .modal.in {
    display: block !important;
  }

  .modal-backdrop {
    display: none !important;
  }

字符串
在body的and中添加以下js:

$(".fade").removeClass("fade");


这已经解决了我与水豚和靴带的大部分问题。

l2osamch

l2osamch3#

我们只是这样做,它似乎工作(例如点击$('.tp-header-login'):

# instead of find(".tp-header-login")

find(".tp-header-login") # still do the find so you are sure its loaded then...
execute_script "$('.tp-header-login').click()"

字符串

z9ju0rcb

z9ju0rcb4#

对于那些希望避免Rails.env.___? hack * 的人来说,下面的 * 似乎可以避免在基于Bootstrap的模型上测试jQuery UI drag-and-drop functionality时出现的问题。
首先,我们已经在 “等待” 模态的出现,使用一个像这样的帮助方法:

def wait_for_modal_to_appear
  modal = wait_until {
    # Look for the modal by ID/whatever...
  }
  raise Capybara::ModalNotFound.new('...') if modal.nil?
  return modal
end

字符串
然而,当我们尝试在该模式中拖放元素时,仍然会遇到虚假的问题。下面的代码添加,添加在return行之前,* 似乎 * 已经完成了任务:

page.execute_script("document.getElementById('#{modal[:id]}').classList.remove('fade');")

  • 最近,我工作的一家公司就发生了这样的黑客攻击,导致需要紧急部署..

相关问题