2
<span class="selector-label">Team: </span>
<select class="selector-component" [(ngModel)]="selectedTeamId">
  <option *ngFor="#team of teams" [value]="team.id">{{team.name}}</option>
</select>

I am trying to add protractor tests for the selectedTeamId which is the first one sorted alphabetically if one user assigned to multiple teams. I think I should use [(ngModel)]="selectedTeamId", but not sure how to do it. thanks. I know how to get all teams, but I need to get the first one which is the logical implemented in selectedTeamId method.

alecxe
  • 462,703
  • 120
  • 1,088
  • 1,195
qunzi
  • 259
  • 1
  • 4
  • 10

1 Answers1

0

The idea would be to locate the select element (by the preceding label, for example), evaluate teams, sort it alphabetically by name, get the first team and check that this is the same as the selectedTeamId model value:

var select = element(by.xpath("//span[starts-with(., 'Team')]/following-sibling::select"));

select.evaluate("teams").then(function(teams) {
    teams.sort(function(a, b) {
         return a["name"].localeCompare(b["name"])
    });
    var firstTeam = teams[0];

    expect(select.evaluate("selectedTeamId")).toEqual(firstTeam);
});
Community
  • 1
  • 1
alecxe
  • 462,703
  • 120
  • 1,088
  • 1,195
  • HI, alecxe. Thanks for reply. I followed your idea and did some changes, but It did not work. I got "unknown error: angular is not defined" error. I did not use xpath to find "select" element, I used the following one instead. and I know which team will be the first team and just pass in as the expected . So the code is like the following, but it do not work, so what i missed. var select = element(by.css('team-selector select')); expect(select.evaluate("selectedTeamId")).toEqual('ExpectedFirstTeam'); – qunzi Apr 06 '16 at 20:36
  • @qunzi well, "angular is not defined" sounds like a separate problem most likely related to timing issues. Please see if these threads would help: http://stackoverflow.com/questions/28415318/angular-is-not-defined-error-while-executing-protractor-test-on-angular-applic, http://stackoverflow.com/questions/19391813/protractor-fails-to-find-angular. – alecxe Apr 07 '16 at 15:32
  • Based on Julia Ralpha air show, looks like Protractor did not support these new angualr 2 directives yet. – qunzi Sep 04 '16 at 21:31