Nightwatch.js klickt auf verschachtelte Anker, wenn auf einen Klick auf Checkbox Etikett sagte

Question

ich eine Checkbox haben, mit einem Text einen Link einschließlich wie folgt:

<div id="agreementDiv" class="cust-pad-bot1"> 
 
    <input id="inputAgreement" type="checkbox"> 
 
    <label for="inputAgreement">I have read and agree to the <a target="_blank" href="http://example.com/terms-and-conditions"><u>Terms &amp; Conditions</u></a></label> 
 
</div>

(Bitte beachten Sie, dass dieser Code-Schnipsel ist nur eine Skizze der tatsächlichen Implementierung. CSS-Klassen werden entfernt.)

Verwenden von Nightwatch.js Ich möchte das Kontrollkästchen automatisch aktivieren. In meiner Benutzeroberfläche wird durch Klicken auf den Beschriftungstext das Kontrollkästchen aktiviert.

browser 
.useXpath() 
.waitForElementPresent(`//*[@id="agreementDiv"]/label`, 10000) 
.click(`//*[@id="agreementDiv"]/label`) 

Aber wenn ich versuche, es zu tun Nachtschwärmer verwenden, klickt auf den Link und den Link in einem neuen Tab geöffnet wird. Aber das Kontrollkästchen wurde nicht angeklickt. Ein Klick auf das Kontrollkästchen mit css/xpath funktioniert auch nicht. Ich schätze es, wenn jemand erklären kann, wie man verhindern kann, dass Nightwatch auf den Kinderanker klickt.

Vielen Dank.

Answer 1

Ich habe eine Lösung gefunden mit Nightwatch-custom-commands-assertions Drittanbieter-Modul (https://github.com/maxgalbu/nightwatch-custom-commands-assertions). Dieses Modul fügt eine Reihe von benutzerdefinierten Nachtwächterbefehlen hinzu und unter diesen gab es jqueryClick Funktion (https://github.com/maxgalbu/nightwatch-custom-commands-assertions). Ich habe diese Funktion aufgerufen, die den XPath der Checkbox lieferte und es hat gut funktioniert. Die Verwendung der Standardfunktion click funktionierte für mich nicht auf der Checkbox.

Answer 2

Sie haben den Code geschrieben, um auf das Label und nicht auf das Kontrollkästchen zu klicken. Ändern Sie den X-Pfad. Verwenden Sie jedoch die Methode browser.useXpath();, bevor Sie den xpath-Selektor verwenden.

browser 
.waitForElementPresent(`//*[@id="agreementDiv"]/input`, 10000) 
.click(`//*[@id="agreementDiv"]/input`) 

von CSS-Selektor (Standard-Selektor in Nachtwache) mit:

browser 
.waitForElementPresent(`#agreementDiv>input`, 10000) 
.click(`#agreementDiv>input`) 

Dies Ihr Problem lösen soll. Wenn Sie auf das Kontrollkästchen klicken, wird das Kontrollkästchen ausgewählt.