chore(compiler): change default restriction to attribute only for directives

7 files changed, 117 insertions, 89 deletions

diff --git a/src/AngularPublic.js b/src/AngularPublic.js
index 9d31601f..8ee8bc06 100644
--- a/src/AngularPublic.js
+++ b/src/AngularPublic.js
@@ -60,16 +60,13 @@ function publishExternalAPI(angular){
 
   angularModule('ng', ['ngLocale'], ['$provide',
     function ngModule($provide) {
-      $provide.service('$anchorScroll', $AnchorScrollProvider);
-      $provide.service('$browser', $BrowserProvider);
-      $provide.service('$cacheFactory', $CacheFactoryProvider);
       $provide.service('$compile', $CompileProvider).
         directive({
             a: htmlAnchorDirective,
             input: inputDirective,
             textarea: inputDirective,
-            form: ngFormDirective,
-            script: scriptTemplateLoader,
+            form: formDirective,
+            script: scriptDirective,
             select: selectDirective,
             style: styleDirective,
             onload: onloadDirective,
@@ -84,7 +81,7 @@ function publishExternalAPI(angular){
             ngClassOdd: ngClassOddDirective,
             ngCloak: ngCloakDirective,
             ngController: ngControllerDirective,
-            ngForm: ngFormDirective,
+            ngForm: formDirective,
             ngHide: ngHideDirective,
             ngInclude: ngIncludeDirective,
             ngInit: ngInitDirective,
@@ -106,30 +103,36 @@ function publishExternalAPI(angular){
             ngModelInstant: ngModelInstantDirective,
             required: requiredDirective,
             ngRequired: requiredDirective
-          }).
-        directive(ngEventDirectives).
-        directive(ngAttributeAliasDirectives);
-      $provide.service('$controller', $ControllerProvider);
-      $provide.service('$cookies', $CookiesProvider);
-      $provide.service('$cookieStore', $CookieStoreProvider);
-      $provide.service('$defer', $DeferProvider);
-      $provide.service('$document', $DocumentProvider);
-      $provide.service('$exceptionHandler', $ExceptionHandlerProvider);
-      $provide.service('$filter', $FilterProvider);
-      $provide.service('$interpolate', $InterpolateProvider);
-      $provide.service('$http', $HttpProvider);
-      $provide.service('$httpBackend', $HttpBackendProvider);
-      $provide.service('$location', $LocationProvider);
-      $provide.service('$log', $LogProvider);
-      $provide.service('$parse', $ParseProvider);
-      $provide.service('$resource', $ResourceProvider);
-      $provide.service('$route', $RouteProvider);
-      $provide.service('$routeParams', $RouteParamsProvider);
-      $provide.service('$rootScope', $RootScopeProvider);
-      $provide.service('$q', $QProvider);
-      $provide.service('$sanitize', $SanitizeProvider);
-      $provide.service('$sniffer', $SnifferProvider);
-      $provide.service('$templateCache', $TemplateCacheProvider);
-      $provide.service('$window', $WindowProvider);
-    }]);
+        }).
+        directive(ngAttributeAliasDirectives).
+        directive(ngEventDirectives);
+      $provide.service({
+        $anchorScroll: $AnchorScrollProvider,
+        $browser: $BrowserProvider,
+        $cacheFactory: $CacheFactoryProvider,
+        $controller: $ControllerProvider,
+        $cookies: $CookiesProvider,
+        $cookieStore: $CookieStoreProvider,
+        $defer: $DeferProvider,
+        $document: $DocumentProvider,
+        $exceptionHandler: $ExceptionHandlerProvider,
+        $filter: $FilterProvider,
+        $interpolate: $InterpolateProvider,
+        $http: $HttpProvider,
+        $httpBackend: $HttpBackendProvider,
+        $location: $LocationProvider,
+        $log: $LogProvider,
+        $parse: $ParseProvider,
+        $resource: $ResourceProvider,
+        $route: $RouteProvider,
+        $routeParams: $RouteParamsProvider,
+        $rootScope: $RootScopeProvider,
+        $q: $QProvider,
+        $sanitize: $SanitizeProvider,
+        $sniffer: $SnifferProvider,
+        $templateCache: $TemplateCacheProvider,
+        $window: $WindowProvider
+      });
+    }
+  ]);
 };
