Flip a protractor flag?
Html code
<div class="check-box-panel">
<!--
ngRepeat: employee in employees
-->
<div class="ng-scope" ng-repeat="employee in employees">
<div class="action-checkbox ng-binding">
<input id="John" type="checkbox" ng-click="toggleSelection(employee.name)"
ng-checked="selection.indexOf(employee.name) > -1" value="John"></input>
<label for="John">
::before
</label>
<!--
John
end ngRepeat: employee in employees
-->
<div class="ng-scope" ng-repeat="employee in employees">
<div class="action-checkbox ng-binding">
<input id="Jessie" type="checkbox" ng-click="toggleSelection(employee.name)"
ng-checked="selection.indexOf(employee.name) > -1" value="Jessie"></input>
<label for="Jessie"></label>
I have tried using jQuery
element(by.repeater('employee in employees')).element(by.id('Jessie')).click();
i tried using css
element(by.repeater('employee in employees')).$('[value="Jessie"]').click();
But it didn't work. Any other way that I can click on a specific checkbox?
source to share
Ok, I had a very similar problem where I couldn't click this checkbox. It turned out that I needed to click the checkbox label. However, if you want to do any checks if the checkbox is checked, you need to check the actual checkbox. I ended up creating two variables, one for the label and one for the actual checkbox.
JessieChkbxLabel = element(by.css("label[for='Jessie']"));
JohnChkbxLabel = element(by.css("label[for='John']"));
//Click the Jessie checkbox
JessieChkbxLabel.click();
//Click the John checkbox
JohnChkbxLabel.click();
source to share
You just need to use the element (by.id ('Jessie')) to grab your object. You might have a problem: Clicking () returns a promise, so you need to handle that with .then. So something like:
element(by.id('Jessie')).click().then(function(value) {
// fulfillment
}, function(reason) {
// rejection
});
source to share
Apart from checking id
directly, you can also check the filter
required element by checking the employee name:
var employee = element.all(by.repeater('employee in employees')).filter(function (elm) {
return elm.evaluate("employee.name").then(function (name) {
return name === "Jessie";
});
}).first();
employee.element(by.css("input[type=checkbox]")).click();
source to share