无法使用量角器和Typescript获取数组中排序的ag-grid列的值 [英] Not able to get the values of a sorted ag-grid column in an array using Protractor and Typescript
问题描述
我必须验证ag-grid中的排序功能。
打开UI时，列数据将以某种顺序排列。
我正在按升序对其进行排序，然后将值存储在数组中。
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);
});
})
但是，当我打印数组时，这些值未排序。它们的顺序与我第一次打开UI时相同。
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.
我还单击了标题以验证UI中的排序后添加了sleep语句。
我有什么想念的吗？
预先感谢。
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.
推荐答案
因为ag-Grid按 CSS 显示的行不是通过HTML 节点位置。
Because ag-Grid display sorted rows by CSS not by HTML Node Position.
从上面的屏幕截图中，我们可以看到 Amelia Cage 是排序后的第一行，但此行的HTML节点不是表主体的第一个childNode，而是表主体的最后第二个childNode。
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.
我们还可以看到该行的 css / style 设置为 top：0px ，这意味着该行<$相对于表主体的c $ c>位置Y 相对于 0 ，这就是为什么该行显示为第一行，即使其HTML节点位置不在第一行的原因。
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.
但是 element.all（）返回元素作为其HTML节点位置的顺序，因此您的
testArr [] 获得与HTML DOM树中HTML节点位置相同的顺序，而不是页面上的显示顺序。
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.
选项1）通过属性<$ c订购 element.all（）的元素$ c>行索引，然后检查有序数组的文本是否有序。 （行索引更多，行更靠近尾部）
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)
选项2）按 top排序，然后检查有序数组的文本是否有序。 （ element.all（）的元素：yyypx yyy 越大，行距尾部越近）
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)
这篇关于无法使用量角器和Typescript获取数组中排序的ag-grid列的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
