Ausgabe
Ich versuche zu definieren, ob auf den Kippschalter von Angular geklickt wird oder nicht, indem ich Selenium- und Python-Tools verwende. Beim Öffnen eines neuen Formulars hat meine Eingabe-ID die Klasse ng-untouched ng-pristine ng-valid
.
Nach dem Anklicken ändert es sich in ng-valid ng-dirty ng-touched
. Aber nach einem dritten Klick ändert sich nichts. Nachdem ich darauf geklickt und das Formular gespeichert habe, bleibt die Klasse immer ng-valid ng-dirty ng-touched
und bleibt nach jeder Änderung gleich (auch nach dem Deaktivieren des Umschaltens und Speicherns). Dies ist kein Fehler, da Änderungen serverseitig gespeichert werden.
Welche CSS-Eigenschaft sollte ich mir ansehen, um zu definieren, was geändert wird? Hier ist ein HTML-Codebeispiel:
<div _ngcontent-c26="" class="form-group">
<label _ngcontent-c26="" for="checked">Checked</label>
<div _ngcontent-c26="" class="toggle-switch">
<input _ngcontent-c26="" id="opened" name="checked" type="checkbox" class="ng-valid ng-dirty ng-touched">
<label _ngcontent-c26="" for="checked"></label>
</div>
<span _ngcontent-c26="" class="form-control-helper"></span>
</div>
Lösung
Nachdem ich ein paar Optionen ausprobiert und mehr recherchiert hatte, fand ich zwei Lösungen zum Testen, wenn ein Umschalter / Kontrollkästchen aktiviert ist.
Erstens , indem Sie die Selenium-Methode von .is_selected() verwenden:
driver.find_element_by_css_selector("input[type=checkbox]").is_selected()
Es gibt True zurück, wenn ein Schalter eingeschaltet ist, und False, wenn er ausgeschaltet ist.
Zweitens habe ich mir die CSS-Einstellungen genau angesehen und festgestellt, dass, wenn ein Schalter aktiviert ist, :checked hinzugefügt wird. Sie können also einen booleschen Ausdruck für diesen Locator verwenden. In den DevTools von Chrome befindet sich dieses Attribut auf der Registerkarte Eigenschaften, der Name lautet checked
. Weitere Einzelheiten sind hier :
Der Locator für aktiviertes Umschalten sieht folgendermaßen aus:
input[type=checkbox]:checked
Für ungeprüft:
input[type=checkbox]
Außerdem gibt es eine dritte Option, die in vielen Fällen funktioniert. Ändert beispielsweise ein Toggle seine Farbe, ändert sich auch seine Eigenschaft. Sie können also verwenden:
driver.find_element_by_css_selector("input[type=checkbox]").value_of_css_property("background-color") == "some color"
Platzieren Sie beispielsweise "#fff"
(weiß), wenn Sie erwarten, dass diese CSS-Eigenschaft weiß ist.
Beantwortet von – vitaliis
Antwort geprüft von – Gilberto Lyons (FixError Admin)