Throw error when compiling multiple roots

mhevery · mhevery · commit 80928648f53f · 2011-05-17T13:28:16.000-07:00
Closes angular#338
diff --git a/src/Compiler.js b/src/Compiler.js
@@ -169,6 +169,11 @@ Compiler.prototype = {
     var index = 0,
         template,
         parent = templateElement.parent();
+    if (templateElement.length > 1) {
+      // https://github.com/angular/angular.js/issues/338
+      throw Error("Cannot compile multiple element roots: " +
+          jqLite('<div>').append(templateElement.clone()).html());
+    }
     if (parent && parent[0]) {
       parent = parent[0];
       for(var i = 0; i < parent.childNodes.length; i++) {
diff --git a/test/BinderSpec.js b/test/BinderSpec.js
@@ -40,8 +40,8 @@ describe('Binder', function(){
   });
 
   it('ChangingRadioUpdatesModel', function(){
-    var scope = this.compile('<input type="radio" name="model.price" value="A" checked>' +
-          '<input type="radio" name="model.price" value="B">');
+    var scope = this.compile('<div><input type="radio" name="model.price" value="A" checked>' +
+          '<input type="radio" name="model.price" value="B"></div>');
     scope.$apply();
     assertEquals(scope.model.price, 'A');
   });
diff --git a/test/CompilerSpec.js b/test/CompilerSpec.js
@@ -35,6 +35,15 @@ describe('compiler', function(){
     dealoc(scope);
   });
 
+  it('should not allow compilation of multiple roots', function(){
+    expect(function(){
+      compiler.compile('<div>A</div><span></span>');
+    }).toThrow("Cannot compile multiple element roots: " + ie("<div>A</div><span></span>"));
+    function ie(text) {
+      return msie ? uppercase(text) : text;
+    }
+  });
+
   it('should recognize a directive', function(){
     var e = jqLite('<div directive="expr" ignore="me"></div>');
     directives.directive = function(expression, element){
diff --git a/test/service/invalidWidgetsSpec.js b/test/service/invalidWidgetsSpec.js
@@ -12,7 +12,7 @@ describe('$invalidWidgets', function() {
 
 
   it("should count number of invalid widgets", function(){
-    var element = jqLite('<input name="price" ng:required ng:validate="number"></input>');
+    var element = jqLite('<input name="price" ng:required ng:validate="number">');
     jqLite(document.body).append(element);
     scope = compile(element)();
     var $invalidWidgets = scope.$service('$invalidWidgets');
