angularjs - AngularJS は、replace を true に設定してディレクティブをテストします

Question

私<custom-directive>はreplace:trueと を持っていtemplate: '<img />'ます。ユニットテストを書くにはどうすればよいですか？custom-directive が実際に img に置き換えられることをテストしたいと思います。

it('should be transformed to <img>', function(){
  var elm = $compile('<custom-directive></custom-directive>')(scope);
  scope.$digest();

  var t = elm.find('img'); // wrong! it replaces the element. it won't find another one inside
 //expect(elm).toBeAnImgElement ?
});

正しいマッチャーが見つかりません。私が見た最も近いケースは、コンテンツ (elm.html()またはelm.text()) をチェックすることですが、私のタグは空です。

Answer 1

次のような div でディレクティブをラップします。

describe('Directive: custom', function () {
  beforeEach(module('App'));

  var element, $scope;

  it('should be transformed to <img>', inject(function ($rootScope, $compile) {
    $scope = $rootScope.$new();
    element = angular.element('<div><custom-directive></custom-directive></div>');
    element = $compile(element)($scope);

    expect(element.children('img').length).toBe(1);
  }));
});