Errore: Richiesta imprevista: OTTIENE visualizzazioni/parziali/* per una direttiva annidata anche quando si utilizza html2js nel test dell'unità karma/jasmine

Question

Sto usando Karma e Jasmine per il test dell'unità per la mia applicazione angularjs. Ho un modello di direttiva (ad esempio la Direttiva A) in cui un'altra direttiva (ad esempio la Direttiva B) viene sottoposta a rendering, sebbene funzioni correttamente nell'applicazione, ma il caso di test non riesce a rendere il modello della Direttiva B. seguito è l'errore che ottengo: -

Error: Unexpected request: GET views/partials/directiveb.html 
Expected GET https://my-sandbox.app.com/123456 

Di seguito si riporta il codice della direttiva del A: -

angular.module('myApp') 
    .directive('directiveA', function (myservices, myOtherServices) { 
    return { 
     controller: function(){ 
     /* ... controller function ... */ 
     }, 
     templateUrl: '/views/partials/directivea.html', 
     restrict: 'E', 
     link: function postLink(scope, element, attrs) { 
     /* ...link function... */ 
     } 
    }; 
    }); 

modello di direttiva A: -

<div> 
    <div class="col-md-12"> 
     <h4>We <strong>Need</strong></h4> 
     <div directive-b some-attribute=="true"></div> 
    </div> 
    <div directive-b some-attribute=="false"></div> 
</div> 

banco di prova della direttiva A: -

'use strict'; 

describe('Directive: directiveA', function() { 

    // load the directive's module 
    beforeEach(module('myApp')); 
    beforeEach(module('template-module')); 

    var element, appId, reqResponse, scope, dscope, reqUrl, $httpBackend, $compile; 
    beforeEach(inject(function ($rootScope, _$httpBackend_) { 
     scope = $rootScope.$new(); 
     $httpBackend = _$httpBackend_; 
     appId = "123456"; 
     reqUrl = "https://my-sandbox.app.com/" + appId; 
     reqResponse = {} 
    })); 

    it('should Pass', inject(function (_$compile_) { 

     $httpBackend.expect('GET', reqUrl).respond(reqResponse); 
     $compile = _$compile_; 
     element = angular.element('<directive-a/>'); 
     element = $compile(element)(scope); 
     scope.$digest(); 
     $httpBackend.flush(); 

     dscope = element.scope(); 

     expect(dscope.myVar).toBe(true); 
    })); 

}); 

Karma file di configurazione: -

// Karma configuration 
// http://karma-runner.github.io/0.12/config/configuration-file.html 
// generator-karma 0.8.2 

module.exports = function(config) { 
    config.set({ 
    autoWatch: true, 
    basePath: '../', 
    frameworks: ['jasmine'], 
    preprocessors: { 
     'app/views/**/*.html': 'html2js' 
    }, 
    ngHtml2JsPreprocessor: { 
     stripPrefix: "app", 
     moduleName: "template-module" 
     }, 

    // list of files/patterns to load in the browser 
    files: [ 
     'bower_components/angular/angular.js', 
     'bower_components/angular-mocks/angular-mocks.js', 
     'bower_components/angular-animate/angular-animate.js', 
     'bower_components/angular-cookies/angular-cookies.js', 
     'bower_components/angular-resource/angular-resource.js', 
     'bower_components/angular-route/angular-route.js', 
     'bower_components/angular-sanitize/angular-sanitize.js', 
     'bower_components/angular-touch/angular-touch.js', 
     'bower_components/angular-strap/dist/angular-strap.min.js', 
     'bower_components/angular-strap/dist/angular-strap.tpl.min.js', 
     'bower_components/ng-file-upload/angular-file-upload-shim.min.js', 
     'bower_components/ng-file-upload/angular-file-upload.js', 
     'bower_components/jquery/dist/jquery.js', 
     'app/scripts/**/*.js', 
     'test/mock/**/*.js', 
     'test/spec/**/*.js', 
     'app/views/**/*.html' 
    ], 

    // list of files/patterns to exclude 
    exclude: ['test/spec/e2e/*'], 

    // web server port 
    port: 8080, 

    browsers: ['PhantomJS'], 

    // Which plugins to enable 
    plugins: [ 
    // 'karma-chrome-launcher', 
     'karma-phantomjs-launcher', 
     'karma-jasmine', 
     'karma-ng-html2js-preprocessor' 
    ], 

    // Continuous Integration mode 
    // if true, it capture browsers, run tests and exit 
    singleRun: false, 

    colors: true, 

    // level of logging 
    // possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG 
    logLevel: config.LOG_INFO 

    // Uncomment the following lines if you are using grunt's server to run the tests 
    //proxies: { 
    // '/': 'http://localhost:9000/' 
    // }, 
    // URL root prevent conflicts with the site root 
    // urlRoot: '_karma_' 
    }); 
}; 

NOTA: Sono già usando html2js a $ templateCache, ed ancora sto ottenendo questo problema.

Answer 1

L'URL del modello della direttiva A è /views/partials/directivea.html. Ciò non causa un HTTP GET che deve essere eseguito perché il modello è memorizzato nella cache dal preprocessore:

ngHtml2JsPreprocessor: { 
    stripPrefix: "app", 
    moduleName: "template-module" 
    } 

Ma c'è una richiesta GET giustiziato per views/partials/directiveb.html. Nota la differenza con il primo URL: non ha uno / leader. La cache del modello ha una voce per il partial, ma il suo URL nella cache è /views/partials/directiveb.html, non views/partials/directiveb.html.

Assicurarsi di utilizzare costantemente percorsi assoluti o relativi e, in base alla scelta, rimuovere il prefisso app o il prefisso app/ nella configurazione del preprocessore.