How to validate when a checkbox is checked in AngularJS e2e tests?

Question

I've been trying out the AngularJS e2e tests and am getting stuck determining whether or not a checkbox is checked.

I used the end to end test for the checkbox input as a sample (see the End to end test tab in the Example).

Html snippet:

Value1: <input type="checkbox" ng-model="value1"> <br/>

Controller snippet:

function Ctrl($scope) {
  $scope.value1 = true;
}

Here is what I tried:

1) expect(binding('value1')).toEqual('true');

This works in the sample end to end test as long as value1 is displayed on screen with {{value1}}. If you test this locally and remove `{{value1}} the binding test fails. In most of my real-world examples I am not displaying the checkbox value on the screen anywhere.

2) expect(input('value1').val()).toEqual('true');

The value will always default to on and is not related to whether or not the checkbox is in a checked state (taken from this post).

Note: It looks like the Angular E2E testing will be replaced with Protractor in the future (see the docs)

Community · Accepted Answer · 2016-03-07 19:52:12Z

55

For anyone using Protractor, there is webdriver isSelected() for exactly this.

Instead of asking for checked attribute you can do:

expect(element(by.model('value1')).isSelected()).toBeTruthy();

edited Mar 7, 2016 at 19:52

CommunityBot

11 silver badge

answered Sep 7, 2014 at 22:27

Leo Gallucci

16.9k13 gold badges81 silver badges114 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Pradeep Over a year ago

When i try this code getting Exception : "invalid element state: Element is not currently interactable and may not be manipulated". Any idea how to solve this

Leo Gallucci Over a year ago

Back in my Protractor days, I solved the Stale element problem with the waitReady.js script, see: stackoverflow.com/questions/35533139/…

Tosh · Accepted Answer · 2012-09-18 22:09:03Z

16

I upvoted this question as I had the same issue. I used following workaround in my test, but I'm hoping to see the better way.

expect( element('input[ng-model="value1"]').attr('checked') ).toBeTruthy();

answered Sep 18, 2012 at 22:09

Tosh

36k11 gold badges67 silver badges58 bronze badges

3 Comments

Gloopy Over a year ago

Thanks! I like this better than what I'm currently doing. I'll keep this question open a bit just in case there is a better way :)

Offirmo Over a year ago

In karma, it's not attr but prop that should be used. For fellow googlers.

Elmux Over a year ago

This answer doesn't work for me. The Leo Gallucci answer works.

Gloopy · Accepted Answer · 2012-09-18 21:20:47Z

1

I'm hoping there is a better way but I got around this by validating the count of the checked input elements matching that model binding:

expect(element('input[ng-model="value1"]:checked').count()).toBe(1);

At least one downside to this when checking if something is not checked is if the element doesn't exist or if there was a typo the value would still be 0 like in this example:

expect(element('input[ng-model="valueDoesNotExist"]:checked').count()).toBe(0);

answered Sep 18, 2012 at 21:20

Gloopy

37.8k15 gold badges105 silver badges73 bronze badges

Collectives™ on Stack Overflow

How to validate when a checkbox is checked in AngularJS e2e tests?

3 Answers 3

2 Comments

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related