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未定义测试与茉莉花骨干视图

回答

相关问题