Wie testen Sie, ob ein div-Tag einen bestimmten CSS-Stil hat? Ich versuche zu testen, ob es display:none; oder display:block hat.Wie testen Sie, ob ein Div einen bestimmten CSS-Stil in RSPEC/Capybara hat?
habe ich versucht, die folgenden aber die mir einen Fehler geben:
it {should have_selector('signup_server_generic_errors', /display:\s*none/)}
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.
Im Allgemeinen ist dies ein guter Rat, mit mindestens einer Ausnahme: Wenn Sie versuchen zu testen, ob ein Element für den Benutzer sichtbar ist.Wenn das der Fall ist, dann ist das Testen auf das Vorhandensein einer CSS-Klasse das Falsche, da das Testen der Implementierung anstelle der Ergebnisse und der Punkt des Testens darin besteht, dass Sie die Implementierung ändern und sicherstellen können, dass Sie die gleiche Ergebnisse. Wenn Sie tatsächlich testen, ob ein Element für den Benutzer sichtbar ist, lesen Sie die Antwort von luacassus. –
@toasterlovin - die Verwendung guter CSS-Klassen kann dabei helfen, zum Beispiel ist es typisch, dass fortgeschrittene Frontend-Entwickler eine Klasse wie '.is-hidden {display: none; } 'oder ähnlich, die dann mit Javascript hinzugefügt oder beim Laden der Seite gerendert wird. Das Testen auf die Existenz dieser Klasse wäre ziemlich robust; Ich würde sagen, das Problem liegt teilweise in Front-End-schlechten Praktiken ('$ (elem) .css ('display', 'none');' zum Beispiel) –
Ich habe versucht, den Unterschied zwischen dem Testen der Implementierung zu bekommen (does das Element hat eine Klasse, die es versteckt macht) und testet die eigentliche Sache, die dir wichtig ist (ist das Element versteckt). IMO, dies ist ein kritischer Aspekt beim Schreiben nützlicher Tests. Das Testen der eigentlichen Sache bedeutet, dass Sie alles und jeden, wie Sie zu dem Ergebnis kommen, umgestalten können und Ihr Test wird Sie wissen lassen, wenn Sie richtig refaktoriert haben. Wenn Sie andererseits die Implementierung testen, wird der Test nutzlos, sobald Sie die Implementierung ändern. –
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) }
Seien Sie vorsichtig mit ': visible => true' - das Ergebnis ist möglicherweise nicht korrekt: [http://rubydoc.info/github/jnicklas/capybara/master/Capybara/Node/Element#visible%3F-instance_method] (http://rubydoc.info/github/jnicklas/capybara/master/Capybara/Node/Element#visible%3F-instance_method) – bershika
Ich möchte nur darauf hinweisen, dass die Verwendung der Option ': visible' überraschend ist, wenn' true' verwendet wird 'oder' false'. Ich habe festgestellt, dass 'visible:: visible' oder' visible:: hidden' klarer ist. [Details] (https://github.com/jnicklas/capybara/commit/83742b008f0719082beb8f6703bc70ba956815fc#diff-da1771677e47ff6a7a70b8119e14102dR58) und [Diskussionen über diese Symboloptionen] (https://github.com/jnicklas/capybara/issues/944) – EricC
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
Was ist der Fehler? –