Sinon.JS - 如何从存根中获取参数？

Question

我正在尝试使用 Sinon 来测试一个看起来有点像这样的 JS 组件...

import Bootbox from "../helpers/bootbox";
import Guard from "../helpers/guard";
import UrlHelper from "../helpers/url-helper";

export default class DeleteButton {

    /**
     * Creates an instance of DeleteButton.
     * 
     * @param {object} element The DOM element to make into a delete button.
     * 
     * @memberOf DeleteButton
     */
    constructor(element) {
        Guard.throwIf(element, "element");

        this.deleteUri = element.getAttribute("data-delete-uri") || UrlHelper.current.url().split('?')[0];        
        this.title = element.getAttribute("data-title") || `Delete the item?`;
        this.cancelText = element.getAttribute("data-cancel") || `Cancel`;
        this.confirmText = element.getAttribute("data-confirm") || `Remove`;
        this.message = element.getAttribute("data-message") || `Do you want to delete the item? This cannot be undone.`;
        this.successUri = element.getAttribute("data-success-uri");
        this.errorMessage = element.getAttribute("data-error-message") || `Unable to complete operation.`;
    }

    /**
     * Shows failure of deletion.
     * 
     * @memberOf DeleteButton
     */
    showFailed() {
        Bootbox.alert({
            message: this.errorMessage,
            size: `small`,
            backdrop: true
        });
    }
}

测试看起来像这样...

it("Can show a fail message", function() {
    $("body").append(`<a class="js-delete-button" data-id="123" data-delete-uri="/delete/123">Delete</a>`);
    let objUt = new DeleteButton($(".js-delete-button").get()[0]);
    let bootboxAlertStub = Sinon.stub(Bootbox, 'alert');
    objUt.showFailed();
    let args = bootboxAlertStub.args;
    expect(args.message).to.equal(objUt.errorMessage);
});

但是我无法通过 let bootboxAlertStub = Sinon.stub(Bootbox, 'alert'); 行，因为我从 Karma 那里收到一条错误消息 'Should wrap property of object'。我也尝试将其包装在 Sinon.test 包装器中并使用 this.stub 但错误更加迟钝。

我已经浏览了 Sinon.JS 文档并进行了在线搜索，但还是卡住了。代码运行良好。

我看过这个帖子，很相似 - Stubbing a class method with Sinon.js 但不完全相同。

查看实际的底层 bootbox JavaScript 文件，我正在有效地尝试存根一个看起来有点像这样的方法（减少）...

  exports.alert = function() {
    // do something
  };

JS 文件然后 returns 最后导出...

  return exports;

查看一些 Github 帖子，似乎无法对这些特定调用进行存根，因为底层调用是实用函数而不是对象函数。

我通过如下更改我的 Bootbox 包装器 class 来缓解这种情况（以一种可怕的方式）...

export default {

    /**
     * Generates an alert box.
     * 
     * @param {any} options
     */
    alert: function(options) {
        window.bootbox.alert(options);
    },

    /**
     * Generates a confirmation dialog.
     * 
     * @param {any} options
     */
    confirm: function(options) {
        window.bootbox.confirm(options);
    }
}

这解决了一个问题并引入了另一个问题。虽然我现在可以存根 Bootbox，但当存根时我无法获得参数....

（来自测试）

let args = bootboxAlertStub.args;

这令人沮丧 - 参数作为复杂参数传递，因此 'calledWith' 断言不会削减它。

有什么方法可以获得存根的参数吗？

Answer 1

感谢 Matt Mokary（如果你想提交答案，我会把这个归功于你）

我按如下方式编辑我的测试...

it("Can show a fail message", Sinon.test(function() {        
    $("body").append(`<a class="js-delete-button" data-id="123" data-delete-uri="/delete/123">Delete</a>`);
    let objUt = new DeleteButton($(".js-delete-button").get()[0]);
    let bootboxAlertStub = this.stub(Bootbox, 'alert');
    objUt.showFailed();
    Sinon.assert.called(bootboxAlertStub);
    let options = bootboxAlertStub.getCall(0).args[0];
    expect(options.message).to.equal(objUt.errorMessage);
}));

正如 Matt 所建议的那样，修复它的方法是使用...

bootboxAlertStub.getCall(0);

略微调整

bootboxAlertStub.getCall(0).args[0];

获取第一个参数（即选项对象）。

顺便说一句，当我运行通过 Phantom 和 Karma 进行测试时，发现我可以使用 console.log 查看发生了什么，这既是一个启示，也是一个令人震惊的时刻。

Sinon.JS - 如何从存根中获取参数？

Sinon.JS - How can I get arguments from a stub?

javascript

sinon

sinon-chai