如何檢查特定的div顯示在點擊JASMINE（JS）FRAMEWORK

Question

我對Jasmine JS Framework非常新穎。

我有兩個div'<div id="DIV_1"></div> and <div id="DIV_2"></div>。我有兩個鏈接圖像，假設我點擊鏈接image1我正在顯示DIV_1。如果我點擊鏈接圖片2，我隱藏了第一個DIV_1並顯示了DIV_2。

我的問題是，如何知道我什麼時候點擊鏈接圖片1，我使用顯示DIV_1 JASMINE JS Framework？

我在茉莉花規範使用該腳本點擊鏈接圖片1：$('.link_image').trigger('click');

Answer 1

我會創造一個茉莉花夾具，並呼籲該夾具的單擊事件。在此之後，您可以對燈具的狀態做出斷言。

我通常使用一個插件叫做茉莉的jQuery此： https://github.com/velesin/jasmine-jquery

的代碼最終會看起來像這樣：

var fixture = setFixture("some_html"); 
fixture.find('.link_image').trigger('click'); //.find() accepts a JQuery selector 
expect(fixture.find('#DIV_1').toBeHidden(); 
expect(fixture.find('#DIV_2').toBeVisible(); 

另外，如果你的模板是另一個文件（可能加載通過AMD）使用此功能：

var fixture = loadFixture('path/to/amd/template'); 

我強烈建議使用AMD方法加載相同的t你在生產中使用的模板，否則你必須重新創建你的HTML作爲測試的裝置，然後在那一刻你只是測試你的燈具而不是你的實際代碼。