簡體   English   中英

Sinon.JS - 如何從存根中獲取參數?

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

我正在嘗試使用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那里得到一個錯誤,說'應該包裝對象的屬性'。 我已經嘗試將它包裝在Sinon.test包裝中並使用this.stub,但錯誤更加遲鈍。

我已經通過Sinon.JS文檔並在線搜索但我被卡住了。 代碼工作正常。

我看過這個帖子,它是類似的 - 用Sinon.js創建一個類方法,但它並不完全相同。

看看實際的底層bootbox JavaScript文件,我實際上是在試圖找到一個看起來有點像這樣的方法(減少)......

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

然后JS文件最后返回導出...

  return exports;

看一些Github帖子似乎可能無法存根這些特定的調用,因為底層調用是實用函數而不是對象函數。

我通過更改我的Bootbox包裝類來緩解這種情況(以一種可怕的方式),如下所示......

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'斷言不會削減它。

有什么方法可以得到存根的參數嗎?

感謝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);
}));

正如馬特建議的那樣,解決它的問題是......

bootboxAlertStub.getCall(0);

稍作調整

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

獲取第一個參數(這是選項對象)。

順便說一句,發現我可以使用console.log查看當我通過Phantom和Karma進行測試時發生的事情既是一個啟示,也是一個令人頭疼的時刻。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM