3

Jasmine (yaml 構成の宝石) を使用して Backbone.js アプリケーションをテストしようとしています。Todo exampleのようなアンダースコア テンプレートを使用しています。

template: _.template($('#item-template').html())

私の問題は、モデル/ビューの前にテンプレートをロードできないため、テンプレート呼び出しによってそれらのクラスがロード時にエラーになることです。

フィクスチャを行うための jasmine-jquery プラグインについて読みましたが、問題は、スペック ファイルを取得して必要なフィクスチャをセットアップできるようになる前に、src ファイル (モデル/ビュー) がロードされて失敗することです。

クラスのリセットに使用できるように、テンプレートを早期にロードするにはどうすればよいですか?

4

2 に答える 2

5

必要になるまで jQuery セレクターを遅らせることができます。

render: function(){
  var templateHtml = $(this.template).html();
  _.template(templateHtml);
}

または、ビューの初期化時にセレクターを実行できます。

initialize: function(){
  this.template = _.template($(this.template).html());
}

または、コードをそのままにして、ビューを定義するときにセレクターを評価させたい場合は、アプリコード全体を初期化するときに呼び出す関数ですべてのバックボーンコードをラップできます...$(function(){}実際の HTML ページの jQuery関数やbeforeEachJasmine テストの関数など:

MyApp = (function(){
  var myApp = {};

myApp.MyView = Backbone.View.extend({ template: _.template($("#item-template").html()) // ... });

return myApp; });

次に、アプリでこれを開始します。

$(function(){
  var myApp = MyApp();
  new myApp.MyView();
  // ...
});

そしてあなたのジャスミンテストで:

describe("how this thing works", function(){
  beforeEach(function(){
    var myApp = MyApp();
    this.view = new myApp.MyView();
    // ...
  });
});

これらのソリューションのいずれかを用意したら、Jasmine-jQuery などを使用してフィクスチャをロードできます。

FWIW: 必要に応じて、これらの手法を組み合わせて使用​​する傾向があります。

于 2011-10-24T17:25:53.230 に答える
1

受け入れられた回答の最初の部分の1つの問題は、ビューがインスタンス化されるたびにテンプレートがコンパイルされることです。別の方法として、テンプレートをビューのプロトタイプに直接設定する方法があります。

app.TodoView = Backbone.View.extend({
    initialize: function(){
        if (!app.TodoView.prototype.template) {
            app.TodoView.prototype.template = _.template($("#item-template").html());
        }
    }            
});

このようにして、 の最初のインスタンスがインスタンス化されるときに、テンプレートが 1 回コンパイルされTodoViewます。

于 2013-02-25T01:24:50.657 に答える