Search code examples
angularjstestingprotractorend-to-end

How to check checkbox in repeater with protractor


I am having difficulty checking a checkbox in an AngularJs repeater with protractor.

The model looks like this:

environments: [
                {
                    name: 'Proof of Concept',
                    checked: false
                },
                {
                    name: 'Non-Production',
                    checked: false
                },
                {
                    name: 'Production',
                    checked: false
                }
            ]

The view like this:

<div class="checkbox" ng-repeat="environment in vm.assessment.environments">
  <label><input type="checkbox" ng-model="vm.assessment.environments[$index].checked" ng-click="vm.checkboxChanged()" ng-required="!vm.someChecked">{{environment.name}}</label>


</div>

Am getting the repeater in protractor like so:

this.environments = element.all(by.repeater('environment in vm.assessment.environments'));

And trying to check the checkbox like this but when i run the test it does not seem to check it:

this.environments.get(0).click();

Solution

  • And trying to check the checkbox like this but when i run the test it does not seem to check it:

    That is because you are clicking the repeater item - the div element, but need to click the input child element instead, I suspect.

    You can chain the .all() and .element() calls in a single expression:

    this.environments.first().element(by.css("input[ng-model$=checked]")).click();