Protractor - Element is not clickable at point (x,y) when using ng-change

Question

<select id="cbCategory" ui-select2 name="cbCategory" ng-model="categoryCombo.category" 
        class="show-tick form-control comboBlue" ng-change="loadPrice()" required>
    <option ng-repeat="category in Categories" value="{{category}}" 
            {{category.Name}}</option>
</select>

When I have select like this, without the ng-change, it works in this both solutions:

1. element.all(by.repeater('category in Categories').row(0)).click();

2. element(by.id("cbCategory")).sendKeys('Category1');

But when I have ng-change in my select, both solutions are not working.

Answer 1

Click the select before clicking an option, e.g.:

var selectElement = element(by.id("cbCategory"));
selectElement.click();

var option = selectElement.all(by.tagName("option")).first();
option.click();

---

You may also want to make working with select->option easier by making an abstraction, see:

• Select -> option abstraction