I'm using angularJS to develop an application. To test it I use protractor.

I want to check the value in an input area. This is my input:

<input id="rank-max-range" class="form-control has-feedback" name="inputMax" type="number" placeholder="Maximum" ng-model="selectedItem.range.max" min="{{selectedItem.range.min}}" max="{{selectedItem.answers.length}}">

And this is the test:

it('should be fill the max range with the given value', function() {
  element(by.id('rank-max-range')).sendKeys(2);
  expect(element(by.id('rank-max-range')).getText()).toEqual(2);
});

The problem is it didn't work. I found on the documentation that it is possible to use getAttribute('value'). But in my case there is no value attribute on my input.

I wonder if it possible to check the content of the ng-model but I didn't find the solution.

Do you have an idea of how I could achieve this test?

I'm using angularJS to develop an application. To test it I use protractor.

I want to check the value in an input area. This is my input:

<input id="rank-max-range" class="form-control has-feedback" name="inputMax" type="number" placeholder="Maximum" ng-model="selectedItem.range.max" min="{{selectedItem.range.min}}" max="{{selectedItem.answers.length}}">

And this is the test:

it('should be fill the max range with the given value', function() {
  element(by.id('rank-max-range')).sendKeys(2);
  expect(element(by.id('rank-max-range')).getText()).toEqual(2);
});

The problem is it didn't work. I found on the documentation that it is possible to use getAttribute('value'). But in my case there is no value attribute on my input.

I wonder if it possible to check the content of the ng-model but I didn't find the solution.

Do you have an idea of how I could achieve this test?

• javascript
• angularjs
• selenium
• testing
• protractor

2 Answers 2

Normally getAttribute('value') should work. getText() won't work because input elements don't have inner text.

expect(element(by.id('rank-max-range')).getAttribute('value')).toEqual(2);

Have you tried to log the result of getAttribute('value')?

getText() would not definitely work, since this is an input and it's value would be inside the value attribute, once set. The HTML you've presented does not contain value because this is a source HTML when the page is not rendered and the value is not set. getAttribute('value') is the way to go here:

var numberInput = element(by.id('rank-max-range'));
numberInput.sendKeys("2");
expect(numberInput.getAttribute('value')).toEqual("2");

You can actually see the value being set by dumping the innerHTML on the console:

numberInput.sendKeys("2");
numberInput.getInnerHtml().then(function (html) {
    console.log(html);
});

I wonder if it possible to check the content of the ng-model but I didn't find the solution.

You can use evaluate() to see/check the value of the model:

expect(numberInput.evaluate('selectedItem.range.max')).toEqual(2);