javascript - 使用 Protractor 按类名定位按钮

Question

如果这是一个刚开始进行网络自动化测试的新手问题，我深表歉意。

我想测试登录屏幕页面。查找名称和密码文本字段很容易(仅使用 by.model)，但是我在使用脚本定位登录按钮时遇到了问题。

我四处搜索，我应该能够使用 element(by.css(.className)) 通过 className 找到一个元素，但是这不起作用，我总是得到 NoSuchElementError : 使用定位器未找到元素:By.cssSelector(".btn btn-lg btn-primary btn-block")。

知道我做错了什么吗？

提前致谢

登录按钮 HTML:

<button class="btn btn-lg btn-primary btn-block" type="submit" ng-disabled="loading">login</button>

我的代码:

describe('Test login', function() {
  var username = element(by.model('formData.email'));
  var password = element(by.model('formData.password'));
  var loginBtn = element(by.css('.btn btn-lg btn-primary btn-block'));


  beforeEach(function() {
    browser.get('some site'); //hidden on purpose
  });

  it('should have a title', function() {
        username.sendKeys(1);
        password.sendKeys(2);
        loginBtn.click();


  });


});

Answer 1

如果您要检查多个类，请用点分隔它们:

by.css('.btn.btn-lg.btn-primary.btn-block')

不过，我会通过文本找到按钮 - 看起来更可靠和可读:

by.xpath('//button[. = "login"]')

---

此外，考虑为按钮分配一个 id(如果它在您的控制之下)属性以简化测试过程:

<button id="submitButton" class="btn btn-lg btn-primary btn-block" type="submit" ng-disabled="loading">login</button>

那么，就很简单了:

by.id('submitButton')