如何在Nightwatch中测试伪元素的css属性

我想使用 Nightwatch 测试我的网站上的背景图像是否正确，但它设置为 ::before 伪元素的背景，这是 CSS

.icon-circle-delete:before {
    content: '';
    background: url(images/svg/delete.svg) no-repeat 50% 50%;
    display: inline-block;
    width: 16px;
    height: 16px;

我尝试过以下方法：

.assert.cssProperty("i.icon-circle-delete", "background", "url(clientlib-site/images/svg/delete.svg) ");

.assert.cssProperty("i.icon-circle-delete:before", "background", "url(images/svg/delete.svg) ");

.assert.cssProperty("i.icon-circle-delete::before", "background", "url(images/svg/delete.svg) ");

.assert.cssProperty("i.icon-circle-delete", "before:background", "url(images/svg/delete.svg) ");

尝试不以某种方式添加“之前”会失败，说明背景不包含 URL，因为<i>有自己的风格。尝试在 CSS 选择器中包含“before”会返回找不到该元素

当使用 ::before 和 ::after 伪元素时，有没有办法测试 CSS 属性？

我知道这已经很旧了，但我很难弄清楚/找到答案，所以我想我会发帖希望能帮助一些丢失的鞋底。

下面的答案是你如何做到这一点，你必须先获取 JavaScript 中的值，然后测试它的值。

browser.execute(function (title) {
    return window.getComputedStyle(document.querySelector('.callout .callout-title'), ':before').getPropertyValue('content')
}, function (result) {
  browser.assert.equal(result.value, '"Value of content: pseudo"')
})

所以在你的情况下：

browser.execute(function (bg) {
    return window.getComputedStyle(document.querySelector('.icon-circle-delete'), ':before').getPropertyValue('background')
}, function (result) {
  browser.assert.equal(result.value, 'url(images/svg/delete.svg)')
})