Como posso testar uma diretiva usando templateUrl no navegador sem cabeça do Chutzpah

Alguém sabe como obter um navegador sem cabeçalho como o Visual Studio Test Adapter do Chutzpah para permitir que uma diretiva acesse seu arquivo de modelo .html? O Chutzpah usa o PhantomJS para um navegador sem cabeçalho que parece limitar minhas opções.

Estou usando Chutzpah Test Adapter 2.5 e AngularJS 1.2.0-r.2.

Eu recebo o erro:

Pedido inesperado: GET myApp / directives / template.html

O que é causado pelo Angular tentando usar o serviço $ http para acessar o modelo da minha diretiva.

Eu encontrei algumas soluções diferentes:

Manualmente usando XMLHttpRequest para importar os modelos.Usando um utilitário como o Grunt para inserir o modelo no código JS da sua diretiva.$httpBackend.when('GET', 'myApp/directives/template.html').passThrough() - isso só funciona em testes e2e, não em testes unitários.Coloque o modelo diretamente no código de teste.

Nenhuma dessas opções me satisfaz particularmente. Eu prefiro poder deixar a diretiva carregar seu template de forma transparente para que eu possa testá-lo como um componente. Existe uma maneira de fazer esse cenário funcionar?

Exemplo de código:

angular.module('myDirective', []).directive('myDirective', function() {
    return {
        restrict: 'E',
        transclude: true,
        templateUrl: 'myApp/directives/template.html',
        // Some other options, omitted for brevity.
    };
});

template.html:

<div><div ng-transclude></div></div>

Exemplo de teste de jasmim:

describe('myDirective', function() {
    // Assign $scope using inject(), load module etc.
    // Insert workaround for $httpBackend loading my templateUrl here.
    it('should transclude content', function() {
        var element = $compile("<my-directive>Look Mom, I'm in my directive!</my-directive>")($scope);
        $scope.$digest();

        expect(element.text().trim()).toBe("Look Mom, I'm in my directive!");
    });
}

questionAnswers(6)

yourAnswerToTheQuestion