Protracter filter called many times

Question

I have a grid of flight information with some rows, which contains properties like flight number. Now, I want to filter the row based on a target flight number flightno . Here, the value of flightno is 15984234. The codes are shown below

 let trTarget = element.all(by.css('[kendogridlogicalrow]')).filter(tr => { return tr.all(by.css("[data-kendo-grid-column-index='1']")).getText().then(cellstxt => { console.log(cellstxt + '++++') console.log('1') if (cellstxt.includes(FlightNo)) { console.log(cellstxt + '----') console.log('2') return true; } else { return false; } }); }).first() trTarget.getText().then(cellstxt => { console.log(cellstxt + '&&&&') console.log('3') })

These codes are wrapped as a function locateTrWithId , which returns trTarget.

In the place which call the function, codes are shown below

 let trTarget = this.locateTrWithId(flightno); var ele = trTarget.all(by.tagName('a')).first() browser.wait(EC.elementToBeClickable(ele), 10000) ele.getText().then(txt => { console.log(txt + '*****') console.log('4') }) ele.close()

The function locateTrWithId works normally, but when I try to print some details, I found something interesting, see the console.log results

 15983767++++ 1 15984065++++ 1 15984234++++ 1 15984234---- 2 p&&&& 3 15983767++++ 1 15984065++++ 1 15984234++++ 1 15984234---- 2 15983767++++ 1 15984065++++ 1 15984234++++ 1 15984234---- 2 15983767++++ 1 15984065++++ 1 15984234++++ 1 15984234---- 2 15983767++++ 1 15984065++++ 1 15984234++++ 1 15984234---- 2 15984234***** 4 15983767++++ 1 15984065++++ 1 15984234++++ 1 15984234---- 2

As shown in the screenshot, the part of filter is called five times, one of which is executed with the part of get text from the filtered trTarget (print 3), others are executed independently

Another thing is after calling and executing the function locateTrWithId , and get text of return trTarget (print 4), the filter is executed again!

Here are parts of the corresponding HTML codes

 <tr kendogridlogicalrow="" data-kendo-grid-item-index="0" role="row" class="ng-star-inserted">...</tr> <tr kendogridlogicalrow="" data-kendo-grid-item-index="1" role="row" class="ng-star-inserted">...</tr> <tr kendogridlogicalrow="" data-kendo-grid-item-index="2" role="row" class="ng-star-inserted"> <td kendogridcell="" kendogridlogicalcell="" role="gridcell" aria-selected="false" data-kendo-grid-column-index="0" colspan="1" aria-colindex="1" class="ng-star-inserted">...</td> <td kendogridcell="" kendogridlogicalcell="" role="gridcell" aria-selected="false" data-kendo-grid-column-index="1" colspan="1" aria-colindex="2" class="ng-star-inserted"><a href="#/admin/manifest-detail/30707" class="ng-star-inserted"> 15984234</a> </td> </tr>

Please explain this. Many thanks!

Answer 1

I had a solution to avoid calling filter so many times

 private locateTrWithId(GridIndex: number, FlightNo: string) { let tbTarget = this.opr.locateTb(GridIndex); var tdswithhyperlink = tbTarget.all(by.tagName('a')) tdswithhyperlink.each(td => { browser.wait(EC.elementToBeClickable(td), 10000) }) return tbTarget.all(by.css('[kendogridlogicalrow]')).filter(tr => { tr.element(by.css("[data-kendo-grid-column-index='1']")).getText().then(txt => { console.log(txt + '++++') console.log('1') }) return tr.all(by.css("[data-kendo-grid-column-index='1']")).getText().then(cellstxt => { if (cellstxt.includes(FlightNo)) { console.log(cellstxt + '++++') console.log('2') return true; } else { return false; } }); }).first().element(by.tagName('a')).click() }

Here, I integrate the click action to the filter action (so I remove the parts of get Text of returned/filtered trTarget). The execution result is

 15983767++++ 1 15984065++++ 1 15984234++++ 1 15984234++++ 2

But I cannot explain the reason....