用poltergeist（phantomjs）測試響應式設計

Question

我正在使用Twitter Bootstrap和poltergeist。我試圖隱藏移動分辨率的一些元素，例如：

觀點：

<th class="hidden-phone">Email</th> .... 

CSS：

.hidden-phone { 
    display: none !important; 
} 

規格：

context 'Phone', js: true do 
    it 'should hide some elements' do 
    page.driver.resize 320, 480 
    visit my_path 

    within '#members_list thead tr' do 
     expect(page).not_to have_content 'Email' 
    end 
    end 
end 

但測試沒有按」通過：

Failure/Error: expect(page).not_to have_content 'Email' 
    expected content "Email" not to return anything 

什麼可能是錯誤的？當我使用page.driver.render元素隱藏屏幕轉儲時。

Answer 1

have_content方法的默認選項將查找所有文本，忽略隱藏的內容。

嘗試

expect(page).not_to have_content(:visible, 'Email') 

文檔在這裏http://rubydoc.info/github/jnicklas/capybara/master/Capybara/Node/Matchers#has_text%3F-instance_method

Answer 2

從你的例子我的猜測是，該元素是用JavaScript或一些異步行爲被隱藏，所以當斷言正在評估它可能是仍然可見。

爲了讓它等待元素變爲隱藏或不可見，您可以使用Capybara API中的構建（我假設您使用的是Capybara）爲異步行爲提供了很好的支持。因此，而不是使用斷言：

expect(page).not_to have_content 'Email' 

你可以使用：

page.should_not have_selector("#members_list thead tr", :text => "Email") 

或：

page.find("#members_list thead tr").should_not have_content("Email") 

只是檢查CSS選擇器是根據你正在評估的元素。

有關如何這兩個建築作品或行爲更多的解釋，這裏的引用： Capybara - Asynchronous JavaScript (Ajax and friends)
Why wait_until was removed from Capybara

如果它需要很多時間的元素被隱藏因爲他們等待緩慢AJAX請求，可以增加等待時間Capybara它通過指定spec_helper.rb文件下面給出了一個TimeOutError前：

Capybara.default_wait_time = 30 

，同時也爲該poltergeist司機給超時前等待更多的時間：

Capybara::Poltergeist::Driver.new(app, { timeout: 40 }