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

1 files changed, 331 insertions, 298 deletions

diff --git a/test/BinderSpec.js b/test/BinderSpec.js
index bdeed675..8938bd13 100644
--- a/test/BinderSpec.js
+++ b/test/BinderSpec.js
@@ -2,23 +2,14 @@
 
 describe('Binder', function() {
   beforeEach(function() {
-    var self = this;
-
-    this.compile = function(html, parent, logErrors) {
-      if (self.element) dealoc(self.element);
-      var element;
-      if (parent) {
-        parent.html(html);
-        element = parent.children();
-      } else {
-        element = jqLite(html);
-      }
-      self.element = element;
-      return angular.compile(element)(angular.scope(null,
-              logErrors ? {'$exceptionHandler': $exceptionHandlerMockFactory()} : null));
-    };
     this.compileToHtml = function (content) {
-      return sortedHtml(this.compile(content).$element);
+      var html;
+      inject(function($rootScope){
+        content = jqLite(content);
+        angular.compile(content)($rootScope);
+        html = sortedHtml(content);
+      }).call(this);
+      return html;
     };
   });
 
@@ -28,36 +19,39 @@ describe('Binder', function() {
     }
   });
 
-  it('BindUpdate', function() {
-    var scope = this.compile('<div ng:init="a=123"/>');
-    scope.$digest();
-    assertEquals(123, scope.a);
-  });
+  it('BindUpdate', inject(function($rootScope) {
+    angular.compile('<div ng:init="a=123"/>')($rootScope);
+    $rootScope.$digest();
+    assertEquals(123, $rootScope.a);
+  }));
 
-  it('ExecuteInitialization', function() {
-    var scope = this.compile('<div ng:init="a=123">');
-    assertEquals(scope.a, 123);
-  });
+  it('ExecuteInitialization', inject(function($rootScope) {
+    angular.compile('<div ng:init="a=123">')($rootScope);
+    assertEquals($rootScope.a, 123);
+  }));
 
-  it('ExecuteInitializationStatements', function() {
-    var scope = this.compile('<div ng:init="a=123;b=345">');
-    assertEquals(scope.a, 123);
-    assertEquals(scope.b, 345);
-  });
+  it('ExecuteInitializationStatements', inject(function($rootScope) {
+    angular.compile('<div ng:init="a=123;b=345">')($rootScope);
+    assertEquals($rootScope.a, 123);
+    assertEquals($rootScope.b, 345);
+  }));
 
-  it('ApplyTextBindings', function() {
-    var scope = this.compile('<div ng:bind="model.a">x</div>');
-    scope.model = {a:123};
-    scope.$apply();
-    assertEquals('123', scope.$element.text());
+  it('ApplyTextBindings', inject(function($rootScope) {
+    var element = angular.compile('<div ng:bind="model.a">x</div>')($rootScope);
+    $rootScope.model = {a:123};
+    $rootScope.$apply();
+    assertEquals('123', element.text());
+  }));
+
+  it('ReplaceBindingInTextWithSpan preserve surounding text', function() {
+    assertEquals(this.compileToHtml("<b>a{{b}}c</b>"), '<b>a<span ng:bind="b"></span>c</b>');
   });
 
   it('ReplaceBindingInTextWithSpan', function() {
-    assertEquals(this.compileToHtml("<b>a{{b}}c</b>"), '<b>a<span ng:bind="b"></span>c</b>');
     assertEquals(this.compileToHtml("<b>{{b}}</b>"), '<b><span ng:bind="b"></span></b>');
   });
 
-  it('BindingSpaceConfusesIE', function() {
+  it('BindingSpaceConfusesIE', inject(function($rootScope) {
     if (!msie) return;
     var span = document.createElement("span");
     span.innerHTML = '&nbsp;';
@@ -65,89 +59,90 @@ describe('Binder', function() {
     assertEquals(
         '<b><span ng:bind="a"></span><span>'+nbsp+'</span><span ng:bind="b"></span></b>',
         this.compileToHtml("<b>{{a}} {{b}}</b>"));
+    dealoc(($rootScope));
     assertEquals(
         '<b><span ng:bind="A"></span><span>'+nbsp+'x </span><span ng:bind="B"></span><span>'+nbsp+'(</span><span ng:bind="C"></span>)</b>',
         this.compileToHtml("<b>{{A}} x {{B}} ({{C}})</b>"));
-  });
+  }));
 
-  it('BindingOfAttributes', function() {
-    var scope = this.compile("<a href='http://s/a{{b}}c' foo='x'></a>");
-    var attrbinding = scope.$element.attr("ng:bind-attr");
+  it('BindingOfAttributes', inject(function($rootScope) {
+    var element = angular.compile("<a href='http://s/a{{b}}c' foo='x'></a>")($rootScope);
+    var attrbinding = element.attr("ng:bind-attr");
     var bindings = fromJson(attrbinding);
     assertEquals("http://s/a{{b}}c", decodeURI(bindings.href));
     assertTrue(!bindings.foo);
-  });
+  }));
 
-  it('MarkMultipleAttributes', function() {
-    var scope = this.compile('<a href="http://s/a{{b}}c" foo="{{d}}"></a>');
-    var attrbinding = scope.$element.attr("ng:bind-attr");
+  it('MarkMultipleAttributes', inject(function($rootScope) {
+    var element = angular.compile('<a href="http://s/a{{b}}c" foo="{{d}}"></a>')($rootScope);
+    var attrbinding = element.attr("ng:bind-attr");
     var bindings = fromJson(attrbinding);
     assertEquals(bindings.foo, "{{d}}");
     assertEquals(decodeURI(bindings.href), "http://s/a{{b}}c");
-  });
+  }));
 
-  it('AttributesNoneBound', function() {
-    var scope = this.compile("<a href='abc' foo='def'></a>");
-    var a = scope.$element;
+  it('AttributesNoneBound', inject(function($rootScope) {
+    var a = angular.compile("<a href='abc' foo='def'></a>")($rootScope);
     assertEquals(a[0].nodeName, "A");
     assertTrue(!a.attr("ng:bind-attr"));
-  });
+  }));
 
-  it('ExistingAttrbindingIsAppended', function() {
-    var scope = this.compile("<a href='http://s/{{abc}}' ng:bind-attr='{\"b\":\"{{def}}\"}'></a>");
-    var a = scope.$element;
+  it('ExistingAttrbindingIsAppended', inject(function($rootScope) {
+    var a = angular.compile("<a href='http://s/{{abc}}' ng:bind-attr='{\"b\":\"{{def}}\"}'></a>")($rootScope);
     assertEquals('{"b":"{{def}}","href":"http://s/{{abc}}"}', a.attr('ng:bind-attr'));
-  });
+  }));
 
-  it('AttributesAreEvaluated', function() {
-    var scope = this.compile('<a ng:bind-attr=\'{"a":"a", "b":"a+b={{a+b}}"}\'></a>');
-    scope.$eval('a=1;b=2');
-    scope.$apply();
-    var a = scope.$element;
+  it('AttributesAreEvaluated', inject(function($rootScope) {
+    var a = angular.compile('<a ng:bind-attr=\'{"a":"a", "b":"a+b={{a+b}}"}\'></a>')($rootScope);
+    $rootScope.$eval('a=1;b=2');
+    $rootScope.$apply();
     assertEquals(a.attr('a'), 'a');
     assertEquals(a.attr('b'), 'a+b=3');
-  });
+  }));
 
-  it('InputTypeButtonActionExecutesInScope', function() {
+  it('InputTypeButtonActionExecutesInScope', inject(function($rootScope) {
     var savedCalled = false;
-    var scope = this.compile('<input type="button" ng:click="person.save()" value="Apply">');
-    scope.person = {};
-    scope.person.save = function() {
+    var element = angular.compile(
+      '<input type="button" ng:click="person.save()" value="Apply">')($rootScope);
+    $rootScope.person = {};
+    $rootScope.person.save = function() {
       savedCalled = true;
     };
-    browserTrigger(scope.$element, 'click');
+    browserTrigger(element, 'click');
     assertTrue(savedCalled);
-  });
+  }));
 
-  it('InputTypeButtonActionExecutesInScope2', function() {
+  it('InputTypeButtonActionExecutesInScope2', inject(function($rootScope) {
     var log = "";
-    var scope = this.compile('<input type="image" ng:click="action()">');
-    scope.action = function() {
+    var element = angular.compile('<input type="image" ng:click="action()">')($rootScope);
+    $rootScope.action = function() {
       log += 'click;';
     };
     expect(log).toEqual('');
-    browserTrigger(scope.$element, 'click');
+    browserTrigger(element, 'click');
     expect(log).toEqual('click;');
-  });
+  }));
 
-  it('ButtonElementActionExecutesInScope', function() {
+  it('ButtonElementActionExecutesInScope', inject(function($rootScope) {
     var savedCalled = false;
-    var scope = this.compile('<button ng:click="person.save()">Apply</button>');
-    scope.person = {};
-    scope.person.save = function() {
+    var element = angular.compile('<button ng:click="person.save()">Apply</button>')($rootScope);
+    $rootScope.person = {};
+    $rootScope.person.save = function() {
       savedCalled = true;
     };
-    browserTrigger(scope.$element, 'click');
+    browserTrigger(element, 'click');
     assertTrue(savedCalled);
-  });
+  }));
 
-  it('RepeaterUpdateBindings', function() {
-    var scope = this.compile('<ul><LI ng:repeat="item in model.items" ng:bind="item.a"/></ul>');
-    var form = scope.$element;
+  it('RepeaterUpdateBindings', inject(function($rootScope) {
+    var form = angular.compile(
+      '<ul>' +
+        '<LI ng:repeat="item in model.items" ng:bind="item.a"></LI>' +
+      '</ul>')($rootScope);
     var items = [{a:"A"}, {a:"B"}];
-    scope.model = {items:items};
+    $rootScope.model = {items:items};
 
-    scope.$apply();
+    $rootScope.$apply();
     assertEquals('<ul>' +
           '<#comment></#comment>' +
           '<li ng:bind="item.a">A</li>' +
@@ -155,7 +150,7 @@ describe('Binder', function() {
           '</ul>', sortedHtml(form));
 
     items.unshift({a:'C'});
-    scope.$apply();
+    $rootScope.$apply();
     assertEquals('<ul>' +
           '<#comment></#comment>' +
           '<li ng:bind="item.a">C</li>' +
@@ -164,7 +159,7 @@ describe('Binder', function() {
           '</ul>', sortedHtml(form));
 
     items.shift();
-    scope.$apply();
+    $rootScope.$apply();
     assertEquals('<ul>' +
           '<#comment></#comment>' +
           '<li ng:bind="item.a">A</li>' +
@@ -173,100 +168,113 @@ describe('Binder', function() {
 
     items.shift();
     items.shift();
-    scope.$apply();
-  });
-
-  it('RepeaterContentDoesNotBind', function() {
-    var scope = this.compile('<ul><LI ng:repeat="item in model.items"><span ng:bind="item.a"></span></li></ul>');
-    scope.model = {items:[{a:"A"}]};
-    scope.$apply();
+    $rootScope.$apply();
+  }));
+
+  it('RepeaterContentDoesNotBind', inject(function($rootScope) {
+    var element = angular.compile(
+      '<ul>' +
+        '<LI ng:repeat="item in model.items"><span ng:bind="item.a"></span></li>' +
+      '</ul>')($rootScope);
+    $rootScope.model = {items:[{a:"A"}]};
+    $rootScope.$apply();
     assertEquals('<ul>' +
           '<#comment></#comment>' +
           '<li><span ng:bind="item.a">A</span></li>' +
-          '</ul>', sortedHtml(scope.$element));
-  });
+          '</ul>', sortedHtml(element));
+  }));
 
   it('DoNotOverwriteCustomAction', function() {
     var html = this.compileToHtml('<input type="submit" value="Save" action="foo();">');
     assertTrue(html.indexOf('action="foo();"') > 0 );
   });
 
-  it('RepeaterAdd', function() {
-    var scope = this.compile('<div><input type="text" ng:model="item.x" ng:repeat="item in items"></div>');
-    scope.items = [{x:'a'}, {x:'b'}];
-    scope.$apply();
-    var first = childNode(scope.$element, 1);
-    var second = childNode(scope.$element, 2);
+  it('RepeaterAdd', inject(function($rootScope) {
+    var element = angular.compile('<div><input type="text" ng:model="item.x" ng:repeat="item in items"></div>')($rootScope);
+    $rootScope.items = [{x:'a'}, {x:'b'}];
+    $rootScope.$apply();
+    var first = childNode(element, 1);
+    var second = childNode(element, 2);
     expect(first.val()).toEqual('a');
     expect(second.val()).toEqual('b');
 
     first.val('ABC');
     browserTrigger(first, 'keydown');
-    scope.$service('$browser').defer.flush();
-    expect(scope.items[0].x).toEqual('ABC');
-  });
+    $rootScope.$service('$browser').defer.flush();
+    expect($rootScope.items[0].x).toEqual('ABC');
+  }));
 
-  it('ItShouldRemoveExtraChildrenWhenIteratingOverHash', function() {
-    var scope = this.compile('<div><div ng:repeat="i in items">{{i}}</div></div>');
+  it('ItShouldRemoveExtraChildrenWhenIteratingOverHash', inject(function($rootScope) {
+    var element = angular.compile('<div><div ng:repeat="i in items">{{i}}</div></div>')($rootScope);
     var items = {};
-    scope.items = items;
+    $rootScope.items = items;
 
-    scope.$apply();
-    expect(scope.$element[0].childNodes.length - 1).toEqual(0);
+    $rootScope.$apply();
+    expect(element[0].childNodes.length - 1).toEqual(0);
 
     items.name = "misko";
-    scope.$apply();
-    expect(scope.$element[0].childNodes.length - 1).toEqual(1);
+    $rootScope.$apply();
+    expect(element[0].childNodes.length - 1).toEqual(1);
 
     delete items.name;
-    scope.$apply();
-    expect(scope.$element[0].childNodes.length - 1).toEqual(0);
-  });
-
-  it('IfTextBindingThrowsErrorDecorateTheSpan', function() {
-    var scope = this.compile('<div>{{error.throw()}}</div>', null, true);
-    var errorLogs = scope.$service('$exceptionHandler').errors;
-
-    scope.error = {
-        'throw': function() {throw "ErrorMsg1";}
-    };
-    scope.$apply();
-
-    scope.error['throw'] = function() {throw "MyError";};
-    errorLogs.length = 0;
-    scope.$apply();
-    assertEquals(['MyError'], errorLogs.shift());
-
-    scope.error['throw'] = function() {return "ok";};
-    scope.$apply();
-    assertEquals(0, errorLogs.length);
-  });
-
-  it('IfAttrBindingThrowsErrorDecorateTheAttribute', function() {
-    var scope = this.compile('<div attr="before {{error.throw()}} after"></div>', null, true);
-    var errorLogs = scope.$service('$exceptionHandler').errors;
+    $rootScope.$apply();
+    expect(element[0].childNodes.length - 1).toEqual(0);
+  }));
+
+  it('IfTextBindingThrowsErrorDecorateTheSpan', inject(
+    function(service){
+      service('$exceptionHandler', $exceptionHandlerMockFactory);
+    },
+    function($rootScope, $exceptionHandler) {
+      angular.compile('<div>{{error.throw()}}</div>', null, true)($rootScope);
+      var errorLogs = $exceptionHandler.errors;
+
+      $rootScope.error = {
+          'throw': function() {throw "ErrorMsg1";}
+      };
+      $rootScope.$apply();
+
+      $rootScope.error['throw'] = function() {throw "MyError";};
+      errorLogs.length = 0;
+      $rootScope.$apply();
+      assertEquals(['MyError'], errorLogs.shift());
+
+      $rootScope.error['throw'] = function() {return "ok";};
+      $rootScope.$apply();
+      assertEquals(0, errorLogs.length);
+    })
+  );
+
+  it('IfAttrBindingThrowsErrorDecorateTheAttribute', inject(function(service){
+    service('$exceptionHandler', $exceptionHandlerMockFactory);
+  }, function($rootScope, $exceptionHandler) {
+    angular.compile('<div attr="before {{error.throw()}} after"></div>', null, true)($rootScope);
+    var errorLogs = $exceptionHandler.errors;
     var count = 0;
 
-    scope.error = {
+    $rootScope.error = {
         'throw': function() {throw new Error("ErrorMsg" + (++count));}
     };
-    scope.$apply();
+    $rootScope.$apply();
     expect(errorLogs.length).not.toEqual(0);
     expect(errorLogs.shift()).toMatch(/ErrorMsg1/);
     errorLogs.length = 0;
 
-    scope.error['throw'] =  function() { return 'X';};
-    scope.$apply();
+    $rootScope.error['throw'] =  function() { return 'X';};
+    $rootScope.$apply();
     expect(errorLogs.length).toMatch(0);
-  });
+  }));
 
-  it('NestedRepeater', function() {
-    var scope = this.compile('<div><div ng:repeat="m in model" name="{{m.name}}">' +
-                     '<ul name="{{i}}" ng:repeat="i in m.item"></ul>' +
-                   '</div></div>');
+  it('NestedRepeater', inject(function($rootScope) {
+    var element = angular.compile(
+      '<div>' +
+        '<div ng:repeat="m in model" name="{{m.name}}">' +
+           '<ul name="{{i}}" ng:repeat="i in m.item"></ul>' +
+        '</div>' +
+      '</div>')($rootScope);
 
-    scope.model = [{name:'a', item:['a1', 'a2']}, {name:'b', item:['b1', 'b2']}];
-    scope.$apply();
+    $rootScope.model = [{name:'a', item:['a1', 'a2']}, {name:'b', item:['b1', 'b2']}];
+    $rootScope.$apply();
 
     assertEquals('<div>'+
         '<#comment></#comment>'+
@@ -279,143 +287,154 @@ describe('Binder', function() {
           '<#comment></#comment>'+
           '<ul name="b1" ng:bind-attr="{"name":"{{i}}"}"></ul>'+
           '<ul name="b2" ng:bind-attr="{"name":"{{i}}"}"></ul>'+
-        '</div></div>', sortedHtml(scope.$element));
-  });
+        '</div></div>', sortedHtml(element));
+  }));
 
-  it('HideBindingExpression', function() {
-    var scope = this.compile('<div ng:hide="hidden == 3"/>');
+  it('HideBindingExpression', inject(function($rootScope) {
+    var element = angular.compile('<div ng:hide="hidden == 3"/>')($rootScope);
 
-    scope.hidden = 3;
-    scope.$apply();
+    $rootScope.hidden = 3;
+    $rootScope.$apply();
 
-    assertHidden(scope.$element);
+    assertHidden(element);
 
-    scope.hidden = 2;
-    scope.$apply();
+    $rootScope.hidden = 2;
+    $rootScope.$apply();
 
-    assertVisible(scope.$element);
-  });
+    assertVisible(element);
+  }));
 
-  it('HideBinding', function() {
-    var scope = this.compile('<div ng:hide="hidden"/>');
+  it('HideBinding', inject(function($rootScope) {
+    var element = angular.compile('<div ng:hide="hidden"/>')($rootScope);
 
-    scope.hidden = 'true';
-    scope.$apply();
+    $rootScope.hidden = 'true';
+    $rootScope.$apply();
 
-    assertHidden(scope.$element);
+    assertHidden(element);
 
-    scope.hidden = 'false';
-    scope.$apply();
+    $rootScope.hidden = 'false';
+    $rootScope.$apply();
 
-    assertVisible(scope.$element);
+    assertVisible(element);
 
-    scope.hidden = '';
-    scope.$apply();
+    $rootScope.hidden = '';
+    $rootScope.$apply();
 
-    assertVisible(scope.$element);
-  });
+    assertVisible(element);
+  }));
 
-  it('ShowBinding', function() {
-    var scope = this.compile('<div ng:show="show"/>');
+  it('ShowBinding', inject(function($rootScope) {
+    var element = angular.compile('<div ng:show="show"/>')($rootScope);
 
-    scope.show = 'true';
-    scope.$apply();
+    $rootScope.show = 'true';
+    $rootScope.$apply();
 
-    assertVisible(scope.$element);
+    assertVisible(element);
 
-    scope.show = 'false';
-    scope.$apply();
+    $rootScope.show = 'false';
+    $rootScope.$apply();
 
-    assertHidden(scope.$element);
+    assertHidden(element);
 
-    scope.show = '';
-    scope.$apply();
+    $rootScope.show = '';
+    $rootScope.$apply();
 
-    assertHidden(scope.$element);
-  });
+    assertHidden(element);
+  }));
 
 
-  it('BindClass', function() {
-    var scope = this.compile('<div ng:class="clazz"/>');
+  it('BindClass', inject(function($rootScope) {
+    var element = angular.compile('<div ng:class="clazz"/>')($rootScope);
 
-    scope.clazz = 'testClass';
-    scope.$apply();
+    $rootScope.clazz = 'testClass';
+    $rootScope.$apply();
 
-    assertEquals('<div class="testClass" ng:class="clazz"></div>', sortedHtml(scope.$element));
+    assertEquals('<div class="testClass" ng:class="clazz"></div>', sortedHtml(element));
 
-    scope.clazz = ['a', 'b'];
-    scope.$apply();
+    $rootScope.clazz = ['a', 'b'];
+    $rootScope.$apply();
 
-    assertEquals('<div class="a b" ng:class="clazz"></div>', sortedHtml(scope.$element));
-  });
+    assertEquals('<div class="a b" ng:class="clazz"></div>', sortedHtml(element));
+  }));
 
-  it('BindClassEvenOdd', function() {
-    var scope = this.compile('<div><div ng:repeat="i in [0,1]" ng:class-even="\'e\'" ng:class-odd="\'o\'"></div></div>');
-    scope.$apply();
-    var d1 = jqLite(scope.$element[0].childNodes[1]);
-    var d2 = jqLite(scope.$element[0].childNodes[2]);
+  it('BindClassEvenOdd', inject(function($rootScope) {
+    var element = angular.compile(
+      '<div>' +
+        '<div ng:repeat="i in [0,1]" ng:class-even="\'e\'" ng:class-odd="\'o\'"></div>' +
+      '</div>')($rootScope);
+    $rootScope.$apply();
+    var d1 = jqLite(element[0].childNodes[1]);
+    var d2 = jqLite(element[0].childNodes[2]);
     expect(d1.hasClass('o')).toBeTruthy();
     expect(d2.hasClass('e')).toBeTruthy();
     assertEquals(
         '<div><#comment></#comment>' +
         '<div class="o" ng:class-even="\'e\'" ng:class-odd="\'o\'"></div>' +
         '<div class="e" ng:class-even="\'e\'" ng:class-odd="\'o\'"></div></div>',
-        sortedHtml(scope.$element));
-  });
-
-  it('BindStyle', function() {
-    var scope = this.compile('<div ng:style="style"/>');
-
-    scope.$eval('style={height: "10px"}');
-    scope.$apply();
-
-    assertEquals("10px", scope.$element.css('height'));
-
-    scope.$eval('style={}');
-    scope.$apply();
-  });
-
-  it('ActionOnAHrefThrowsError', function() {
-    var scope = this.compile('<a ng:click="action()">Add Phone</a>', null, true);
-    scope.action = function() {
-      throw new Error('MyError');
-    };
-    var input = scope.$element;
-    browserTrigger(input, 'click');
-    expect(scope.$service('$exceptionHandler').errors[0]).toMatch(/MyError/);
-  });
-
-  it('ShoulIgnoreVbNonBindable', function() {
-    var scope = this.compile("<div>{{a}}" +
+        sortedHtml(element));
+  }));
+
+  it('BindStyle', inject(function($rootScope) {
+    var element = angular.compile('<div ng:style="style"/>')($rootScope);
+
+    $rootScope.$eval('style={height: "10px"}');
+    $rootScope.$apply();
+
+    assertEquals("10px", element.css('height'));
+
+    $rootScope.$eval('style={}');
+    $rootScope.$apply();
+  }));
+
+  it('ActionOnAHrefThrowsError', inject(
+    function(service){
+      service('$exceptionHandler', $exceptionHandlerMockFactory);
+    },
+    function($rootScope, $exceptionHandler) {
+      var input = angular.compile('<a ng:click="action()">Add Phone</a>')($rootScope);
+      $rootScope.action = function() {
+        throw new Error('MyError');
+      };
+      browserTrigger(input, 'click');
+      expect($exceptionHandler.errors[0]).toMatch(/MyError/);
+    })
+  );
+
+  it('ShoulIgnoreVbNonBindable', inject(function($rootScope) {
+    var element = angular.compile(
+      "<div>{{a}}" +
         "<div ng:non-bindable>{{a}}</div>" +
         "<div ng:non-bindable=''>{{b}}</div>" +
-        "<div ng:non-bindable='true'>{{c}}</div></div>");
-    scope.a = 123;
-    scope.$apply();
-    assertEquals('123{{a}}{{b}}{{c}}', scope.$element.text());
-  });
+        "<div ng:non-bindable='true'>{{c}}</div>" +
+      "</div>")($rootScope);
+    $rootScope.a = 123;
+    $rootScope.$apply();
+    assertEquals('123{{a}}{{b}}{{c}}', element.text());
+  }));
+
+  it('ShouldTemplateBindPreElements', inject(function ($rootScope) {
+    var element = angular.compile('<pre>Hello {{name}}!</pre>')($rootScope);
+    $rootScope.name = "World";
+    $rootScope.$apply();
 
-  it('ShouldTemplateBindPreElements', function () {
-    var scope = this.compile('<pre>Hello {{name}}!</pre>');
-    scope.name = "World";
-    scope.$apply();
-
-    assertEquals('<pre ng:bind-template="Hello {{name}}!">Hello World!</pre>', sortedHtml(scope.$element));
-  });
+    assertEquals(
+      '<pre ng:bind-template="Hello {{name}}!">Hello World!</pre>',
+      sortedHtml(element));
+  }));
 
-  it('FillInOptionValueWhenMissing', function() {
-    var scope = this.compile(
+  it('FillInOptionValueWhenMissing', inject(function($rootScope) {
+    var element = angular.compile(
         '<select ng:model="foo">' +
           '<option selected="true">{{a}}</option>' +
           '<option value="">{{b}}</option>' +
           '<option>C</option>' +
-        '</select>');
-    scope.a = 'A';
-    scope.b = 'B';
-    scope.$apply();
-    var optionA = childNode(scope.$element, 0);
-    var optionB = childNode(scope.$element, 1);
-    var optionC = childNode(scope.$element, 2);
+        '</select>')($rootScope);
+    $rootScope.a = 'A';
+    $rootScope.b = 'B';
+    $rootScope.$apply();
+    var optionA = childNode(element, 0);
+    var optionB = childNode(element, 1);
+    var optionC = childNode(element, 2);
 
     expect(optionA.attr('value')).toEqual('A');
     expect(optionA.text()).toEqual('A');
@@ -425,19 +444,21 @@ describe('Binder', function() {
 
     expect(optionC.attr('value')).toEqual('C');
     expect(optionC.text()).toEqual('C');
-  });
+  }));
 
-  it('DeleteAttributeIfEvaluatesFalse', function() {
-    var scope = this.compile('<div>' +
+  it('DeleteAttributeIfEvaluatesFalse', inject(function($rootScope) {
+    var element = angular.compile(
+      '<div>' +
         '<input ng:model="a0" ng:bind-attr="{disabled:\'{{true}}\'}">' +
         '<input ng:model="a1" ng:bind-attr="{disabled:\'{{false}}\'}">' +
         '<input ng:model="b0" ng:bind-attr="{disabled:\'{{1}}\'}">' +
         '<input ng:model="b1" ng:bind-attr="{disabled:\'{{0}}\'}">' +
         '<input ng:model="c0" ng:bind-attr="{disabled:\'{{[0]}}\'}">' +
-        '<input ng:model="c1" ng:bind-attr="{disabled:\'{{[]}}\'}"></div>');
-    scope.$apply();
+        '<input ng:model="c1" ng:bind-attr="{disabled:\'{{[]}}\'}">' +
+      '</div>')($rootScope);
+    $rootScope.$apply();
     function assertChild(index, disabled) {
-      var child = childNode(scope.$element, index);
+      var child = childNode(element, index);
       assertEquals(sortedHtml(child), disabled, !!child.attr('disabled'));
     }
 
@@ -447,72 +468,84 @@ describe('Binder', function() {
     assertChild(3, false);
     assertChild(4, true);
     assertChild(5, false);
-  });
-
-  it('ItShouldDisplayErrorWhenActionIsSyntacticlyIncorrect', function() {
-    var scope = this.compile('<div>' +
-        '<input type="button" ng:click="greeting=\'ABC\'"/>' +
-        '<input type="button" ng:click=":garbage:"/></div>', null, true);
-    var first = jqLite(scope.$element[0].childNodes[0]);
-    var second = jqLite(scope.$element[0].childNodes[1]);
-    var errorLogs = scope.$service('$log').error.logs;
-
-    browserTrigger(first, 'click');
-    assertEquals("ABC", scope.greeting);
-    expect(errorLogs).toEqual([]);
-
-    browserTrigger(second, 'click');
-    expect(scope.$service('$exceptionHandler').errors[0]).
-      toMatchError(/Syntax Error: Token ':' not a primary expression/);
-  });
-
-  it('ItShouldSelectTheCorrectRadioBox', function() {
-    var scope = this.compile('<div>' +
+  }));
+
+  it('ItShouldDisplayErrorWhenActionIsSyntacticlyIncorrect', inject(
+    function(service){
+      service('$exceptionHandler', $exceptionHandlerMockFactory);
+    },
+    function($rootScope, $exceptionHandler, $log) {
+      var element = angular.compile(
+        '<div>' +
+          '<input type="button" ng:click="greeting=\'ABC\'"/>' +
+          '<input type="button" ng:click=":garbage:"/>' +
+        '</div>')($rootScope);
+      var first = jqLite(element.find('input')[0]);
+      var second = jqLite(element.find('input')[1]);
+      var errorLogs = $log.error.logs;
+
+      browserTrigger(first, 'click');
+      assertEquals("ABC", $rootScope.greeting);
+      expect(errorLogs).toEqual([]);
+
+      browserTrigger(second, 'click');
+      expect($exceptionHandler.errors[0]).
+        toMatchError(/Syntax Error: Token ':' not a primary expression/);
+    })
+  );
+
+  it('ItShouldSelectTheCorrectRadioBox', inject(function($rootScope) {
+    var element = angular.compile(
+      '<div>' +
         '<input type="radio" ng:model="sex" value="female">' +
-        '<input type="radio" ng:model="sex" value="male"></div>');
-    var female = jqLite(scope.$element[0].childNodes[0]);
-    var male = jqLite(scope.$element[0].childNodes[1]);
+        '<input type="radio" ng:model="sex" value="male">' +
+      '</div>')($rootScope);
+    var female = jqLite(element[0].childNodes[0]);
+    var male = jqLite(element[0].childNodes[1]);
 
     browserTrigger(female);
-    assertEquals("female", scope.sex);
+    assertEquals("female", $rootScope.sex);
     assertEquals(true, female[0].checked);
     assertEquals(false, male[0].checked);
     assertEquals("female", female.val());
 
     browserTrigger(male);
-    assertEquals("male", scope.sex);
+    assertEquals("male", $rootScope.sex);
     assertEquals(false, female[0].checked);
     assertEquals(true, male[0].checked);
     assertEquals("male", male.val());
-  });
-
-  it('ItShouldRepeatOnHashes', function() {
-    var scope = this.compile('<ul><li ng:repeat="(k,v) in {a:0,b:1}" ng:bind=\"k + v\"></li></ul>');
-    scope.$apply();
+  }));
+
+  it('ItShouldRepeatOnHashes', inject(function($rootScope) {
+    var element = angular.compile(
+      '<ul>' +
+        '<li ng:repeat="(k,v) in {a:0,b:1}" ng:bind=\"k + v\"></li>' +
+      '</ul>')($rootScope);
+    $rootScope.$apply();
     assertEquals('<ul>' +
         '<#comment></#comment>' +
         '<li ng:bind=\"k + v\">a0</li>' +
         '<li ng:bind=\"k + v\">b1</li>' +
         '</ul>',
-        sortedHtml(scope.$element));
-  });
-
-  it('ItShouldFireChangeListenersBeforeUpdate', function() {
-    var scope = this.compile('<div ng:bind="name"></div>');
-    scope.name = "";
-    scope.$watch("watched", "name=123");
-    scope.watched = "change";
-    scope.$apply();
-    assertEquals(123, scope.name);
+        sortedHtml(element));
+  }));
+
+  it('ItShouldFireChangeListenersBeforeUpdate', inject(function($rootScope) {
+    var element = angular.compile('<div ng:bind="name"></div>')($rootScope);
+    $rootScope.name = "";
+    $rootScope.$watch("watched", "name=123");
+    $rootScope.watched = "change";
+    $rootScope.$apply();
+    assertEquals(123, $rootScope.name);
     assertEquals(
         '<div ng:bind="name">123</div>',
-        sortedHtml(scope.$element));
-  });
-
-  it('ItShouldHandleMultilineBindings', function() {
-    var scope = this.compile('<div>{{\n 1 \n + \n 2 \n}}</div>');
-    scope.$apply();
-    assertEquals("3", scope.$element.text());
-  });
+        sortedHtml(element));
+  }));
+
+  it('ItShouldHandleMultilineBindings', inject(function($rootScope) {
+    var element = angular.compile('<div>{{\n 1 \n + \n 2 \n}}</div>')($rootScope);
+    $rootScope.$apply();
+    assertEquals("3", element.text());
+  }));
 
 });