As part of a Protractor test on my Angular app, I am trying to validate the text within the cells in the first column of an Angular Grid.
The below code validates the text of each cell of the grid:
element.all(by.css('div.ag-cell'))
.map(function (cell) {
return cell.getText();
})
.then(function (cellValues) {
expect(cellValues).toEqual(["Toyota", "Ford", "Porsche"]);
});
When ran against the below table, this code will check "Toyota", "Celica", "35000", "Ford", "Mondeo", etc. (i.e. each cell)
However, I want the test to only validate "Toyota", "Ford", & "Porsche" (i.e. the first column of this Angular Grid):
Can someone please tell me what changes I need to make for this?
Note: If aria-colindex="1"
left: 0px;"
can be used as a selector, then I think I would be able to use that.
I would use col-id
instead of aria-colindex
, and for you I would assume col-id
would be make
but I will first show you using aria-colindex
.
element.all(by.css('div.ag-cell[aria-colindex="1"]'))
.map(function (cell) {
return cell.getText();
})
.then(function (cellValues) {
expect(cellValues).toEqual(["Toyota", "Ford", "Porsche"]);
});
Using col-id
element.all(by.css('div.ag-cell[col-id="make"]'))
.map(function (cell) {
return cell.getText();
})
.then(function (cellValues) {
expect(cellValues).toEqual(["Toyota", "Ford", "Porsche"]);
});
Check out CSS attribute selectors: https://www.w3schools.com/css/css_attribute_selectors.asp