Reputation: 3973
I had been doing trial and error to select and click the following code unsuccessfully, since I am brand new to Protractor I am probably missing something.
HTML
<table id="sample-table-1" class="table table-striped table-condensed table-hover no-bottom-margin feedback">
<thead>
<tr>
<th>
Service
</th>
<th class="text-center">
Rating
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="feedbackService in feedbackServices" class="ng-scope">
<td class="ng-binding">Feedback Service One</td>
<td>
<div rating="" score="feedbackService.rating_id" max="5" id="34" updaterating="updateScore(ratingId, id)" class="text-center ng-isolate-scope">
<div class="rating">
<a ng-repeat="star in stars" ng-mouseover="hover($index)" ng-mouseleave="stopHover()" ng-class="starColor($index)" ng-click="setRating($index)" class="ng-scope rating-normal">
<i class="fa fa-star-o" ng-class="starClass(star, $index)"></i>
</a>
<a ng-repeat="star in stars" ng-mouseover="hover($index)" ng-mouseleave="stopHover()" ng-class="starColor($index)" ng-click="setRating($index)" class="ng-scope rating-normal">
<i class="fa fa-star-o" ng-class="starClass(star, $index)"></i>
</a>
</div>
</div>
</td>
</tr>
<tr ng-repeat="feedbackService in feedbackServices" class="ng-scope">
<td class="ng-binding">Feedback Service Two</td>
<td>
<div rating="" score="feedbackService.rating_id" max="5" id="30" updaterating="updateScore(ratingId, id)" class="text-center ng-isolate-scope">
<div class="rating">
<a ng-repeat="star in stars" ng-mouseover="hover($index)" ng-mouseleave="stopHover()" ng-class="starColor($index)" ng-click="setRating($index)" class="ng-scope rating-normal">
<i class="fa fa-star-o" ng-class="starClass(star, $index)"></i>
</a>
<a ng-repeat="star in stars" ng-mouseover="hover($index)" ng-mouseleave="stopHover()" ng-class="starColor($index)" ng-click="setRating($index)" class="ng-scope rating-normal">
<i class="fa fa-star-o" ng-class="starClass(star, $index)"></i>
</a>
</div>
</div>
</td>
</tr>
</tbody>
</table>
I would like to click anything that is clickable above. TEST
it('should rate feedback services', function() {
element.all(by.repeater('feedbackService in feedbackServices')).then(function(arr) {
console.log(arr);
var rowElems = arr.findElements(by.tagName('td'));
rowElems.then(function(cols){
var stars = element.all(by.repeater('star in stars')).then(function(starArr) {
for (var i = 0; i < cols.length; ++i) {
starArr[0].click();
}
});
});
});
browser.debugger();
});
xit('feedback services', function() {
var rows = element.all(by.repeater('feedbackService in feedbackServices'));
rows.last().then(function(row) {
var rowElems = row.findElements(by.tagName('td'));
rowElems.then(function(cols){
// Not sure if this is the right approach either?
});
});
});
I was also able to setup debugger in Webstorm, but I was not able to inspect variables, there was lot of unnecessary data there.
Upvotes: 1
Views: 4332
Reputation: 1570
For the 1st test it('should rate feedback services', function() {, your script has issue from this line
var rowElems = arr.findElements(by.tagName('td'));
rowElems.then(function(cols){
you should change it to
arr.findElements(by.tagName('td')).then(function(rowElems) {
element.all(by.repeater('star in stars')).then(function(starArr)
The same for 2nd test
element.all(by.repeater('feedbackService in feedbackServices')).then(function(rows) {
I re-write your tests as below, I didnot test it
it('should rate feedback services', function() {
element.all(by.repeater('feedbackService in feedbackServices')).then(function(arrs) {
arrs.forEach(function(arr) {
arr.findElements(by.tagName('td')).then(function(rowElems) {
var cols = rowElems.length;
element.all(by.repeater('star in stars')).then(function(starArr) {
for (var i = 0; i < cols; ++i) {
starArr[0].click();
}
});
});
});
});
});
it('feedback services', function() {
element.all(by.repeater('feedbackService in feedbackServices')).then(function(rows) {
rows[rows.length-1].then(function(row) {
row.findElements(by.tagName('td')).then(function(rowElems) {
rowElems.forEach(function(rowElem) {
rowElem.getText().then(function(text){
console.log(text);
});
});
});
});
});
});
Upvotes: 2