stView.el未定義測試與茉莉花骨幹視圖

我正在使用Jasmine進行單元測試以測試與Backbone.js的應用程序（這是我第一次與他們合作，所以我有點兒有點自命不凡：/）這是我的看法骨幹stView.el未定義測試與茉莉花骨幹視圖

define(['jquery','backbone','underscore','handelbars','models/story','text!templates/story.html', 
 
\t \t 'controllers/storyController'], 
 
function($, Backbone, _,handelbars, story,storyTemplate,ctrl){ 
 
\t var View = Backbone.View.extend({ 
 
\t \t el: '#main', 
 
\t \t events:{ 
 
\t \t \t 'click .close-story' : 'closeStory', 
 
\t \t } 
 
     // Some functions 
 
\t }); 
 
\t return View; 
 
});

和茉莉花

define(['views/storyView'],function (storyView) { 
 
    describe("Testing the Story View ",function() { 
 
    var stView; 
 
    beforeEach(function(){ 
 
     stView=new storyView({id:1}); 
 
     stView.render(); 
 
    }) 
 
    it("Test if el is defined and trigger the click ",function() { 
 
     expect(stView.el).toBeDefined(); 
 
    }) 
 
    }) 
 
})

的規範

謝謝:)

來源

2017-08-06 Mariama Mariama

你得到的錯誤究竟是什麼？如title所述，沒有與myView.render（）。el'匹配的代碼。爲什麼你在'expect（stView。$ el.find（'。addbtn'））。toBeDefined（）;''之前點擊test中的按鈕。爲什麼在共享代碼中需要'var self = this;'？你爲什麼使用'$（self.el）'而不是'self。$ el'？總之，請清理你的代碼，發佈適當的錯誤，如果可能的話創建一個[mcve] –

@TJ謝謝你的回答，我很抱歉我不夠清楚，我編輯了我的問題和代碼，我希望它是現在可讀。 PS：我不是那種對視圖進行編碼的人，我只是在用茉莉花進行測試。非常感謝您的幫助:) –

如您在標題error：'myView.render（）。el'中提到的那樣，仍然沒有共享試圖訪問'render'方法的'el'屬性的代碼。所以導致問題的代碼不存在問題，並且渲染函數的內容也不存在問題...因此，我們無法找到沒有看到代碼的問題...... –

您已在視圖構造硬編碼el: '#main'。這將評估AMD模塊何時加載。當你運行茉莉花單元測試時，我不認爲你的應用程序的這個元素在Jasmine測試頁面中可用，除非你以某種方式嘲笑它。您可以通過在構造函數中放置一個斷點並檢查DOM來測試它。

對於現有代碼的工作，您應該在加載包含視圖定義的模塊之前，在任何DOM茉莉花用於運行測試的附加虛擬元素。

在另一方面，這是更好，同時創建視圖實例除去硬編碼el: '#main'（這是一個非常糟糕的編碼習慣你可以告訴開發者），並通過該元素的引用，所以你可以做

new storyView({id:1, el : $('<div/>'}); // dummy element for test

來源

2017-08-09 16:22:57

謝謝你的迴應:)但我需要與「主」作爲ID加載元素，所以我可以編譯一些漢德爾代碼聚苯乙烯：一個ID與ID =「主」存在一個div index.html（它是項目根目錄中的文件） PPS：索引始終在所有視圖之前加載。謝謝！ –

@MariamaMariama就我所知，Jasmine是用於單元測試的，單元測試不會創建應用程序的DOM結構。所以我不認爲茉莉花會加載你的index.html。你必須嘲笑它 –

我很抱歉，但我沒有找到如何嘲笑它，我發現的是如何嘲笑一個對象不是HTML，然後我試着用fixture「」jasmine.getFixtures（）來加載它。 load（「../../ index.html」）;「」在規範的beforeEach中使用「」define（['text！../../ index.html']，function（）「」在規範的頭部，但沒有成功，即使我發現文件加載，如果我檢查網絡選項卡，同時檢查鉻中的錯誤。非常感謝你:) –

stView.el未定義測試與茉莉花骨幹視圖

回答

相關問題