Fix hashchange event on IE8 compatibility mode

vojtajina · IgorMinar · commit 50076b571da5 · 2011-06-02T10:50:39.000-07:00
Stupid IE8 in compatibility mode or in IE7 mode returns true for `('onhashchange' in window)`, but does not support hashchange event. Closes #353
diff --git a/regression/issue-353.html b/regression/issue-353.html
@@ -0,0 +1,18 @@
+<!DOCTYPE HTML>
+<html xmlns:ng="http://angularjs.org">
+  <script type="text/javascript" src="../build/angular.js" ng:autobind></script>
+  <script type="text/javascript">
+    function Cntl($route) {
+      $route.when('/item1', {});
+      $route.when('/item2', {});
+      $route.onChange(function() {
+        alert('change');
+      });
+    }
+    Cntl.$inject = ['$route'];
+  </script>
+  <body ng:controller="Cntl">
+	<a href="#/item1">test</a>
+	<a href="#/item2">test</a>
+  </body>
+</html>
diff --git a/src/Browser.js b/src/Browser.js
@@ -249,7 +249,9 @@ function Browser(window, document, body, XHR, $log) {
    * @return {function()} Returns the registered listener fn - handy if the fn is anonymous.
    */
   self.onHashChange = function(listener) {
-    if ('onhashchange' in window) {
+    // IE8 comp mode returns true, but doesn't support hashchange event
+    var dm = window.document.documentMode;
+    if ('onhashchange' in window && (isUndefined(dm) || dm >= 8)) {
       jqLite(window).bind('hashchange', listener);
     } else {
       var lastBrowserUrl = self.getUrl();
diff --git a/test/BrowserSpecs.js b/test/BrowserSpecs.js
@@ -418,7 +418,10 @@ describe('browser', function(){
     it('should use $browser poller to detect url changes when onhashchange event is unsupported',
         function() {
 
-      fakeWindow = {location: {href:"http://server"}};
+      fakeWindow = {
+        location: {href:"http://server"},
+        document: {}
+      };
 
       browser = new Browser(fakeWindow, {}, {});
 
@@ -455,7 +458,8 @@ describe('browser', function(){
                       onHashChngListener = listener;
                     },
                     removeEventListener: angular.noop,
-                    detachEvent: angular.noop
+                    detachEvent: angular.noop,
+                    document: {}
                    };
       fakeWindow.onhashchange = true;
 
@@ -479,5 +483,24 @@ describe('browser', function(){
         jqLite(fakeWindow).dealoc();
       }
     });
+
+    // asynchronous test
+    it('should fire onHashChange when location.hash change', function() {
+      var callback = jasmine.createSpy('onHashChange');
+      browser = new Browser(window, {}, {});
+      browser.onHashChange(callback);
+
+      window.location.hash = 'new-hash';
+      browser.startPoller(100, setTimeout);
+
+      waitsFor(function() {
+        return callback.callCount;
+      }, 'onHashChange callback to be called', 1000);
+
+      runs(function() {
+        if (!jQuery) jqLite(window).dealoc();
+        window.location.hash = '';
+      });
+    });
   });
 });
