Skip to content

Commit 7599625

Browse files
test($compile): top level nested transcludes are passing down tree
If you have two directives that both expect to receive transcluded content the outer directive works but the inner directive never receives a transclusion function, only if the first transclude directive is not the first directive found in compilation. See angular#7240
1 parent 7e56eda commit 7599625

File tree

1 file changed

+91
-1
lines changed

1 file changed

+91
-1
lines changed

test/ng/compileSpec.js

+91-1
Original file line numberDiff line numberDiff line change
@@ -1445,6 +1445,59 @@ describe('$compile', function() {
14451445

14461446
iit('should pass the transcluded content through to ng-transclude', function() {
14471447

1448+
module(function($compileProvider) {
1449+
// This directive transcludes its contents and hopes to use the
1450+
// transcluded content in its template
1451+
$compileProvider.directive('transTest', valueFn({
1452+
templateUrl: 'transTestTemplate',
1453+
transclude: true
1454+
}));
1455+
});
1456+
1457+
inject(function($compile, $rootScope, $templateCache) {
1458+
// This is the template for the trans-test directive, it contains an
1459+
// ng-if, which also uses transclusion, which basically blocks the inner
1460+
// trans-test directive from receiving any transcluded content
1461+
$templateCache.put('transTestTemplate',
1462+
' <div ng-if="true">'+
1463+
' <div ng-transclude></div>'+
1464+
'</div>');
1465+
1466+
element = $compile('<div trans-test>transcluded content</div>')($rootScope);
1467+
1468+
// The ngTransclude:orphan error gets thrown when the digest occurs since this
1469+
// is when the ngTransclude directive tries to use the transcluded function.
1470+
$rootScope.$digest();
1471+
1472+
expect(element.text().trim()).toEqual('transcluded content');
1473+
});
1474+
});
1475+
1476+
1477+
iit('nested ngIfs should transclude correctly', function() {
1478+
1479+
module(function($compileProvider) {
1480+
// This directive does nothing except to put a directive in the compile
1481+
// element ancestors list between the root $compile node and the trans-test
1482+
// directives' element
1483+
$compileProvider.directive('noop', valueFn({}));
1484+
});
1485+
1486+
inject(function($compile, $rootScope) {
1487+
element = $compile('<div noop><div ng-if="true">outer<div ng-if="true">inner</div></div></div>')($rootScope);
1488+
1489+
// The ngTransclude:orphan error gets thrown when the digest occurs since this
1490+
// is when the ngTransclude directive tries to use the transcluded function.
1491+
$rootScope.$digest();
1492+
1493+
expect(element.text().trim()).toEqual('outerinner');
1494+
});
1495+
});
1496+
1497+
iit('should pass the transcluded content through to ng-transclude, ' +
1498+
'when not the highest directive' +
1499+
'and with external template', function() {
1500+
14481501
module(function($compileProvider) {
14491502
// This directive transcludes its contents and hopes to use the
14501503
// transcluded content in its template
@@ -1467,7 +1520,6 @@ describe('$compile', function() {
14671520
'<div noop>'+
14681521
' <div ng-if="true">'+
14691522
' <div ng-transclude></div>'+
1470-
' _this should be removed_' +
14711523
' </div>'+
14721524
'</div>');
14731525

@@ -1481,6 +1533,44 @@ describe('$compile', function() {
14811533
});
14821534
});
14831535

1536+
iit('should pass the transcluded content through to ng-transclude, ' +
1537+
'when not the highest directive' +
1538+
'and with inline template', function() {
1539+
1540+
module(function($compileProvider) {
1541+
// This directive transcludes its contents and hopes to use the
1542+
// transcluded content in its template
1543+
$compileProvider.directive('transTest', valueFn({
1544+
template:
1545+
// This is the template for the trans-test directive, it contains an
1546+
// ng-if, which also uses transclusion, which basically blocks the inner
1547+
// trans-test directive from receiving any transcluded content
1548+
'<div noop>'+
1549+
' <div ng-if="true">'+
1550+
' <div ng-transclude></div>'+
1551+
' </div>'+
1552+
'</div>',
1553+
transclude: true
1554+
}));
1555+
1556+
// This directive does nothing except to put a directive in the compile
1557+
// element ancestors list between the root $compile node and the trans-test
1558+
// directives' element
1559+
$compileProvider.directive('noop', valueFn({}));
1560+
});
1561+
1562+
inject(function($compile, $rootScope, $templateCache) {
1563+
1564+
element = $compile('<div trans-test>transcluded content</div>')($rootScope);
1565+
1566+
// The ngTransclude:orphan error gets thrown when the digest occurs since this
1567+
// is when the ngTransclude directive tries to use the transcluded function.
1568+
$rootScope.$digest();
1569+
1570+
expect(element.text().trim()).toEqual('transcluded content');
1571+
});
1572+
});
1573+
14841574

14851575
it("should fail if replacing and template doesn't have a single root element", function() {
14861576
module(function($exceptionHandlerProvider) {

0 commit comments

Comments
 (0)