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

【问题标题】：Locating a button by className with Protractor使用量角器按类名定位按钮
【发布时间】：2015-02-23 18:19:31
【问题描述】：

如果这是一个新手问题，我很抱歉，刚开始使用网络自动化测试。

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

我用谷歌搜索了一下，我应该能够使用 element(by.css(.className)) 按类名找到一个元素，但是这不起作用，我总是得到NoSuchElementError: No element found using locator: By.cssSelector(".btn btn-lg btn-primary btn-block")。

知道我做错了什么吗？

提前谢谢你，

LoginBtn 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();


  });


});

【问题讨论】：

标签： javascript angularjs jasmine protractor

【解决方案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')

【讨论】：

【解决方案2】：

你也可以只使用一个类来查找定位器

by.css('.btn-primary')

按类名

by.className('btn-primary')

【讨论】：