Menu
I'm using nightwatch.js to do some end-to-end testing of an application, but having trouble verifying the state of checkboxes.
I'm using attributeEquals() to verify that a checkbox is checked:
module.exports = {
"Checkbox is checked" : function (client) {
client
.url(client.launch_url)
.useCss()
.waitForElementVisible("body", 1000)
.verify.attributeEquals('#a_checkbox', 'checked', 'true') // quotes necessary
.end();
}
};
But I also need to verify that checkboxes are not checked.
To do that I've tried using attributeEquals() again, with various expectations:
module.exports = {
"Checkbox is not checked" : function (client) {
client
.url(client.launch_url)
.useCss()
.waitForElementVisible("body", 1000)
.verify.attributeEquals('#b_checkbox', 'checked', null)
.verify.attributeEquals('#b_checkbox', 'checked', 'null')
.verify.attributeEquals('#b_checkbox', 'checked', 'false')
.verify.attributeEquals('#b_checkbox', 'checked', false)
.verify.attributeEquals('#b_checkbox', 'checked', '')
.end();
}
};
But they all fail with a message stating that the checked attribute does not exist:
Running: Checkbox is not checked
✔ Element <body> was visible after 68 milliseconds.
✖ Testing if attribute checked of <#b_checkbox> equals "null". Element does not have a checked attribute. - expected "null" but got: null
✖ Testing if attribute checked of <#b_checkbox> equals "null". Element does not have a checked attribute. - expected "null" but got: null
✖ Testing if attribute checked of <#b_checkbox> equals "false". Element does not have a checked attribute. - expected "false" but got: null
✖ Testing if attribute checked of <#b_checkbox> equals "false". Element does not have a checked attribute. - expected "false" but got: null
✖ Testing if attribute checked of <#b_checkbox> equals "". Element does not have a checked attribute. - expected "" but got: null
That message is correct, there is no checked attribute, but the absence of the attribute means the checkbox is not checked, and therefore I want the test to pass.
How can this be achieved?
I'm using nightwatch v0.5.36 if that's significant.
431
You can try: browser.expect.element('#b_checkbox').to.not.be.selected;
54
I did this using the css assertations eg:
module.exports = {
"Checkbox is not checked" : function (client) {
client
.url(client.launch_url)
.useCss()
.waitForElementVisible("body", 1000)
.verify.elementPresent('#b_checkbox')
.verify.elementNotPresent('#b_checkbox:checked')
.end();
}
};
I am no expert in Nightwatch.js. But this looks promising.
module.exports = {
tags: ['checkbox'],
'Demo test select a checkbox' : function (client) {
client
.url('your-domain.tld')
.verify.visible('input[id="your_checkbox"]', 'Checkbox is visible')
.click('input[id="your_checkbox"]')
.pause(1000)
.element('id', 'your_checkbox', function(response) {
client.assert.ok(response.value.ELEMENT, 'Checkbox response is OK');
client.elementIdSelected(response.value.ELEMENT, function(result){
client.verify.ok(result.value, 'Checkbox is selected');
});
})
.end();
}
};
Refer to this Page
36
I had a similar problem. I wanted to check status of a checkbox. If it was not selected, I wanted my code to select it and if it was already selected, I wanted the code to un-select it. This is how I solved it by following vinoth-s comment and the link he mentioned in his answer:
client.element('id', 'elements_css_id', (response) => {
client.elementIdSelected(response.value.ELEMENT, (result) => {
if(result.value == true) {
client.click('elements_css_id');
};
});
});
You could try fetching and testing if visible any checkbox that matches your id and is also checked. Im using cucumberjs for this task and page objects so this would work on my project. But i guess nightwatch standalone would do something similar.
browser.assert.visible('#b_checkbox:checked');
and not checked
browser.assert.visible('#b_checkbox:not(:checked)');
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
