fix($compile): ensure directive names have no leading or trailing whi…

…tespace

Closes angular#11397
Closes angular#11772

docs/content/error/$compile/baddir.ngdoc

@@ -5,4 +5,4 @@
 
 This error occurs when the name of a directive is not valid.
 
-Directives must start with a lowercase character.
+Directives must start with a lowercase character and must not contain leading or trailing whitespaces.

src/ng/compile.js

@@ -802,6 +802,11 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
     if (!letter || letter !== lowercase(letter)) {
       throw $compileMinErr('baddir', "Directive name '{0}' is invalid. The first character must be a lowercase letter", name);
     }
+    if (name !== name.trim()) {
+      throw $compileMinErr('baddir',
+            "Directive name '{0}' is invalid. The name should not contain leading or trailing whitespaces",
+            name);
+    }
   }
 
   /**

test/ng/compileSpec.js

@@ -211,6 +211,21 @@ describe('$compile', function() {
       });
       inject(function($compile) {});
     });
+    it('should throw an exception if a directive name has leading or trailing whitespace', function() {
+      module(function() {
+        function assertLeadingOrTrailingWhitespaceInDirectiveName(name) {
+          expect(function() {
+            directive(name, function() { });
+          }).toThrowMinErr(
+            '$compile','baddir', 'Directive name \'' + name + '\' is invalid. ' +
+            "The name should not contain leading or trailing whitespaces");
+        }
+        assertLeadingOrTrailingWhitespaceInDirectiveName(' leadingWhitespaceDirectiveName');
+        assertLeadingOrTrailingWhitespaceInDirectiveName('trailingWhitespaceDirectiveName ');
+        assertLeadingOrTrailingWhitespaceInDirectiveName(' leadingAndTrailingWhitespaceDirectiveName ');
+      });
+      inject(function($compile) {});
+    });
   });