使用Protractor按className查找按钮

Question

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

我想要测试一个登录页面。找到名称和密码文本框很容易（只是使用by.model），但我在我的脚本中遇到了查找登录按钮的问题。

我搜索了一下，应该可以通过使用element(by.css(.className)) 按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();


  });


});

- r3x

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')

- alecxe

Answer 2

你也可以只使用一个类来查找定位器 by.css('.btn-primary') 按类名查找 by.className('btn-primary')

- Adnan Ghaffar