Làm cách nào để kiểm tra xem div có kiểu css nhất định trong rspec/capybara không?

Question

Làm cách nào để bạn kiểm tra xem thẻ div có kiểu css nhất định không? Tôi đang cố gắng kiểm tra nếu nó có display:none; hoặc display:block.

Tôi đã thử các sau nhưng nó đem lại cho tôi một lỗi:

it {should have_selector('signup_server_generic_errors', /display:\s*none/)} 

Answer 1

tôi khuyên bạn nên thay vì cố gắng để xác định vị trí theo phong cách css, bạn thay vì viết bài kiểm tra của bạn để tìm ra tên lớp css.

Bằng cách này bạn có thể thay đổi kiểu dáng css cơ bản trong khi vẫn giữ nguyên lớp và các bài kiểm tra của bạn sẽ vẫn vượt qua.

Tìm kiếm kiểu dáng cơ bản là giòn. Kiểu thay đổi thường xuyên. Căn cứ vào rspecs của bạn trên việc tìm kiếm các yếu tố phong cách cụ thể làm cho thử nghiệm của bạn giòn hơn - họ sẽ có nhiều khả năng thất bại khi tất cả các bạn làm là thay đổi giao diện của div.

Căn cứ vào các bài kiểm tra của bạn về việc tìm các lớp css làm cho các bài kiểm tra trở nên mạnh mẽ hơn. Nó cho phép họ đảm bảo mã của bạn hoạt động chính xác trong khi không yêu cầu bạn thay đổi chúng khi bạn thay đổi kiểu trang.

Trong trường hợp này, một tùy chọn có thể là xác định một lớp css có tên .hidden đặt display:none; trên một phần tử để ẩn nó.

Như thế này:

css:

.hidden { 
    display:none; 
} 

html:

<div class="hidden">HIDE ME!</div> 

Capybara:

it {should have_css('div.hidden') } 

Capybara này chỉ trông cho một div mà có hidden class - bạn có thể làm cho matcher này tinh vi hơn nếu bạn cần.

Nhưng điểm chính là - gắn các kiểu vào các tên lớp css, sau đó buộc các bài kiểm tra của bạn vào các lớp, chứ không phải các kiểu.

Answer 2

Bạn có thể sử dụng đối sánh has_css?. Nó có thể chấp nhận các tùy chọn :visible. Để biết thêm chi tiết bạn có thể kiểm tra tài liệu: http://rdoc.info/github/jnicklas/capybara/Capybara/Node/Matchers#has_css%3F-instance_method

Ví dụ, bạn có thể thử:

it { should have_css('div.with-some-class', :visible => true) }

Answer 3

cách của tôi để đảm bảo yếu tố đó có một lớp nhất định:

let(:action_items) { page.find('div.action_items') } 

it "action items displayed as buttons" do 
    action_items.all(:css, 'a').each do |ai| 
    expect(ai[:class]).to match(/btn/) 
    end 
end 

hoặc smthing như thế này

expect(ai[:style]).to match(/color: red/) 

Tôi tìm thấy ở đây: http://rubydoc.info/github/jnicklas/capybara/Capybara/Node/Element#%5B%5D-instance_method