karma-ng-html2js-preprocessor not able to GET template

Question

I am trying to write a test for a simple directive that uses templateUrl. Here my folder structure:

src
    main
        webapp
            assets
                css
                js
            partials
                cart
                    name.html
                    items.html
                    shipping.html
                index.html

Directive (for name.html):

cartApp.directive('drvCartName', function () {
        return {
            restrict: 'E',
            scope: {
                data: "="
            },
            templateUrl: 'cart/name.html'
        }
    }
);

Karma config file:

module.exports = function(config) {
    config.set({

        basePath: '',
        frameworks: ['jasmine'],    

        // list of files / patterns to load in the browser
        files: [
            '../../main/webapp/assets/js/angular.js',
            '../../main/webapp/assets/js/main.min.js',
            './assets/js/angular-mocks.js',
            './specs.js',
            '../../main/webapp/partials/*/*.html'
        ],

        // list of plugins to load
        plugins : [
            'karma-htmlfile-reporter',
            'karma-firefox-launcher',        
            'karma-jasmine',
            'karma-ng-html2js-preprocessor'
        ],    

        // list of files to exclude
        exclude: [
        ],    

        preprocessors: {
            '../../main/webapp/cart/*/*.html': ['ng-html2js']
        },

        ngHtml2JsPreprocessor: {
            //stripPrefix: "",
            //prependPrefix: "",

            // the name of the Angular module to create
            moduleName: "my.templates"
        },

        // test results reporter to use
        // possible values: 'dots', 'progress'
        // available reporters: https://npmjs.org/browse/keyword/karma-reporter
        reporters: ['progress', 'html'],    

        // web server port
        port: 9876,           

        // enable / disable watching file and executing tests whenever any file changes
        autoWatch: true,

        // start these browsers
        // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
        browsers: ['Firefox'],

        // Continuous Integration mode
        // if true, Karma captures browsers, runs the tests and exits
        singleRun: false

    });
};

Unit test:

describe("Directive:", function () { 

    beforeEach(angular.mock.module("cartApp"));

      describe("template", function () {
          var $compile;
          var $scope;
          var $httpBackend;

         // Load the templates module
         beforeEach(module('my.templates'));    

         // Angular strips the underscores when injecting
         beforeEach(inject(function(_$compile_, _$rootScope_) {
             $compile = _$compile_;
             $scope = _$rootScope_.$new();
         }));

         it("should render drv-cart-name",
         inject(function() {
            // $compile the template, and pass in the $scope.
            // This will find your directive and run everything
            var template = $compile("<drv-cart-name></drv-cart-name>")($scope);     
            // Now run a $digest cycle to update your template with new data
            $scope.$digest();

            // Render the template as a string
            var templateAsHtml = template.html();

            //  // Verify that the $scope variables are in the template
            expect(element.templateAsHtml()).toContain('<p class="user">');

         }));

     });
 });

Error:

Error: Unexpected request: GET cart/name.html No more request expected $httpBackend@

---

Tried a different way of writing my test, still the same error:

describe('Directive', function() {

    beforeEach(function() {
       module('cartApp');
       module('ngMockE2E'); //<-- IMPORTANT!

       inject(function(_$httpBackend_) {
        $httpBackend = _$httpBackend_;
        $httpBackend.whenGET('cart/name.html').passThrough();
       });
    });    

    var element, controller, scope;

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

        element = angular.element('<drv-cart-name></drv-cart-name>');
        element = $compile(element)(scope);
        scope.$digest();
    }));

    it('should contain a input class', function() {
        expect(element.html()).toContain('<p class="input">');
    });
});

Error: Unexpected request: GET cart/name.html No more request expected $httpBackend

---

UPDATE:

If i use my revised test above, and instead of using templateUrl in my directive, i actually insert the markup within template, the tests run and pass.