Nightwatch.js

Question

我正在使用 nightwatch.js 对应用程序进行一些端到端测试，但无法验证复选框的状态。

我正在使用 attributeEquals() 验证复选框是否已选中：

module.exports = {
  "Checkbox is checked" : function (client) {
    client
      .url(client.launch_url)
      .useCss()
      .waitForElementVisible("body", 1000)
      .verify.attributeEquals('#a_checkbox', 'checked', 'true') // quotes necessary
      .end();
  }
};

但我还需要验证复选框是否未选中。

为了做到这一点，我再次尝试使用 attributeEquals()，并有不同的期望：

module.exports = {
  "Checkbox is not checked" : function (client) {
    client
      .url(client.launch_url)
      .useCss()
      .waitForElementVisible("body", 1000)
      .verify.attributeEquals('#b_checkbox', 'checked', null)
      .verify.attributeEquals('#b_checkbox', 'checked', 'null')
      .verify.attributeEquals('#b_checkbox', 'checked', 'false')
      .verify.attributeEquals('#b_checkbox', 'checked', false)
      .verify.attributeEquals('#b_checkbox', 'checked', '')
      .end();
  }
};

但它们都失败了，并显示一条消息，指出 checked 属性不存在：

Running:  Checkbox is not checked

✔  Element <body> was visible after 68 milliseconds.
✖  Testing if attribute checked of <#b_checkbox> equals "null". Element does not have a checked attribute.  - expected "null" but got: null
✖  Testing if attribute checked of <#b_checkbox> equals "null". Element does not have a checked attribute.  - expected "null" but got: null
✖  Testing if attribute checked of <#b_checkbox> equals "false". Element does not have a checked attribute.  - expected "false" but got: null
✖  Testing if attribute checked of <#b_checkbox> equals "false". Element does not have a checked attribute.  - expected "false" but got: null
✖  Testing if attribute checked of <#b_checkbox> equals "". Element does not have a checked attribute.  - expected "" but got: null

该消息是正确的，没有 checked 属性，但是缺少该属性意味着复选框未选中，因此我希望测试通过。

如何实现？

如果这很重要，我正在使用 nightwatch v0.5.36。

Answer 1

你的测试没问题。我查看了错误，发现了一个简单的问题@ 正在测试 <#b_checkbox> 的属性检查是否等于 "null"。元素没有 checked 属性。 - 预期 "null" 但得到：null 您正在传递 .assert.attributeEquals('#b_checkbox', 'checked', null) 预期 .assert.attributeEquals('#b_checkbox', 'checked', 'null') 与 null 作为字符串 'null'

希望这是有道理的。

Answer 2

我不是Nightwatch.js方面的专家。但这看起来很有希望。

module.exports = {
  tags: ['checkbox'],

  'Demo test select a checkbox' : function (client) {
    client
      .url('your-domain.tld')
      .verify.visible('input[id="your_checkbox"]', 'Checkbox is visible')
      .click('input[id="your_checkbox"]')
      .pause(1000)
      .element('id', 'your_checkbox', function(response) {
        client.assert.ok(response.value.ELEMENT, 'Checkbox response is OK');
        client.elementIdSelected(response.value.ELEMENT, function(result){
          client.verify.ok(result.value, 'Checkbox is selected');
        });
      })
      .end();
  }
};

参考这个 Page

Answer 3

我使用 css 断言做到了这一点，例如：

module.exports = {
  "Checkbox is not checked" : function (client) {
    client
      .url(client.launch_url)
      .useCss()
      .waitForElementVisible("body", 1000)
      .verify.elementPresent('#b_checkbox')
      .verify.elementNotPresent('#b_checkbox:checked')
      .end();
  }
};

Answer 4

你可以试试：browser.expect.element('#b_checkbox').to.not.be.selected;

Answer 5

我遇到了类似的问题。我想检查复选框的状态。如果它不是 selected，我希望我的代码对它进行 select，如果它已经 selected，我希望代码对它取消 select。这就是我按照 vinoth-s 的评论和他在回答中提到的 link 解决问题的方法：

client.element('id', 'elements_css_id', (response) => {
  client.elementIdSelected(response.value.ELEMENT, (result) => {
    if(result.value == true) {
        client.click('elements_css_id');
    };
  });
});

Answer 6

没有属性可以使用elementNotPresent

而不是使用这个 .verify.attributeEquals('#b_checkbox', 'checked', 'null')

你可以用这个 .assert.elementNotPresent('#b_checkbox[checked]')

Answer 7

您可以尝试获取并测试与您的 ID 匹配且已选中的任何复选框是否可见。我将 cucumberjs 用于此任务和页面对象，因此这适用于我的项目。但我猜 nightwatch standalone 会做类似的事情。

browser.assert.visible('#b_checkbox:checked');

未检查

browser.assert.visible('#b_checkbox:not(:checked)');

Answer 8

我用过这个：

client.expect.element('@your_checkbox_input').to.not.have.attribute('checked');

如果您想检查值：

client.getAttribute('@your_checkbox_input', 'checked', result => {
    // do something
});

Answer 9

这真的很容易混淆，因为选中的元素和 not-checked 元素就像苹果和橘子。我将展示命令然后解释...

检查是否被选中...

browser.assert.attributeEquals('<element>', 'checked', 'true');

要检查是否没有检查

browser.expect.element('<element>').to.not.be.selected;

为什么这不起作用？

browser.assert.attributesEquals('<element>','checked','false')

如果运行命令失败，结果显示

 "Element does not have a checked attribute."

转到控制台并查看 html 标记并比较选中和未选中的代码。当标签被禁用时，你会得到类似...

<input ...    checked=checked />

不勾选时，勾选标签消失

<input .../>

attributeEquals 函数正在查找 "checked" 属性，当元素未选中时该属性不再存在，因此您会收到 "element does not have a checked attribute" 错误。由于此属性不再存在，您不能再使用函数 attributeEquals。

Answer 10

当我在 nightwatch.js 中遇到无法正常工作的负面测试时，我会自己否定正面测试。由于验证不会导致测试退出，如果不正确，我会使用肯定断言。

像这样：

  "Checkbox is not checked" : function (client) {
    if !(client
      .url(client.launch_url)
      .useCss()
      .waitForElementVisible("body", 1000)
      .verify.attributeEquals('#a_checkbox', 'checked', 'true');){
      browser.expect.element('body').to.not.be.present;
    }

Nightwatch.js - 如何断言一个复选框未被选中？

Nightwatch.js - How to assert a checkbox is NOT checked?

selenium

selenium-webdriver