如何使用 Webdriver.io 和 Chai 作为 Promised 来验证 css 属性

Question

目前在 Mocha、Chai 和 Chai-as-Promised 中使用 Webdriver.io，但是在尝试验证 CSS 属性时，我很难获得验证的承诺：

代码：

'use strict';
var chai = require('chai'),
    chaiAsPromised = require('chai-as-promised');

chai.use(chaiAsPromised);
chai.should();
chaiAsPromised.transferPromiseness = browser.transferPromiseness;

describe('Buttons', function() {

    var buttonSelector = '.button';

    browser.url('http://localhost/buttons.html');

    it('should have square corners by default', function (done) {
        browser
            .getCssProperty(buttonSelector, 'border-top-left-radius').should.eventually.become('0px')
            .call(done);
    });
});

但是我收到此错误：

默认按钮：小尺寸 1) 默认情况下应该有方角 1 失败

1) 默认按钮：Tiny Size 默认应该有方角： 未捕获的 AssertionError：预期 { Object (property, value, ...) } 深度等于 '0px' 0 在 assertEqual 处通过 (2s) (/node_modules/chai/lib/chai/core/assertions.js:393:19)

  at ctx.(anonymous function) (/node_modules/chai/lib/chai/utils/addMethod.js:40:25)
  at WebdriverIO.<anonymous> (/node_modules/chai-as-promised/lib/chai-as-promised.js:302:26)

  at /node_modules/webdriverio/lib/utils/PromiseHandler.js:85:52
  at process._tickCallback (node.js:419:13)

Answer 1

getCSSProperty 返回一个类似的对象

{
    property: 'width',
    value: '100px',
    parsed: {
        type: 'number',
        string: '100px',
        unit: 'px',
        value: 100
    }
}

您的错误消息说0px 不等于实际为真的对象。在这种情况下，最好使用回调。或许可以使用“Chai Things”插件。

Answer 2

根据documentation，它没有返回一个promise？

看起来你应该使用回调。

编辑：好的，我可能误解了文档，而是可能是 promise 中输出的值不是您所期望的。如果您查看文档，您可以看到回调产生的内容。所以我们可以期望它与promise相同。然后，你可以使用这样的东西：

browser.getCssProperty(buttonSelector, 'border-top-left-radius').should.eventually.have.property('value', '0px').call(done);