使用量角器按类名定位按钮

Question

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

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

我四处搜索，我应该能够使用 element(by.css(.className)) 按类名找到一个元素，但是这不起作用，我我总是得到 NoSuchElementError: No element found using locator: 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')

Answer 2

您也可以仅使用一个 class 来查找定位器

by.css('.btn-primary')

按class 姓名

by.className('btn-primary')

使用量角器按类名定位按钮

Locating a button by className with Protractor

javascript

jasmine

angularjs

protractor