fix($compile): compile replace directives in external template

danilsomsikov · IgorMinar · commit 398691beb3fc · 2013-02-25T21:44:00.000-08:00
Passing DOMNode#childNodes to compileNodes when compiling remote template, so that directives with replace:true can be compiled. The previous version used jqLite#contents which returned collection that was not updated during the compilation. Closes #1859
diff --git a/src/ng/compile.js b/src/ng/compile.js
@@ -358,7 +358,7 @@ function $CompileProvider($provide) {
 
     function compile($compileNodes, transcludeFn, maxPriority) {
       if (!($compileNodes instanceof jqLite)) {
-        // jquery always rewraps, where as we need to preserve the original selector so that we can modify it.
+        // jquery always rewraps, whereas we need to preserve the original selector so that we can modify it.
         $compileNodes = jqLite($compileNodes);
       }
       // We can not compile top level text elements since text nodes can be merged and we will
@@ -410,7 +410,7 @@ function $CompileProvider($provide) {
      * functions return values - the linking functions - are combined into a composite linking
      * function, which is the a linking function for the node.
      *
-     * @param {NodeList} nodeList an array of nodes to compile
+     * @param {NodeList} nodeList an array of nodes or NodeList to compile
      * @param {function(angular.Scope[, cloneAttachFn]} transcludeFn A linking function, where the
      *        scope argument is auto-generated to the new child of the transcluded parent scope.
      * @param {DOMElement=} $rootElement If the nodeList is the root of the compilation tree then the
@@ -1000,7 +1000,7 @@ function $CompileProvider($provide) {
 
           directives.unshift(derivedSyncDirective);
           afterTemplateNodeLinkFn = applyDirectivesToNode(directives, compileNode, tAttrs, childTranscludeFn);
-          afterTemplateChildLinkFn = compileNodes($compileNode.contents(), childTranscludeFn);
+          afterTemplateChildLinkFn = compileNodes($compileNode[0].childNodes, childTranscludeFn);
 
 
           while(linkQueue.length) {
diff --git a/test/ng/compileSpec.js b/test/ng/compileSpec.js
@@ -702,6 +702,10 @@ describe('$compile', function() {
               }
             }));
 
+            directive('replace', valueFn({
+              replace: true,
+              template: '<span>Hello, {{name}}!</span>'
+            }));
           }
         ));
 
@@ -817,6 +821,31 @@ describe('$compile', function() {
         ));
 
 
+        it('should compile template when replacing element in another template',
+            inject(function($compile, $templateCache, $rootScope) {
+          $templateCache.put('hello.html', '<div replace></div>');
+          $rootScope.name = 'Elvis';
+          element = $compile('<div><b class="hello"></b></div>')($rootScope);
+
+          $rootScope.$digest();
+
+          expect(sortedHtml(element)).
+            toEqual('<div><b class="hello"><span replace="">Hello, Elvis!</span></b></div>');
+        }));
+
+
+        it('should compile template when replacing root element',
+            inject(function($compile, $templateCache, $rootScope) {
+              $rootScope.name = 'Elvis';
+              element = $compile('<div replace></div>')($rootScope);
+
+              $rootScope.$digest();
+
+              expect(sortedHtml(element)).
+                  toEqual('<span replace="">Hello, Elvis!</span>');
+            }));
+
+
         it('should resolve widgets after cloning in append mode', function() {
           module(function($exceptionHandlerProvider) {
             $exceptionHandlerProvider.mode('log');
