使用量角器测试AngularJS应用-如何在不使用ID的情况下获取HTML元素？

我最近受命为我公司开发的AngularJS应用程序实施一些自动化测试。在对可用的不同测试框架进行了一些研究之后，我决定使用Protractor，因为它似乎提供了我们将需要的所有功能，并且似乎已被很好地记录和维护。

当我开始设计和编写测试时，我注意到代码中的大多数HTML元素都没有提供ID属性-因此我开始将ID属性分配给将在测试中使用的各种元素，以便我可以访问它们使用诸如element(by.id('abc'));将它们分配给变量以供在测试脚本中使用的函数。

但是，我刚刚得知，不给HTML元素ID属性是一种故意的设计选择，目的是使源代码更易于压缩以分发给我们的客户。因此，这意味着我现在需要重新编写测试，以使它们不再使用ID属性来获取元素，但是我不确定如何执行此操作...

当我在浏览器中检查那些菜单项时，它显示以下HTML结构：

<ul id="nav" class="nav" data-slim-scroll ... >
    <li data-ng-mouseenter="setMenuTop($event)" ...
        <a href="#/pages" id="pagesMenuBtn" ... >
            ...
        <a href="#/alarms" id="alarmsMenuBtn" ... >
            ...
        ...
    </li>
    ...
</ul>

目的是能够id从上面的标记中删除属性，但仍然能够访问这些HTML元素以对其进行测试。

例如，我以前有过：

describe('myApp', function() {
    var alarmsMenuBtn = element(by.id('alarmsMenuBtn'));
    var chartsMenuBtn = element(by.id('chartsMenuBtn'));
    ...
    it('should navigate to the Charts page', function(){
        browser.waitForAngularEnabled(false);
        browser.actions().mouseMove(chartsMenuBtn).perform();
        chartsMenuBtn.click();
        browser.waitForAngularEnabled(true);
        browser.call(closeDlg).then(function(){
            expect(browser.getCurrentUrl()).toBe('chartsURL');
    });

我现在有：

describe('myApp', function() {
    var menuItems = $(".slimScrollDiv").$(".nav").$$("li");
    var alarmsMenuBtn = menuItems.get(1).$("a");
    var chartsMenuBtn = menuItems.get(2).$("a");

但是，当我使用相同的测试运行此测试时，我的测试现在失败，并显示以下消息：

失败：1）应用程序应导航到“警报”页面消息：错误：超时-jasmine.DEFAULT_TIMEOUT_INTERVAL指定的超时内未调用异步回调。堆栈：错误：超时-未在jasmine.DEFAULT_TIMEOUT_INTERVAL指定的超时内调用异步回调。在onTimeout（timers.js：386：11）在tryOnTimeout（timers.js：250：5）在Timer.listOnTimeout（timers.js：214：5）消息：失败：元素不可见（会话信息：chrome = 61.0。 3163.100）（驱动程序信息：chromedriver = 2.33.506120（e3e53437346286c0bc2d2dc9aa4915ba81d9023f），platform = Windows NT 10.0.15063 x86_64）堆栈：...

和：

2）应用程序应导航到``图表''页面消息：失败：元素不可见（会话信息：chrome = 61.0.3163.100）（驱动程序信息：chromedriver = 2.33.506120（e3e53437346286c0bc2d2dc9aa4915ba81d9023f），platform = Windows NT 10.0.15063 x86_64）

这些元素的HTML是：

<li><a href="#/alarms" id="alarmsMenuBtn" target="_self"><i class="ti-alert"></i><span data-i18n="Alarms"></span></a></li>
<li><a href="#/charts" id="chartsMenuBtn" target="_self"><i class="ti-bar-chart"></i><span data-i18n="Charts"></span></a></li>

所以我的问题是，我如何使用ID属性以外的方式访问这些（或任何其他）HTML元素以获取它们？