Navigating the display function in the protractor

I have an angular application where I have a timeline with list event dates and corresponding event description. This is the source code for Html.

  <!-- timeline -->
  <h4 class="font-thin m-t-lg m-b-lg text-primary-lt">Historical Timeline</h4>
  <p></p>
  <div id="timeline"class="timeline m-l-sm m-r-sm b-info b-l">
    <div  ng-repeat = "timeline in formattedTimelineData | orderBy : '-eventDate'">
      <div class = "tl-item">
        <i class="pull-left timeline-badge {{timeline.class}} "></i>
        <div class="m-l-lg">
          <div id="eventDate{{$index}}" class="timeline-title">{{timeline.eventDate}}</div>
          <p id="eventDescription{{$index}}" class="timeline-body">{{timeline.description}}</p>
        </div>
      </div>
    </div>
  </div>
  <!-- / timeline -->

Now I'm basically trying to use a protractor to ensure that the correct date of the event matches the description of the event. So I decided to use the map function. The problem is that I will have a variable x that tells me how many events there are. For example, there may be 2 events, 6 events, etc. Events are dynamically generated dynamically, as you can tell by viewing also the html code. Here is the code for my test that I wrote.

it('FOO TEST', function(){


    var x = 0;
    while(x<4){
   var timeline = element.all(by.css('#timeline')).map(function (timeline) {
       return {
          date: timeline.element(by.css('#eventDate'+x)).getText(),
          events: timeline.element(by.css('#eventDescription'+x)).getText()
     }

   });
      x++
  }

   timeline.then(function (Value) {
    console.log(Value);  
  });

});

, - 5 . . - . promises, . , .

+4
3

timeline: #timeline , . :

var timeline = element.all(by.repeater('timeline in formattedTimelineData')).map(function (timeline) {
    return {
        date: timeline.element(by.binding('timeline.eventDate')).getText(),
        events: timeline.element(by.binding('timeline.description')).getText()
    }
});

timeline.then(function (timeline) {
    console.log(timeline);
});

:

timeline.then(function (timeline) {
    for (var i = 0; i < timeline.length; ++i) {
        // do smth with timeline[i]
    }
});

timeline, expect , :

expect(timeline).toEqual([
    {
        date: "First date",
        events: "Nothing happened"
    },
    {
        date: "Second date",
        events: "First base"
    },
    {
        date: "Third date",
        events: "Second base"
    }, 
]);
+4

- http://googletesting.blogspot.com/2014/07/testing-on-toilet-dont-put-logic-in.html.

while .

, . 4.

element.all(by.css("#timeline")).then(function(events){
    expect(events.count).toEqual(4);
    expect(events[0].someThing()).toEqual(expectedValue0);
    expect(events[1].someThing()).toEqual(expectedValue1);
...
    expect(events[3].someThing()).toEqual(expectedValue3);
 })
0

. , . 1- 10 ? , . 10 map()

. , 10 , 1000 , , .

0

All Articles