骨干网和要求如何添加Qunit [英] Backbone and Require how to add Qunit

问题描述

我使用的骨干网和Require.js。一切都很正常，但我想一些单元测试添加到我的应用程序。我决定使用Qunit.js。

I'm using Backbone and Require.js. Everything works great but, I would like to add some unit tests to my application. I decided use Qunit.js.

在我的 main.js 文件创建新的对象 EventsView ：

In my main.js file I create new object EventsView:

require.config({
  paths: {
    jquery:                 'libs/jquery',
    underscore:             'libs/underscore',
    backbone:               'libs/backbone',
    qunit:                  'test/libs/qunit-1.10.0
    }
 });
 require(['view/eventsView', 
          'test/eventsView_test', 
          'test/eventView_test' ], function(EventsView){
           var events = new EventsView; //here I create first object my View
 });

在 eventsView.js 初始化我呈现主视图

  define(['jquery',
          'backbone',
          'underscore',
          'collection/eventC',
          'model/eventM',
          'view/eventView'], function($, Backbone,_,EventC,EventM, EventView,){

 var EventsView = Backbone.View.extend({
    el: $(".contener"),     
    initialize: function(){
        this.render();
     },
     ....//other functions
    });
     return EventsView;
 });

所以，现在我需要从这一观点在其他文件中的 eventsView_test.js 调用函数。
我不能像这样做，因为该视图将再次呈现：

So now I need to call functions from this view in other file eventsView_test.js. I can't do it like this because the View will be rendered again:

  define(['jquery','qunit','view/eventsView'], function($,qunit,EventsView){
    //var eventsView = new EventsView(); // I can't create object here 

    test( "first_test_func", function() {
        var result = eventsView.first_test_func(2,2);
        equal( result, 4, "2 square equals 4" );
    });

我应该怎么办？我是否需要某种形式的单身或别的东西吗？

What should I do? Do I need some kind of singleton or something else?

推荐答案

意想不到的问题，一个是我看到所有的时间。

Fantastic question, and one that I see all the time.

其实，我创建了我一个被称为引导模式解决了这一点，但称它为任何你想要的。关键是，骨干视图不会渲染本身，而是任何人消耗它负责的。你会碰到与取（）问题之类的，所以这令人欣慰的解决这一点。

I actually solved this by creating what I dubbed a "bootstrap" paradigm, but call it whatever you want. The key is that the Backbone view does not render itself, but instead whomever consumes it is responsible for that. You'll run into issues with fetch() and the like, so thankfully this solves that too.

目标：不要单元测试渲染并跳过它一起

require(function () {
    var view = Backbone.View.extend({
        // initialize is executed on new, just as you found
        initialize: function (options) {
            _.bindAll(this);

            // Create models, initialize properties, and bind to events here.
            // Basically only do __UNEXPENSIVE__, non-dom-changing things that
            // you don't care get executed a lot.                

            this.someCollection = new Backbone.Collection();
            this.someCollection.on('add', this.onSomeCollectionAdd);
        },

        // bootstrap is for server-side operations that you don't want executed
        // by every single test.
        bootstrap: function () {
            this.someCollection.fetch().done(this.render);
        },

        render: function () {
            this.$el.html(...);
        },

        first_test_func: function () {

        }
    });

    return view;
});

这将如何在你的应用程序消耗：

require(['viewpath'], function (myView) {
    var instance = new myView({ el: $('#something') });
    instance.bootstrap(); //triggers fetch, or if no fetch needed, just render
});

现在，可以单位无后顾之忧测试。

define(['jquery','qunit','view/eventsView'], function($,qunit,EventsView){

    test( "first_test_func", function() {
        // Now this line won't call the server, or render.
        // You can isolate/test what you want.
        var eventsView = new EventsView();
        var result = eventsView.first_test_func(2,2);
        equal( result, 4, "2 square equals 4" );
    });
});

使用SinonJS

我强烈建议您查看 SinonJS 。这是惊人的单元测试的JavaScript，尤其是骨干实现，由于其强大的嘲讽它可以从preventing渲染和服务器调用中使用（取，从实际击中服务器保存等），同时还允许你断言，他们接到电话。

Use SinonJS

I strongly recommend checking out SinonJS. It's amazing for unit testing JavaScript, particularly Backbone implementations due to its powerful mocking which can be used from preventing the rendering and server calls (fetch, save, etc) from actually hitting the server while still allowing you to assert they got called.

这篇关于骨干网和要求如何添加Qunit的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！