如何測試Knockout.js點擊茉莉

我一起具有與茉莉測試問題淘汰賽模板結合：如何測試Knockout.js點擊茉莉

的HTML是與此類似：

<body> 
<my-widget params="value: $data></my-widget> 
</body>

的部件有一個點擊綁定：

<div class="my-widget"> 
    <a id="#clickme" data-bind="click: doSomething">Click me</a> 
</div>

窗口小部件的JavaScript是這樣的：

ko.components.register('my-widget', { 
    viewModel : function(params) { 
     this.doSomething = function() { 
       // doing something 
     }; 
    }, 
    template: { 
     require: 'text!../../templates/my-widget.html' 
    } 
});

所有這些在生產中都很完美，但在Jasmine/Jquery中，觸發$（'＃clickme'）的點擊不會執行doSomething。

以下是我的茉莉花測試的摘錄（它被大大簡化，但應包含要領）：

beforeEach(function (done) { 
    require(['specHelpers', 'knockout'], 
     function (specHelpers, knockout) { 
     specHelpers.loadFixtureIntoPage("page.html", "myPage"); // template and id to use 
     expect($('#myPage')).toExist(); 
     done(); 
    }); 
}); 


it("WILL NOT TRIGGER MY CLICK", function (done) { 
    ko.applyBindings(myPage.pageViewModel, $('#myPage'))[0]); 

    setTimeout(function() { 
     $('#clickme').click(); 

     // doSomething is not called :(

     done(); 
    }, 300); 
});

當console.logging的#clickme元素我可以看到它是存在的。

看來小部件中的點擊綁定沒有得到正確應用。但是，當我在bdd中運行測試並且結束並失敗時 - 我可以手動單擊此元素並確定調用了某些東西。

我在做什麼錯？正如我所說的，運行實際的應用程序是完美的。這似乎是茉莉花不能正確處理點擊綁定 - 我沒有這個問題與文檔中設置的常規點擊事件。已準備好

來源

2016-05-12 Stephanie Peters

我試圖重現你的問題，但不能.. https://jsfiddle.net/9qb1936v/我錯過了什麼？ – user3297291

當整個事情在jasmine規範中運行時，出現問題，其中包含我的挖空小部件的固定裝置（即HTML）被動態加載 –

你真的不應該測試像這樣的按鈕點擊 - 你可以如果您直接調用函數doSomething（），則更加確定。同樣的方式，你不會自己測試任何JQuery的內部。

如果你真的想測試在一個固定的活動，你有沒有嘗試過

$("#clickme").trigger('click');

此外，仔細檢查固定裝置插入到DOM時調試測試中（通過瀏覽器說）

來源

2016-05-12 12:07:21 kasperoo

我也嘗試過 - 具有相同的結果。是的，夾具在那裏。我想單擊的元素的Console.log顯示了這一點。唯一不存在的是通過淘汰賽添加的點擊事件。我可以通過jquery添加其他人，他們會正常工作。 –

關於直接測試函數 - 我們之前做過，並且導致測試沒有捕獲我們在重構過程中意外破壞的東西。這就是爲什麼我們寧願測試點擊本身的原因 –

啊我明白了，我想那就是它的價值！ :)我想這是由如何設置ko.applyBindings – kasperoo

如何測試Knockout.js點擊茉莉

回答

相關問題