I am new to the protractor framework and I have been struggling to find a way to access, using outerHTML/InnerHTML/getText(), the child elements in order to test if an <img> element is being displayed on a view. Specifically, I am working with an ng-grid and trying to locate an img element within its first column while also checking for a specific attribute, such as src=res/someImg.png.
Below is the code snippet that I am currently dealing with:
html
<div>
<a>
<div>
<div>
<span>
<i><img src="res/someImg.png"></i>
</span>
</div>
<div>
...
</div>
<div>
...
</div>
</div>
</a>
</div>
test
it('should render an icon in agent list', function () {
var row = element.all(by.repeater('row in renderedRows')).get(3);
expect(row).not.toEqual(null); //passes
expect(row.element(by.css('img')).getAttribute('src').getText()).toMatch(/someImg.png/);//fails with null
expect(row.element(by.css('span')).outerHTML).toBe('<i><img src="res/someImg.png"></i>'); //fails
expect(row.element(by.css('i')).innerHTML).toBe('<img src="res/someImg.png">'); //fails
});
If anyone could provide insight into what I might be doing incorrectly, it would be greatly appreciated.