refactor($compile): automatically append end comment nodes to all ele…

…ment-transclusion templates

Previously we would do it manually in all of our structural directives.

BREAKING CHANGE: element-transcluded directives now have an extra comment automatically appended to their cloned DOM

This comment is usually needed to keep track the end boundary in the event child directives modify the root node(s).
If not used for this purpose it can be safely ignored.

src/ng/compile.js

@@ -1305,6 +1305,9 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
             compileNode = $compileNode[0];
             replaceWith(jqCollection, sliceArgs($template), compileNode);
 
+            $template[$template.length++] = document.createComment(' end ' + directiveName + ': ' +
+                templateAttrs[directiveName] + ' ');
+
             childTranscludeFn = compile($template, transcludeFn, terminalPriority,
                                         replaceDirective && replaceDirective.name, {
                                           // Don't pass in:

src/ng/directive/ngIf.js

@@ -92,7 +92,6 @@ var ngIfDirective = ['$animate', function($animate) {
             if (!childScope) {
               $transclude(function (clone, newScope) {
                 childScope = newScope;
-                clone[clone.length++] = document.createComment(' end ngIf: ' + $attr.ngIf + ' ');
                 // Note: We only need the first/last node of the cloned nodes.
                 // However, we need to keep the reference to the jqlite wrapper as it might be changed later
                 // by a directive with templateUrl when its template arrives.

src/ng/directive/ngRepeat.js

@@ -243,8 +243,6 @@ var ngRepeatDirective = ['$parse', '$animate', function($parse, $animate) {
     $$tlb: true,
     compile: function ngRepeatCompile($element, $attr) {
       var expression = $attr.ngRepeat;
-      var ngRepeatEndComment = document.createComment(' end ngRepeat: ' + expression + ' ');
-
       var match = expression.match(/^\s*([\s\S]+?)\s+in\s+([\s\S]+?)(?:\s+as\s+([\s\S]+?))?(?:\s+track\s+by\s+([\s\S]+?))?\s*$/);
 
       if (!match) {
@@ -409,11 +407,8 @@ var ngRepeatDirective = ['$parse', '$animate', function($parse, $animate) {
               // new item which we don't know about
               $transclude(function ngRepeatTransclude(clone, scope) {
                 block.scope = scope;
-                // http://jsperf.com/clone-vs-createcomment
-                var endNode = ngRepeatEndComment.cloneNode();
-                clone[clone.length++] = endNode;
                 $animate.enter(clone, null, jqLite(previousNode));
-                previousNode = endNode;
+                previousNode = clone[clone.length - 1];
                 // Note: We only need the first/last node of the cloned nodes.
                 // However, we need to keep the reference to the jqlite wrapper as it might be changed later
                 // by a directive with templateUrl when its template arrives.

src/ng/directive/ngSwitch.js

@@ -169,7 +169,6 @@ var ngSwitchDirective = ['$animate', function($animate) {
             selectedTransclude.transclude(function(caseElement, selectedScope) {
               selectedScopes.push(selectedScope);
               var anchor = selectedTransclude.element;
-              caseElement[caseElement.length++] = document.createComment(' end ngSwitchWhen: ');
               var block = { clone: caseElement };
 
               selectedElements.push(block);

test/ng/compileSpec.js

@@ -4805,7 +4805,12 @@ describe('$compile', function() {
                 return function(scope, element, attrs, ctrl) {
                   log('link');
                   var cursor = element;
-                  template(scope.$new(), function(clone) {cursor.after(cursor = clone);});
+
+                  template(scope.$new(), function(clone) {
+                    var nextCursor = clone.eq(1);
+                    cursor.after(clone);
+                    cursor = nextCursor;
+                  });
                   ctrl.$transclude(function(clone) {cursor.after(clone);});
                 };
               }
@@ -5110,9 +5115,10 @@ describe('$compile', function() {
             "inner:#comment:innerAgain:"
           ]);
           expect(child.length).toBe(1);
-          expect(child.contents().length).toBe(2);
+          expect(child.contents().length).toBe(3);
           expect(lowercase(nodeName_(child.contents().eq(0)))).toBe('#comment');
           expect(lowercase(nodeName_(child.contents().eq(1)))).toBe('div');
+          expect(lowercase(nodeName_(child.contents().eq(2)))).toBe('#comment');
         });
       });
     });