71

Jasmine で AngularJS のディレクティブ テストを作成し、templateUrl を使用しています: https://gist.github.com/tanepiper/62bd10125e8408def5cc

ただし、テストを実行すると、要点に含まれるエラーが表示されます。

Error: Unexpected request: GET views/currency-select.html

ドキュメントで読んだことから、これを正しく行っていると思いましたが、そうではないようです-ここで何が欠けていますか?

ありがとう

4

8 に答える 8

70

ngMockE2E または ngMock を使用している場合:

すべてのHTTP リクエストは、指定したルールを使用してローカルで処理され、サーバーには渡されません。テンプレートは HTTP 経由でリクエストされるため、ローカルで処理されます。アプリが に接続しようとしたときに行うことを何も指定していないためviews/currency-select.html、それを処理する方法がわからないことが通知されます。ngMockE2E にテンプレート リクエストを渡すように簡単に指示できます。

$httpBackend.whenGET('views/currency-select.html').passThrough();

必要に応じて、ルーティング パスで正規表現を使用してすべてのテンプレートを通過させることもできます。

ドキュメントでは、これについて詳しく説明しています: http://docs.angularjs.org/api/ngMockE2E.$httpBackend

それ以外の場合は、これを使用します:

$injector新しいバックエンドにアクセスするには、 を使用する必要があります。リンクされたドキュメントから：

var $httpBackend;
beforeEach(inject(function($injector) {
  $httpBackend = $injector.get('$httpBackend');
  $httpBackend.whenGET('views/currency-select.html').respond(200, '');
}));
于 2013-02-07T21:45:55.653 に答える
5

あなたはおそらく$templatecacheインジェクターからを取得し、次に次のようなことをすることができます

$templateCache.put("views/currency-select.html","<div.....>");

<div.....>あなたの代わりにあなたのテンプレートを置く場所。

その後、ディレクティブを設定すると、正常に機能するはずです。

于 2013-02-07T22:48:41.827 に答える
4

リクエストに応じて、コメントを回答に変換します。

Yeomanアプリで @Lior の回答を利用したい人向け:

テンプレートが karma config で参照される方法と、その結果として生成されるモジュールの名前が、ディレクティブ定義で sng-html2jsとして指定された値と一致しない場合があります。 生成されたモジュール名を s と一致するように調整する必要があります。 これらは役立つかもしれません：templateUrl
templateUrl

于 2014-06-25T03:52:06.563 に答える
2

これは、partial を templateUrl として使用するディレクティブをテストする方法の例です。

describe('with directive', function(){
  var scope,
    compile,
    element;

  beforeEach(module('myApp'));//myApp module

  beforeEach(inject(function($rootScope, $compile, $templateCache){
   scope = $rootScope.$new();
   compile = $compile;

   $templateCache.put('view/url.html',
     '<ul><li>{{ foo }}</li>' +
     '<li>{{ bar }}</li>' +
     '<li>{{ baz }}</li>' +
     '</ul>');
   scope.template = {
     url: 'view/url.html'
    };

   scope.foo = 'foo';
   scope.bar = 'bar';
   scope.baz = 'baz';
   scope.$digest();

   element = compile(angular.element(
    '<section>' +
      '<div ng-include="template.url" with="{foo : foo, bar : bar, baz : baz}"></div>' +
      '<div ng-include="template.url" with=""></div>' +
    '</section>'
     ))(scope);
   scope.$digest();

 }));

  it('should copy scope parameters to ngInclude partial', function(){
    var isolateScope = element.find('div').eq(0).scope();
    expect(isolateScope.foo).toBeDefined();
    expect(isolateScope.bar).toBeDefined();
    expect(isolateScope.baz).toBeDefined();
  })
});
于 2014-07-21T05:59:32.417 に答える
0

jasmine-maven-pluginを RequireJS と一緒に使用している場合は、テキスト プラグインを使用してテンプレートコンテンツを変数にロードし、それをテンプレート キャッシュに入れることができます。


define(['angular', 'text!path/to/template.html', 'angular-route', 'angular-mocks'], function(ng, directiveTemplate) {
    "use strict";

    describe('Directive TestSuite', function () {

        beforeEach(inject(function( $templateCache) {
            $templateCache.put("path/to/template.html", directiveTemplate);
        }));

    });
});
于 2014-05-15T11:11:35.587 に答える