Wie testen Sie, ob ein Div einen bestimmten CSS-Stil in RSPEC/Capybara hat?

Question

Wie testen Sie, ob ein div-Tag einen bestimmten CSS-Stil hat? Ich versuche zu testen, ob es display:none; oder display:block hat.

habe ich versucht, die folgenden aber die mir einen Fehler geben:

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

Answer 1

ich, dass anstatt zu versuchen, würde empfehlen, den CSS-Stil zu finden, können Sie Ihre Tests statt schreiben die CSS-Klassennamen zu finden.

Auf diese Weise können Sie das zugrunde liegende CSS-Styling ändern, während Sie die Klasse beibehalten und Ihre Tests bestehen bleiben.

Die Suche nach dem zugrunde liegenden Stil ist spröde. Stile ändern sich häufig. Wenn Sie Ihre rspecs auf das Finden bestimmter Stilelemente ausrichten, werden Ihre Tests spröder - sie werden eher ausfallen, wenn Sie nur das Aussehen und Verhalten eines divs ändern.

Wenn Sie Ihre Tests zum Auffinden von CSS-Klassen durchführen, werden die Tests robuster. Dadurch können Sie sicherstellen, dass Ihr Code ordnungsgemäß funktioniert, ohne dass Sie sie beim Ändern des Seitenstylings ändern müssen.

In diesem Fall kann eine Option sein, eine CSS-Klasse mit dem Namen .hidden zu definieren, die display:none; auf ein Element setzt, um es auszublenden.

So:

css:

.hidden { 
    display:none; 
} 

html:

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

Capybara:

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

Das Capybara nur für ein div sieht, der die hidden hat Klasse - Sie können diesen Matcher anspruchsvoller machen, wenn Sie ihn brauchen.

Aber der Hauptpunkt ist dies - Stile an CSS Klassennamen anhängen, binden Sie dann Ihre Tests an die Klassen, nicht die Stile.

Answer 2

Sie könnten has_css? Matcher verwenden. Es kann :visible Optionen akzeptieren. Für weitere Informationen können Sie Dokumente überprüfen: http://rdoc.info/github/jnicklas/capybara/Capybara/Node/Matchers#has_css%3F-instance_method

Zum Beispiel können Sie versuchen:

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

Answer 3

Mein Weg, um dieses Element, um sicherzustellen, haben eine gewisse Klasse:

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 

oder wie dieser smthing

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

Ich habe es hier gefunden: http://rubydoc.info/github/jnicklas/capybara/Capybara/Node/Element#%5B%5D-instance_method