testing ng-transclude doesn't work

I'm writing two directives that wrap ui-bootstrap's tabset and tab directives.

In order for the content of my directives to be passed to the wrapped directives, I'm using transclusion in both of them.

This works quite well, the only problem is that I'm failing at writing a test that checks that. My test uses a replacement directive as a mock for the wrapped directive, which I replace using $compileProvider before each test.

The test code looks something like this:

beforeEach(module('myModule', function($compileProvider) {
    // Mock the internally used 'tab' which is a third party and should not be tested here
    $compileProvider.directive('tab', function() {
        // Provide a directive with a high priority and 'terminal' set to true, makes sure that
        // the mock directive will get executed, and that the real directive will not
        var mock = {
            priority: 100,
            terminal: true,
            restrict: 'EAC',
            replace: true,
            transclude: true,
            template: '<div class="mock" ng-transclude></div>'
        };

        return mock;
    });
}));

beforeEach(function() {
    inject(function(_$compile_, _$rootScope_) {
        $compile = _$compile_;
        $rootScope = _$rootScope_;
    });
});

beforeEach(function() {
    $scope = $rootScope.$new();
});

afterEach(function() {
    $scope.$destroy();
});

it('Places the enclosed html inside the tab body', function() {
    element = $compile("<div><my-tab>test paragraph</my-tab></div>")($scope);
    $scope.$digest();

    console.log("element.html() = ", element.html());

    expect(element.text().trim()).toEqual("test paragraph");
});

The template of my directive looks something like this:

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

The directive module looks something like this:

angular.module('myModule', ['ui.bootstrap'])

.directive('myTab', function() {
    return {
        restrict: 'E',
        replace: true,
        transclude: true,
        templateUrl: 'templates/my-tab.tpl.html',

        scope: {
        }
    };
});

The result of the print to the console is this:

LOG: 'element.html() = ', '<div class="ng-isolate-scope" id=""><div id="" heading="" class="mock"><ng-transclude></ng-transclude></div></div>'

Any ideas on why the transclusion doesn't take place (again, it works outside of the test just fine) ?