How can I test angular-ui-selectize with Protractor?

I want to test a simple user creation form containing multiple dropdown controls (each is angular-ui-select)

I haven't found any document on how to select one of the elements.

this is my html:

<ui-select ng-model="user.assignedGroup" theme="selectize" class="dropdown">
                            <ui-select-match placeholder="{{::strings('userDetails.assignToGroupPlaceHolder')}}">{{$select.selected.name}}</ui-select-match>
                            <ui-select-choices repeat="group.name as group in groups">
                                <span ng-bind-html="group.name | highlight: $select.search"></span>
                            </ui-select-choices>
                        </ui-select>

      

I was able to open the dropdown:

item (by.model ('user.assignedGroup')) click () ;.

What's next??

EDIT

The current solution I have found is to use enter and search for a specific item and "press" the enter key, but that is not how I want to test this control. I have a dropdown control which is also not searchable.

var selectGroupButton = element(by.model('user.assignedGroup'));
        var selectInput = selectGroupButton.element(by.css('.ui-select-search'));

        // click to open select
        selectGroupButton.click().then(function(){
            // type some text
            selectInput.sendKeys('group1\n');
        });

      

+3


source to share


1 answer


You can access the children using different css selectors like:

$('.dropdown ui-select-match:first-child');

      



And then you can achieve the desired behavior.

I would recommend you take a look here: http://www.w3schools.com/cssref/css_selectors.asp

-2


source







All Articles