2

関数をテストして、必要なときに jquery.dataTable が呼び出されていることを確認したいと考えています。シノンスパイを使ってこれをやりたい。

私は typescript を使用しており、実際にデータテーブルを作成する dataTableManager があります。テストフレームワークとしてqunitを使用しています

どうすればこれをスパイできますか？現在、次のエラーが発生しています

 Attempted to wrap undefined property dataTable as function

ここに私のテストがあります

    test("DataTableIsCalledWithOptionsWhenIdIsFoundOnThePage", function () {


        // arrange
        $("#qunit_fixture").append("<table id='#testTable'></table>");

        var createDateTableFunctionSpy = sinon.spy($("#testTable"), "dataTable");

        var customOptions = {
            "iDisplayLength": 200,
            "aoColumns": [
                { sWidth: '3%' },
                { sWidth: '47%' },
                { sWidth: '12%' },
                { sWidth: '17%' },
                { sWidth: '14%' },
                { sWidth: '7%' }],
            "aoColumnDefs": [
                { 'bSortable': false, 'aTargets': [0, 5] }
            ]
        };
        var dataTableManager = new DataTableManager($, "#testTable", customOptions);

        // act
        dataTableManager.createDataTable();

        // assert
        ok(createDateTableFunctionSpy.called);

    });

ここに私のコンストラクタがあります

    constructor(jQuery: JQueryStatic, tableId: string, customOptions: DataTables.Options){
        var self = this;
        self.jQuery = jQuery;
        self.options = {};
        self.jQuery.extend(self.options, DataTableManager.defaultOptions, customOptions);
        self.tableId = tableId;

    }

ここに私がテストしようとしている作成機能があります

    createDataTable = function () {
        // if it doesn't exist on the dom return
        var actualTable = this.jQuery(this.tableId);
        if (actualTable.length == 0) {
            return;
        }

        // create the data table with options
        var newDataTable = actualTable.dataTable(this.options);

    };

actualTable.dataTable(this.options); をスパイする方法についてのアイデアはありません。電話は素晴らしいでしょう、ありがとう!

4

2 に答える 2

0

間違ったオブジェクトをスパイしています-jQuery関数自体ではなく、jquery関数の結果の戻り値にスパイを設定しています。

sinon.spy( $("#testTable") )   // Returns a new object with a spy on it

これはスパイを持つオブジェクトを返しますが、コードを実行すると、この関数が再度呼び出され、スパイを持たない新しいオブジェクトが返されます。

私が見つけた最善の解決策は、$ をスタブ化し、偽のオブジェクトを返すことです。$() を呼び出すと、このオブジェクトが返され、スパイすることができます。

$_stub = sinon.stub(window, '$');

dt = { dataTable: function(){} }
$_stub.withArgs("#testTable").returns(dt); // Return fake object when $() is called

dt_spy = sinon.spy(dt, 'dateTable');

<your code>

assert(dt_spy.calledOnce);

このアプローチの問題点は、すべての $() メソッドがスタブによって隠されていることです。そのため、コードで他の jQuery メソッドを使用しようとする場合は、それらもスタブする必要があります。スパイを使用することで、これを回避できる場合があります。

于 2013-11-21T15:07:18.073 に答える