测试在内部使用$ compile的动态指令

Question

我正在尝试测试一个使用$ compile提供程序在内部编译的指令，该指令基于我传递的选项

angular网站中建议测试的问题在于他们假设您在指令中指定了一个模板，而不是在指令中动态创建元素。

这是我的测试：

describe('Directives', function() {
  var $compile,
    $rootScope;

  beforeEach(module('vcm-spa'));
  beforeEach(module('Directives'));
  beforeEach(inject(function(_$compile_, _$rootScope_) {
    $compile = _$compile_;
    $rootScope = _$rootScope_;
  }));

  it('Compiles the text inside a label', function() {
    var element = $compile('<bttn text="this is some text" class="basic big mrts" action="login()"> </bttn>')($rootScope);
    $rootScope.$digest();
    expect(element.html()).toContain("this is some text");
  });
});

问题是当然element.html是空的，因为我没有指定模板。

如何手动执行使用$ compile的链接方法？

我的指示：

angular.module('Directives').directive('bttn', [ '$compile', 
  function( $compile) {
    return {
      restrict: 'E',
      scope: false,
      controller: function($scope, $element, $attrs) {

        var t = '<div ng-click="$action" class="ui button $classes">\
                            <i class="{{$id.icon}} "></i>\
                            $text\
                     </div>';
        t = t.replace(/\$text/g, $attrs.text);

        $scope.t = t;
      },
      link: function(scope, element, attrs, controllers) {
        var t = scope.t;
        unescape(t);
        element.html(t);
        var e = $compile(t, {
          transclude: true
        })(scope);
        element.replaceWith(e);
      }
    };
  }
]);