refactor(injector): turn scope into a service

- turn scope into a $rootScope service.
- injector is now a starting point for creating angular application.
- added inject() method which wraps jasmine its/beforeEach/afterEach,
  and which allows configuration and injection of services.
- refactor tests to use inject() where possible

BREAK:
- removed angular.scope() method

Author: mhevery

example/personalLog/test/personalLogSpec.js

@@ -2,8 +2,9 @@ describe('example.personalLog.LogCtrl', function() {
   var logCtrl;
 
   function createNotesCtrl() {
-    var scope = angular.scope();
-    scope.$cookies = scope.$service('$cookies');
+    var injector = angular.injector();
+    var scope = injector('$rootScope');
+    scope.$cookies = injector('$cookies');
     return scope.$new(example.personalLog.LogCtrl);
   }
 

src/Angular.js

@@ -952,8 +952,12 @@ function angularInit(config, document){
   var autobind = config.autobind;
 
   if (autobind) {
-    var element = isString(autobind) ? document.getElementById(autobind) : document;
-    compile(element)().$apply();
+    var element = isString(autobind) ? document.getElementById(autobind) : document,
+        injector = createInjector(),
+        scope = injector('$rootScope');
+
+    compile(element)(scope);
+    scope.$apply();
   }
 }
 

src/AngularPublic.js

@@ -15,7 +15,6 @@ extend(angular, {
   // disabled for now until we agree on public name
   //'annotate': annotate,
   'compile': compile,
-  'scope': createScope,
   'copy': copy,
   'extend': extend,
   'equals': equals,

src/Compiler.js

@@ -102,11 +102,10 @@ Template.prototype = {
  *
  *
  * @param {string|DOMElement} element Element or HTML to compile into a template function.
- * @returns {function([scope][, cloneAttachFn])} a template function which is used to bind template
+ * @returns {function(scope[, cloneAttachFn])} a template function which is used to bind template
  * (a DOM element/tree) to a scope. Where:
  *
- *  * `scope` - A {@link angular.scope Scope} to bind to. If none specified, then a new
- *               root scope is created.
+ *  * `scope` - A {@link angular.scope Scope} to bind to.
  *  * `cloneAttachFn` - If `cloneAttachFn` is provided, then the link function will clone the
  *               `template` and call the `cloneAttachFn` function allowing the caller to attach the
  *               cloned elements to the DOM document at the appropriate place. The `cloneAttachFn` is
@@ -115,9 +114,8 @@ Template.prototype = {
  *      * `clonedElement` - is a clone of the original `element` passed into the compiler.
  *      * `scope` - is the current scope with which the linking function is working with.
  *
- * Calling the template function returns the scope to which the element is bound to. It is either
- * the same scope as the one passed into the template function, or if none were provided it's the
- * newly create scope.
+ * Calling the template function returns the element of the template. It is either the original element
+ * passed in, or the clone of the element if the `cloneAttachFn` is provided.
  *
  * It is important to understand that the returned scope is "linked" to the view DOM, but no linking
  * (instance) functions registered by {@link angular.directive directives} or
@@ -133,8 +131,8 @@ Template.prototype = {
  * - If you are not asking the linking function to clone the template, create the DOM element(s)
  *   before you send them to the compiler and keep this reference around.
  *   <pre>
- *     var view = angular.element('<p>{{total}}</p>'),
- *         scope = angular.compile(view)();
+ *     var scope = angular.injector()('$rootScope');
+ *     var element = angular.compile('<p>{{total}}</p>')(scope);
  *   </pre>
  *
  * - if on the other hand, you need the element to be cloned, the view reference from the original
@@ -208,17 +206,17 @@ Compiler.prototype = {
     }
     template = this.templatize(templateElement, index) || new Template();
     return function(scope, cloneConnectFn){
+      assertArg(scope, 'scope');
       // important!!: we must call our jqLite.clone() since the jQuery one is trying to be smart
       // and sometimes changes the structure of the DOM.
       var element = cloneConnectFn
         ? JQLitePrototype.clone.call(templateElement) // IMPORTANT!!!
         : templateElement;
-        scope = scope || createScope();
       element.data($$scope, scope);
       scope.$element = element;
       (cloneConnectFn||noop)(element, scope);
       template.link(element, scope);
-      return scope;
+      return element;
     };
   },
 

src/Injector.js

@@ -9,17 +9,11 @@
  * Creates an injector function that can be used for retrieving services as well as for
  * dependency injection (see {@link guide/dev_guide.di dependency injection}).
  *
- * Angular creates an injector automatically for the root scope and it is available as the
- * {@link angular.scope.$service $service} property. Creating an injector doesn't automatically
- * create all of the `$eager` {@link angular.service services}. You have to call `injector.eager()`
- * to initialize them.
+ * Creating an injector doesn't automatically create all of the `$eager`
+ * {@link angular.service services}. You have to call `injector.eager()` to initialize them.
  *
- * @param {Object=} [factoryScope={}] The `this` for the service factory function.
  * @param {Object.<string, function()>=} [factories=angular.service] Map of the service factory
  *     functions.
- * @param {Object.<string, function()>=} [instanceCache={}] Place where instances of services are
- *     saved for reuse. Can also be used to override services specified by `serviceFactory`
- *     (useful in tests).
  * @returns {function()} Injector function:
  *
  *   * `injector(serviceName)`:
@@ -38,30 +32,24 @@
  *   * An `eager` property which is used to initialize the eager services.
  *     `injector.eager()`
  */
-function createInjector(factoryScope, factories, instanceCache) {
+function createInjector(factories) {
+  var instanceCache = {$injector: injector};
   factories = factories || angularService;
-  instanceCache = instanceCache || {};
-  factoryScope = factoryScope || {};
-  injector.invoke = invoke;
 
-  injector.eager = function() {
-    forEach(factories, function(factory, name){
-      if (factory.$eager)
-        injector(name);
+  injector.invoke = invoke;
 
-      if (factory.$creation)
-        throw new Error("Failed to register service '" + name +
-        "': $creation property is unsupported. Use $eager:true or see release notes.");
-    });
-  };
+  forEach(factories, function(factory, name){
+    if (factory.$eager)
+      injector(name);
+  });
   return injector;
 
   function injector(value){
     if (!(value in instanceCache)) {
       var factory = factories[value];
-      if (!factory) throw Error("Unknown provider for '"+value+"'.");
+      if (!factory) throw Error("Unknown provider for '" + value + "'.");
       inferInjectionArgs(factory);
-      instanceCache[value] = invoke(factoryScope, factory);
+      instanceCache[value] = invoke(null, factory);
     }
     return instanceCache[value];
   }

src/scenario/Runner.js

@@ -163,7 +163,7 @@ angular.scenario.Runner.prototype.createSpecRunner_ = function(scope) {
  */
 angular.scenario.Runner.prototype.run = function(application) {
   var self = this;
-  var $root = angular.scope();
+  var $root = angular.injector()('$rootScope');
   angular.extend($root, this);
   angular.forEach(angular.scenario.Runner.prototype, function(fn, name) {
     $root[name] = angular.bind(self, fn);

src/scenario/dsl.js

@@ -103,25 +103,25 @@ angular.scenario.dsl('browser', function() {
 
     api.url = function() {
       return this.addFutureAction('$location.url()', function($window, $document, done) {
-        done(null, $window.angular.scope().$service('$location').url());
+        done(null, $window.angular.injector()('$location').url());
       });
     };
 
     api.path = function() {
       return this.addFutureAction('$location.path()', function($window, $document, done) {
-        done(null, $window.angular.scope().$service('$location').path());
+        done(null, $window.angular.injector()('$location').path());
       });
     };
 
     api.search = function() {
       return this.addFutureAction('$location.search()', function($window, $document, done) {
-        done(null, $window.angular.scope().$service('$location').search());
+        done(null, $window.angular.injector()('$location').search());
       });
     };
 
     api.hash = function() {
       return this.addFutureAction('$location.hash()', function($window, $document, done) {
-        done(null, $window.angular.scope().$service('$location').hash());
+        done(null, $window.angular.injector()('$location').hash());
       });
     };
 

src/service/cookies.js

@@ -13,9 +13,8 @@
  *
  * @example
  */
-angularServiceInject('$cookies', function($browser) {
-  var rootScope = this,
-      cookies = {},
+angularServiceInject('$cookies', function($rootScope, $browser) {
+  var cookies = {},
       lastCookies = {},
       lastBrowserCookies,
       runEval = false;
@@ -27,7 +26,7 @@ angularServiceInject('$cookies', function($browser) {
       lastBrowserCookies = currentCookies;
       copy(currentCookies, lastCookies);
       copy(currentCookies, cookies);
-      if (runEval) rootScope.$apply();
+      if (runEval) $rootScope.$apply();
     }
   })();
 
@@ -36,7 +35,7 @@ angularServiceInject('$cookies', function($browser) {
   //at the end of each eval, push cookies
   //TODO: this should happen before the "delayed" watches fire, because if some cookies are not
   //      strings or browser refuses to store some cookies, we update the model in the push fn.
-  this.$watch(push);
+  $rootScope.$watch(push);
 
   return cookies;
 
@@ -90,4 +89,4 @@ angularServiceInject('$cookies', function($browser) {
       }
     }
   }
-}, ['$browser']);
+}, ['$rootScope', '$browser']);

src/service/defer.js

@@ -28,12 +28,10 @@
  * @param {*} deferId Token returned by the `$defer` function.
  * @returns {boolean} Returns `true` if the task hasn't executed yet and was successfuly canceled.
  */
-angularServiceInject('$defer', function($browser) {
-  var scope = this;
-
+angularServiceInject('$defer', function($rootScope, $browser) {
   function defer(fn, delay) {
     return $browser.defer(function() {
-      scope.$apply(fn);
+      $rootScope.$apply(fn);
     }, delay);
   }
 
@@ -42,4 +40,4 @@ angularServiceInject('$defer', function($browser) {
   };
 
   return defer;
-}, ['$browser']);
+}, ['$rootScope', '$browser']);

src/service/formFactory.js

@@ -96,7 +96,7 @@
       </doc:scenario>
     </doc:example>
  */
-angularServiceInject('$formFactory', function() {
+angularServiceInject('$formFactory', function($rootScope) {
 
 
   /**
@@ -109,7 +109,7 @@ angularServiceInject('$formFactory', function() {
    * Each application ({@link guide/dev_guide.scopes.internals root scope}) gets a root form which
    * is the top-level parent of all forms.
    */
-  formFactory.rootForm = formFactory(this);
+  formFactory.rootForm = formFactory($rootScope);
 
 
   /**
@@ -132,7 +132,7 @@ angularServiceInject('$formFactory', function() {
     return (parent || formFactory.rootForm).$new(FormController);
   }
 
-});
+}, ['$rootScope']);
 
 function propertiesUpdate(widget) {
   widget.$valid = !(widget.$invalid =

src/service/location.js

@@ -419,8 +419,8 @@ function locationGetterSetter(property, preprocess) {
  *
  * For more information see {@link guide/dev_guide.services.$location Developer Guide: Angular Services: Using $location}
  */
-angularServiceInject('$location', function($browser, $sniffer, $locationConfig, $document) {
-  var scope = this, currentUrl,
+angularServiceInject('$location', function($rootScope, $browser, $sniffer, $locationConfig, $document) {
+  var currentUrl,
       basePath = $browser.baseHref() || '/',
       pathPrefix = pathPrefixFromBase(basePath),
       hashPrefix = $locationConfig.hashPrefix || '',
@@ -464,7 +464,7 @@ angularServiceInject('$location', function($browser, $sniffer, $locationConfig,
       href = href.indexOf(pathPrefix) === 0 ? href.substr(pathPrefix.length) : href;
 
       currentUrl.url(href);
-      scope.$apply();
+      $rootScope.$apply();
       event.preventDefault();
       // hack to work around FF6 bug 684208 when scenario runner clicks on links
       window.angular['ff-684208-preventDefault'] = true;
@@ -482,16 +482,16 @@ angularServiceInject('$location', function($browser, $sniffer, $locationConfig,
   $browser.onUrlChange(function(newUrl) {
     if (currentUrl.absUrl() != newUrl) {
       currentUrl.$$parse(newUrl);
-      scope.$apply();
+      $rootScope.$apply();
     }
   });
 
   // update browser
   var changeCounter = 0;
-  scope.$watch(function() {
+  $rootScope.$watch(function() {
     if ($browser.url() != currentUrl.absUrl()) {
       changeCounter++;
-      scope.$evalAsync(function() {
+      $rootScope.$evalAsync(function() {
         $browser.url(currentUrl.absUrl(), currentUrl.$$replace);
         currentUrl.$$replace = false;
       });
@@ -501,7 +501,7 @@ angularServiceInject('$location', function($browser, $sniffer, $locationConfig,
   });
 
   return currentUrl;
-}, ['$browser', '$sniffer', '$locationConfig', '$document']);
+}, ['$rootScope', '$browser', '$sniffer', '$locationConfig', '$document']);
 
 
 angular.service('$locationConfig', function() {

src/service/route.js

@@ -62,7 +62,7 @@
       </doc:scenario>
     </doc:example>
  */
-angularServiceInject('$route', function($location, $routeParams) {
+angularServiceInject('$route', function($rootScope, $location, $routeParams) {
   /**
    * @ngdoc event
    * @name angular.service.$route#$beforeRouteChange
@@ -112,8 +112,7 @@ angularServiceInject('$route', function($location, $routeParams) {
 
   var routes = {},
       matcher = switchRouteMatcher,
-      parentScope = this,
-      rootScope = this,
+      parentScope = $rootScope,
       dirty = 0,
       forceReload = false,
       $route = {
@@ -220,7 +219,7 @@ angularServiceInject('$route', function($location, $routeParams) {
         }
       };
 
-  this.$watch(function() { return dirty + $location.url(); }, updateRoute);
+  $rootScope.$watch(function() { return dirty + $location.url(); }, updateRoute);
 
   return $route;
 
@@ -262,7 +261,7 @@ angularServiceInject('$route', function($location, $routeParams) {
       last.scope && last.scope.$emit('$routeUpdate');
     } else {
       forceReload = false;
-      rootScope.$broadcast('$beforeRouteChange', next, last);
+      $rootScope.$broadcast('$beforeRouteChange', next, last);
       last && last.scope && last.scope.$destroy();
       $route.current = next;
       if (next) {
@@ -280,7 +279,7 @@ angularServiceInject('$route', function($location, $routeParams) {
           next.scope = parentScope.$new(Controller);
         }
       }
-      rootScope.$broadcast('$afterRouteChange', next, last);
+      $rootScope.$broadcast('$afterRouteChange', next, last);
     }
   }
 
@@ -323,4 +322,4 @@ angularServiceInject('$route', function($location, $routeParams) {
   }
 
 
-}, ['$location', '$routeParams']);
+}, ['$rootScope', '$location', '$routeParams']);