WIP - fix($anchorScroll): fix $digest lifecycle management in readystatechanged callback

Wrap the code inside of the listener callback in `$rootScope.$evalAsync()`
to execute inside the Angular context (plus some minor modifications in
the callback).
Also, modified the tests accordingly (introducing `$browser.defer.flush()`
where appropriate).
(Note: The tests pass consistently on Chrome and IE, but sometimes some
tests fail on Firefox (it could be 1 or more). Still working on it.)

Author: gkalpak

src/ng/anchorScroll.js

@@ -217,10 +217,10 @@ function $AnchorScrollProvider() {
         if (offset) {
           // `offset` is the number of pixels we should scroll up in order to align `elem` properly.
           // This is true ONLY if the call to `elem.scrollIntoView()` initially aligns `elem` at the
-          // top of the viewport. IF the number of pixels from the top of `elem` to the end of page's
-          // content is less than the height of the viewport, then `elem.scrollIntoView()` will NOT
-          // align the top of `elem` at the top of the viewport (but further down). This is often the
-          // case for elements near the bottom of the page.
+          // top of the viewport. IF the number of pixels from the top of `elem` to the end of the
+          // page's content is less than the height of the viewport, then `elem.scrollIntoView()`
+          // will NOT align the top of `elem` at the top of the viewport (but further down). This is
+          // often the case for elements near the bottom of the page.
           // In such cases we do not need to scroll the whole `offset` up, just the fraction of the
           // offset that is necessary to align the top of `elem` at the desired position.
           var elemTop = elem.getBoundingClientRect().top;
@@ -241,10 +241,15 @@ function $AnchorScrollProvider() {
       } else if (!scrollScheduled) {
         scrollScheduled = true;
         document.addEventListener('readystatechange', function unbindAndScroll() {
-          if (document.readyState === 'complete') {
-            document.removeEventListener('readystatechange', unbindAndScroll);
-            $rootScope.$evalAsync(scroll);
-          }
+          // When navigating to a page with a URL including a hash,
+          // Firefox overwrites our `yOffset` if `$apply()` is used instead.
+          $rootScope.$evalAsync(function() {
+            if (document.readyState === 'complete') {
+              scrollScheduled = false;
+              document.removeEventListener('readystatechange', unbindAndScroll);
+              scroll();
+            }
+          });
         });
       }
     }

test/ng/anchorScrollSpec.js

@@ -40,10 +40,13 @@ describe('$anchorScroll', function() {
   }
 
   function changeHashTo(hash) {
-    return function($anchorScroll, $location, $rootScope) {
+    return function($anchorScroll, $browser, $location, $rootScope) {
       $rootScope.$apply(function() {
         $location.hash(hash);
       });
+      if ($browser.deferredFns.length) {
+        $browser.defer.flush();
+      }
     };
   }
 
@@ -81,19 +84,12 @@ describe('$anchorScroll', function() {
   }
 
   function mockDocumentReadyState() {
-    var docMock = {
-      readyState: 'mocked',
-      updateReadyState: function(newState) {
-        this.readyState = newState;
-        this.dispatchFakeReadyStateChangeEvent();
-      }
-    };
-
+    var docMock = {};
     docSpies = {};
 
-    return function($rootScope, $window) {
-      var propsToMock = ['body', 'documentElement'];
-      var methodsToMock = [
+    return function($browser, $rootScope, $window) {
+      var propsToPassThrough = ['body', 'documentElement'];
+      var methodsToPassThrough = [
         'getElementById',
         'getElementsByName',
         'addEventListener',
@@ -102,19 +98,26 @@ describe('$anchorScroll', function() {
 
       var document_ = $window.document;
 
-      propsToMock.forEach(function(prop) {
+      propsToPassThrough.forEach(function(prop) {
         docMock[prop] = document_[prop];
       });
-      methodsToMock.forEach(function(method) {
+      methodsToPassThrough.forEach(function(method) {
         docMock[method] = document_[method].bind(document_);
         docSpies[method] = spyOn(docMock, method).andCallThrough();
       });
 
+      docMock.readyState = 'mocked';
       docMock.dispatchFakeReadyStateChangeEvent = function() {
         var evt = document.createEvent('Event');
         evt.initEvent('readystatechange', false, false);
         document_.dispatchEvent(evt);
-        $rootScope.$digest();
+      };
+      docMock.updateReadyState = function(newState) {
+        this.readyState = newState;
+        this.dispatchFakeReadyStateChangeEvent();
+        if ($browser.deferredFns.length) {
+          $browser.defer.flush();
+        }
       };
 
       $window.document = docMock;
@@ -218,7 +221,7 @@ describe('$anchorScroll', function() {
     expectScrollingTo('id=some1')));
 
 
-  it('should only register one execution for when `document.readyState === "complete"', inject(
+  it('should only register once for execution when `document.readyState === "complete"', inject(
     mockDocumentReadyState(),
     addElements('id=some1', 'id=some2'),
 
@@ -259,6 +262,20 @@ describe('$anchorScroll', function() {
     }));
 
 
+  it('should scroll immediately if `readyState === "complete"`', inject(
+    mockDocumentReadyState(),
+    addElements('id=some1'),
+
+    updateMockReadyState('complete'),
+    changeHashTo('some1'),
+
+    expectScrollingTo('id=some1'),
+    function() {
+      expect(docSpies.addEventListener.callCount).toBe(0);
+      expect(docSpies.removeEventListener.callCount).toBe(0);
+    }));
+
+
   describe('watcher', function() {
 
     function initLocation(config) {
@@ -356,7 +373,7 @@ describe('$anchorScroll', function() {
       var list = isArray(offsetList) ? offsetList : [offsetList];
 
       return function($window) {
-        expectScrollingTo(identifierCountMap)($window);
+        inject(expectScrollingTo(identifierCountMap));
         expect($window.scrollBy.callCount).toBe(list.length);
         forEach(list, function(offset, idx) {
           // Due to sub-pixel rendering, there is a +/-1 error margin in the actual offset