代码之家 › 专栏 › 技术社区 › alecxe

定制茉莉花束和承诺

protractor promise jasmine testing javascript

alecxe · 技术社区 · 8 年前

故事:

我们一直在使用定制的茉莉花束 具有手/指针光标的元素 :

beforeEach(function() {
    jasmine.addMatchers({
        toHaveHandCursor: function() {
            return {
                compare: function(actual) {
                    return {
                        pass: actual.getCssValue("cursor").then(function(cursor) {
                            return cursor === "pointer";
                        })
                    };
                }
            };
        },
    });
});

它非常有效,并使测试可读:

expect(queuePage.sortByButton).toHaveHandCursor();

问题是:

当预期失败时,目前我们在控制台上得到一个完全不可读的大红色文本块,格式如下:

需要ElementFinder({ptor_:Protractor({getProcessedConfig:Function,forkNewDriverInstance:Functional,restart:Functions, controlFlow:函数,schedule:函数,setFileDetector:函数, getSession:函数,getCapabilities:函数,退出:函数, 操作:函数,触摸操作:函数、执行脚本:函数, getTitle:函数,findElementInternal_:函数, findElementsInternal_…滚动10分钟…,单击: 函数,sendKeys:Function,getTagName:函数,getCssValue: 函数,getAttribute:函数,getText:函数,getSize: 函数,getLocation:函数,isEnabled:Function,isSelected: 函数,提交:函数,清除:函数,isDisplayed:函数, getOuterHtml:Function,getInnerHtml:函数,getId:函数, getRawId:函数,序列化:函数,takeScreenshot:函数}) 有手动光标。

问题:

我们如何改进匹配器并输出用户友好的错误? 类似于:

Expected 'auto' to be equal to 'pointer' cursor value.

据我所知,我们需要提供 message 值,但我不完全确定如何传递实际元素的 cursor CSS值添加到消息中。到目前为止,我有以下情况:

toHaveHandCursor: function() {
    return {
        compare: function(actual) {
            return actual.getCssValue("cursor").then(function(cursor) {
                return {
                    pass: cursor === "pointer",
                    message: "Expected '" + cursor + "' to be equal to 'pointer' cursor value."
                };
            });
        }
    };
},

我希望这能奏效,但由于某些原因,我在测试运行后在控制台上看到了相同的错误消息。

2 回复 | 直到 8 年前

alecxe 8 年前

我们在控制台上看到的是 自动生成的jasmine matcher失败消息 其中包括 ElementFinder 实例字符串表示&由于某些原因,它看起来非常庞大。

现在,为了改进失败的消息,我们需要使用 message 与一起键入 pass 我们应该考虑到这一点 getCssValue() 返回一个承诺 需要解决实际问题 cursor 要在自定义错误消息中使用的值:

toHaveHandCursor: function() {
    return {
        compare: function(actual) {
            var result = {};

            result.pass = actual.getCssValue("cursor").then(function(cursor) {
                result.message = "Expected '" + cursor + "' to be equal to 'pointer' cursor value.";
                return cursor === "pointer";
            });

            return result;
        }
    };
},

现在,如果预期失败,我们会收到一条很好的错误消息:

- Expected 'auto' to be equal to 'pointer' cursor value.

TimoStaudinger 8 年前

您是正确的,要设置自定义消息,您应该设置 message 返回对象的属性。

消息只是一个常规字符串。您可以使用 cursor 变量,如果您在履行承诺后将结果对象放在一起。

请参见以下示例:

beforeEach(function(){
  jasmine.addMatchers({
    toBeDeactivated: function() {
      return {
        compare: function(account){
          var accountStatusCode = account.get('status').statusCode;
          var result = { pass: accountStatusCode === 5 };
          if(result.pass) {
            result.message =  "Expected account with status code '" + accountStatusCode + " NOT to be deactivated.";
          } else {
            result.message =  "Expected account with status code '" + accountStatusCode + "' to be deactivated.";
          }
          return result;
        }
      }
    }
  }
});

Source

更换 account.get() 承诺应该很简单。