Not able to get the values of a sorted ag-grid column in an array using Protractor and Typescript

偶尔善良 提交于 2020-01-06 06:38:07

问题


I have to verify the sorting function in an ag-grid. When the UI is opened, the column data will be in some order.
I am sorting it in ascending order and then storing the values in a array.

ag_grid_utils.clickOnHeader("Name");
var testArr=[];
element.all(by.css('div.ag-body-container div[col-id="Name"]'))
    .map(function (Element) {
        element.getText().then(function (result) {
        console.log("result :: "+result);
        testArr.push(result);
    });
})

However when I print the array, the values are not sorted. They are in the same order like when I open the UI first time.

I have also added sleep statement after clicking on the header to verify the sorting in the UI.
Is there anything I am missing? Thanks in advance.


回答1:


Because ag-Grid display sorted rows by CSS not by HTML Node Position.

From above screenshot, we can see Amelia Cage is the first row after sort, but the HTML node of this row is not the first childNode of table body, but the last 2nd childNode of table body.

Also we can see the css/style of this row set top: 0px which means this row position Y relative to table body is 0, that's why this row displayed as the first row even its HTML Node position is not first.

But element.all() return elements as order as their HTML Node position, so your testArr[] get same order as HTML Node position in HTML DOM Tree, rather than display order on page.

Option 1) order elements of element.all() by attribute row-index, then check the ordered array's text is with order or not. ( row-index more greater, row more near tail)

Option 2) order elements of element.all() by top: yyypx, then check the ordered array's text is with order or not. ( yyy more greater, row more near tail)



来源:https://stackoverflow.com/questions/48930237/not-able-to-get-the-values-of-a-sorted-ag-grid-column-in-an-array-using-protract

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!