diff --git a/src/directives.js b/src/directives.js
index c988bf7b..1fc7f1b5 100644
--- a/src/directives.js
+++ b/src/directives.js
@@ -1,5 +1,15 @@
 'use strict';
 
+function ngDirective(directive) {
+  if (isFunction(directive)) {
+    directive = {
+      link: directive
+    }
+  }
+  directive.restrict = directive.restrict || 'AC';
+  return valueFn(directive);
+};
+
 /**
  * @ngdoc directive
  * @name angular.module.ng.$compileProvider.directive.ng:init
@@ -26,7 +36,7 @@
      </doc:scenario>
    </doc:example>
  */
-var ngInitDirective = valueFn({
+var ngInitDirective = ngDirective({
   compile: function() {
     return {
       pre: function(scope, element, attrs) {
@@ -179,14 +189,14 @@ var ngControllerDirective = ['$controller', '$window', function($controller, $wi
      </doc:scenario>
    </doc:example>
  */
-var ngBindDirective = valueFn(function(scope, element, attr) {
+var ngBindDirective = ngDirective(function(scope, element, attr) {
   element.addClass('ng-binding').data('$binding', attr.ngBind);
   scope.$watch(attr.ngBind, function(value) {
     element.text(value == undefined ? '' : value);
   });
 });
 
-var ngBindHtmlUnsafeDirective = valueFn(function(scope, element, attr) {
+var ngBindHtmlUnsafeDirective = ngDirective(function(scope, element, attr) {
   element.addClass('ng-binding').data('$binding', attr.ngBindHtmlUnsafe);
   scope.$watch(attr.ngBindHtmlUnsafe, function(value) {
     element.html(value == undefined ? '' : value);
@@ -572,7 +582,7 @@ forEach(
      </doc:scenario>
    </doc:example>
  */
-var ngSubmitDirective = valueFn(function(scope, element, attrs) {
+var ngSubmitDirective = ngDirective(function(scope, element, attrs) {
   element.bind('submit', function() {
     scope.$apply(attrs.ngSubmit);
   });
@@ -581,7 +591,7 @@ var ngSubmitDirective = valueFn(function(scope, element, attrs) {
 
 function classDirective(name, selector) {
   name = 'ngClass' + name;
-  return valueFn(function(scope, element, attr) {
+  return ngDirective(function(scope, element, attr) {
     scope.$watch(attr[name], function(newVal, oldVal) {
       if (selector === true || scope.$index % 2 === selector) {
         if (oldVal && (newVal !== oldVal)) {
@@ -754,7 +764,7 @@ var ngClassEvenDirective = classDirective('Even', 1);
    </doc:example>
  */
 //TODO(misko): refactor to remove element from the DOM
-var ngShowDirective = valueFn(function(scope, element, attr){
+var ngShowDirective = ngDirective(function(scope, element, attr){
   scope.$watch(attr.ngShow, function(value){
     element.css('display', toBoolean(value) ? '' : 'none');
   });
@@ -793,7 +803,7 @@ var ngShowDirective = valueFn(function(scope, element, attr){
    </doc:example>
  */
 //TODO(misko): refactor to remove element from the DOM
-var ngHideDirective = valueFn(function(scope, element, attr){
+var ngHideDirective = ngDirective(function(scope, element, attr){
   scope.$watch(attr.ngHide, function(value){
     element.css('display', toBoolean(value) ? 'none' : '');
   });
@@ -831,7 +841,7 @@ var ngHideDirective = valueFn(function(scope, element, attr){
      </doc:scenario>
    </doc:example>
  */
-var ngStyleDirective = valueFn(function(scope, element, attr) {
+var ngStyleDirective = ngDirective(function(scope, element, attr) {
   scope.$watch(attr.ngStyle, function(newStyles, oldStyles) {
     if (oldStyles && (newStyles !== oldStyles)) {
       forEach(oldStyles, function(val, style) { element.css(style, '');});
@@ -894,7 +904,7 @@ var ngStyleDirective = valueFn(function(scope, element, attr) {
    </doc:example>
  *
  */
-var ngCloakDirective = valueFn({
+var ngCloakDirective = ngDirective({
   compile: function(element, attr) {
     attr.$set(attr.$attr.ngCloak, undefined);
     element.removeClass('ng-cloak');
@@ -935,6 +945,7 @@ ngAttributeAliasDirective(null, 'src');
          angular.module('transclude', [])
           .directive('pane', function(){
              return {
+               restrict: 'E',
                transclude: true,
                scope: 'isolate',
                locals: { title:'bind' },
@@ -962,7 +973,7 @@ ngAttributeAliasDirective(null, 'src');
    </doc:example>
  *
  */
-var ngTranscludeDirective = valueFn({
+var ngTranscludeDirective = ngDirective({
   controller: ['$transclude', '$element', function($transclude, $element) {
     $transclude(function(clone) {
       $element.append(clone);
diff --git a/src/service/compiler.js b/src/service/compiler.js
index 43db1e9b..42c694ff 100644
--- a/src/service/compiler.js
+++ b/src/service/compiler.js
@@ -162,7 +162,7 @@ function $CompileProvider($provide) {
                 directive.priority = directive.priority || 0;
                 directive.name = directive.name || name;
                 directive.require = directive.require || (directive.controller && directive.name);
-                directive.restrict = directive.restrict || 'EACM';
+                directive.restrict = directive.restrict || 'A';
                 directives.push(directive);
               } catch (e) {
                 $exceptionHandler(e);
diff --git a/src/widget/form.js b/src/widget/form.js
index 24f4ff42..e3823f41 100644
--- a/src/widget/form.js
+++ b/src/widget/form.js
@@ -117,7 +117,7 @@ FormController.prototype.registerWidget = function(widget, alias) {
 
 
 /**
- * @ngdoc widget
+ * @ngdoc directive
  * @name angular.module.ng.$compileProvider.directive.form
  *
  * @scope
@@ -204,7 +204,7 @@ FormController.prototype.registerWidget = function(widget, alias) {
       </doc:scenario>
     </doc:example>
  */
-var ngFormDirective = [function() {
+var formDirective = [function() {
   return {
     name: 'form',
     restrict: 'E',
diff --git a/src/widget/input.js b/src/widget/input.js
index ecdb9d23..45d7d6a0 100644
--- a/src/widget/input.js
+++ b/src/widget/input.js
@@ -599,7 +599,7 @@ function checkboxInputType(scope, element, attr, ctrl) {
 
 
 /**
- * @ngdoc widget
+ * @ngdoc directive
  * @name angular.module.ng.$compileProvider.directive.textarea
  *
  * @description
@@ -623,7 +623,7 @@ function checkboxInputType(scope, element, attr, ctrl) {
 
 
 /**
- * @ngdoc widget
+ * @ngdoc directive
  * @name angular.module.ng.$compileProvider.directive.input
  *
  * @description
diff --git a/src/widget/select.js b/src/widget/select.js
index f3c0f3dd..5ed1367f 100644
--- a/src/widget/select.js
+++ b/src/widget/select.js
@@ -1,7 +1,7 @@
 'use strict';
 
 /**
- * @ngdoc widget
+ * @ngdoc directive
  * @name angular.module.ng.$compileProvider.directive.select
  *
  * @description
@@ -424,6 +424,7 @@ var selectDirective = ['$compile', '$parse', function($compile,   $parse) {
 
 var optionDirective = ['$interpolate', function($interpolate) {
   return {
+    restrict: 'E',
     priority: 100,
     compile: function(element, attr) {
       if (isUndefined(attr.value)) {
diff --git a/src/widgets.js b/src/widgets.js
index 8bfd232d..4ea0553b 100644
--- a/src/widgets.js
+++ b/src/widgets.js
@@ -1,8 +1,9 @@
 'use strict';
 
 /**
- * @ngdoc widget
+ * @ngdoc directive
  * @name angular.module.ng.$compileProvider.directive.ng:include
+ * @restrict EA
  *
  * @description
  * Fetches, compiles and includes an external HTML fragment.
@@ -42,22 +43,22 @@
          </select>
          url of the template: <tt><a href="{{template.url}}">{{template.url}}</a></tt>
          <hr/>
-         <div class="ng-include" src="template.url"></div>
+         <div ng-include src="template.url"></div>
        </div>
       </doc:source>
       <doc:scenario>
         it('should load template1.html', function() {
-         expect(element('.doc-example-live .ng-include').text()).
+         expect(element('.doc-example-live [ng-include]').text()).
            toBe('Content of template1.html\n');
         });
         it('should load template2.html', function() {
          select('template').option('1');
-         expect(element('.doc-example-live .ng-include').text()).
+         expect(element('.doc-example-live [ng-include]').text()).
            toBe('Content of template2.html\n');
         });
         it('should change to blank', function() {
          select('template').option('');
-         expect(element('.doc-example-live .ng-include').text()).toEqual('');
+         expect(element('.doc-example-live [ng-include]').text()).toEqual('');
         });
       </doc:scenario>
     </doc:example>
@@ -65,6 +66,7 @@
 var ngIncludeDirective = ['$http', '$templateCache', '$anchorScroll', '$compile',
                   function($http,   $templateCache,   $anchorScroll,   $compile) {
   return {
+    restrict: 'EA',
     compile: function(element, attr) {
       var srcExp = attr.src,
           scopeExp = attr.scope || '',
@@ -117,8 +119,9 @@ var ngIncludeDirective = ['$http', '$templateCache', '$anchorScroll', '$compile'
 }];
 
 /**
- * @ngdoc widget
+ * @ngdoc directive
  * @name angular.module.ng.$compileProvider.directive.ng:switch
+ * @restrict EA
  *
  * @description
  * Conditionally change the DOM structure.
@@ -176,6 +179,7 @@ var ngIncludeDirective = ['$http', '$templateCache', '$anchorScroll', '$compile'
  */
 var NG_SWITCH = 'ng-switch';
 var ngSwitchDirective = valueFn({
+  restrict: 'EA',
   compile: function(element, attr) {
     var watchExpr = attr.ngSwitch || attr.on,
         cases = {};
@@ -203,7 +207,7 @@ var ngSwitchDirective = valueFn({
   }
 });
 
-var ngSwitchWhenDirective = valueFn({
+var ngSwitchWhenDirective = ngDirective({
   transclude: 'element',
   priority: 500,
   compile: function(element, attrs, transclude) {
@@ -213,7 +217,7 @@ var ngSwitchWhenDirective = valueFn({
   }
 });
 
-var ngSwitchDefaultDirective = valueFn({
+var ngSwitchDefaultDirective = ngDirective({
   transclude: 'element',
   priority: 500,
   compile: function(element, attrs, transclude) {
@@ -312,7 +316,7 @@ var htmlAnchorDirective = valueFn({
       </doc:scenario>
     </doc:example>
  */
-var ngRepeatDirective = valueFn({
+var ngRepeatDirective = ngDirective({
   transclude: 'element',
   priority: 1000,
   terminal: true,
@@ -436,7 +440,7 @@ var ngRepeatDirective = valueFn({
 
 
 /**
- * @ngdoc widget
+ * @ngdoc directive
  * @name angular.module.ng.$compileProvider.directive.ng:non-bindable
  *
  * @description
@@ -466,12 +470,13 @@ var ngRepeatDirective = valueFn({
       </doc:scenario>
     </doc:example>
  */
-var ngNonBindableDirective = valueFn({ terminal: true });
+var ngNonBindableDirective = ngDirective({ terminal: true });
 
 
 /**
- * @ngdoc widget
+ * @ngdoc directive
  * @name angular.module.ng.$compileProvider.directive.ng:view
+ * @restrict ECA
  *
  * @description
  * # Overview
@@ -560,6 +565,7 @@ var ngViewDirective = ['$http', '$templateCache', '$route', '$anchorScroll', '$c
                function($http,   $templateCache,   $route,   $anchorScroll,   $compile,
                         $controller) {
   return {
+    restrict: 'ECA',
     terminal: true,
     link: function(scope, element) {
       var changeCounter = 0,
@@ -619,8 +625,9 @@ var ngViewDirective = ['$http', '$templateCache', '$route', '$anchorScroll', '$c
 
 
 /**
- * @ngdoc widget
+ * @ngdoc directive
  * @name angular.module.ng.$compileProvider.directive.ng:pluralize
+ * @restrict EA
  *
  * @description
  * # Overview
@@ -788,44 +795,49 @@ var ngViewDirective = ['$http', '$templateCache', '$route', '$anchorScroll', '$c
  */
 var ngPluralizeDirective = ['$locale', '$interpolate', function($locale, $interpolate) {
   var BRACE = /{}/g;
-  return function(scope, element, attr) {
-    var numberExp = attr.count,
-        whenExp = element.attr(attr.$attr.when), // this is becaues we have {{}} in attrs
-        offset = attr.offset || 0,
-        whens = scope.$eval(whenExp),
-        whensExpFns = {};
-
-    forEach(whens, function(expression, key) {
-      whensExpFns[key] =
-        $interpolate(expression.replace(BRACE, '{{' + numberExp + '-' + offset + '}}'));
-    });
-
-    scope.$watch(function() {
-      var value = parseFloat(scope.$eval(numberExp));
-
-      if (!isNaN(value)) {
-        //if explicit number rule such as 1, 2, 3... is defined, just use it. Otherwise,
-        //check it against pluralization rules in $locale service
-        if (!whens[value]) value = $locale.pluralCat(value - offset);
-         return whensExpFns[value](scope, element, true);
-      } else {
-        return '';
-      }
-    }, function(newVal) {
-      element.text(newVal);
-    });
+  return {
+    restrict: 'EA',
+    link: function(scope, element, attr) {
+      var numberExp = attr.count,
+          whenExp = element.attr(attr.$attr.when), // this is becaues we have {{}} in attrs
+          offset = attr.offset || 0,
+          whens = scope.$eval(whenExp),
+          whensExpFns = {};
+
+      forEach(whens, function(expression, key) {
+        whensExpFns[key] =
+          $interpolate(expression.replace(BRACE, '{{' + numberExp + '-' + offset + '}}'));
+      });
+
+      scope.$watch(function() {
+        var value = parseFloat(scope.$eval(numberExp));
+
+        if (!isNaN(value)) {
+          //if explicit number rule such as 1, 2, 3... is defined, just use it. Otherwise,
+          //check it against pluralization rules in $locale service
+          if (!whens[value]) value = $locale.pluralCat(value - offset);
+           return whensExpFns[value](scope, element, true);
+        } else {
+          return '';
+        }
+      }, function(newVal) {
+        element.text(newVal);
+      });
+    }
   };
 }];
 
 
 /**
- * @ngdoc widget
+ * @ngdoc directive
  * @name angular.module.ng.$compileProvider.directive.script
  *
  * @description
  * Load content of a script tag, with type `text/ng-template`, into `$templateCache`, so that the
  * template can be used by `ng:include`, `ng:view` or directive templates.
  *
+ * @restrict E
+ *
  * @example
   <doc:example>
     <doc:source>
@@ -844,8 +856,9 @@ var ngPluralizeDirective = ['$locale', '$interpolate', function($locale, $interp
     </doc:scenario>
   </doc:example>
  */
-var scriptTemplateLoader = ['$templateCache', function($templateCache) {
+var scriptDirective = ['$templateCache', function($templateCache) {
   return {
+    restrict: 'E',
     terminal: true,
     compile: function(element, attr) {
       if (attr.type == 'text/ng-template') {