Selecting second anchor element within lists using protractor

Question

I have a list of anchor tags and have to test clicking the 2nd tag in the list.

<ul id="shortcuts">
    <li><a ui-sref="app.journeyExplorer" href="#/journey-explorer/"><span class="ng-binding">1</span></a></li>
    <li><a ui-sref="app.userGroupManager" href="#/user-group-manager"><span class="ng-binding">2</span></a></li>
</ul>

After much investigation and testing reached at the conclusion that the correct statement should be:

element(By.id('shortcuts')).element(By.tagName('a')).get(1).click();

But it shows undefined. If I use get() it doesn't work. without get it clicks the 1st anchor tag in the list with a warning: 'More than one anchor tag found, in such case the 1st one is selected'

Can someone please help out with this ? Thanks.

Answer 1

You might want to try selector below (note all() instead of second element() to match all anchors (so that .get() that comes next makes any sense.

element(By.id('shortcuts')).all(By.tagName('a')).get(1).click();

or via .css

element(By.css('#shortcuts a:nth-child(1)').click();