Relative links treated like absolute links in html5Mode with legacy browsers in 1.2.12 #6162
Description
In legacy browsers such as IE9, relative links are treated like absolute links in html5mode.
E.g. in Chrome:
The link subdir/
from http://angular-relative-links.richardc.net/
goes to http://angular-relative-links.richardc.net/subdir/
and,
the link subdir/
from http://angular-relative-links.richardc.net/subdir/
goes to http://angular-relative-links.richardc.net/subdir/subdir/
...
As expected.
However In IE9:
The link subdir/
from http://angular-relative-links.richardc.net/
goes to http://angular-relative-links.richardc.net/#/subdir/
but,
the link subdir/
from http://angular-relative-links.richardc.net/#/subdir/
goes to http://angular-relative-links.richardc.net/#/subdir/
, i.e. it stays on the same page.
I have a minimal example to demonstrate this at: http://angular-relative-links.richardc.net/
To test this, you need IE9 (or presumably another legacy browser that does not support history.pushState). You can download a Windows WM with IE9 from Microsoft from here: http://www.modern.ie/en-us/virtualization-tools#downloads
Here is the source code of the minimal example:
<!doctype html>
<html ng-app="test">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.11/angular.min.js"></script>
<script>
angular.module('test', [])
.config(function ($locationProvider) {
$locationProvider.html5Mode(true);
})
.controller('MyCtrl', function($location) {
// empty controller using $location so location services runs
})
</script>
</head>
<body ng-controller="MyCtrl">
<div><a href="subdir/">subdir/</a></div>
</body>
</html>
Also in Chrome in html5mode hash links are treated as regular links when $location.path() is '/'. Click on the #hash on my test page http://angular-relative-links.richardc.net/ to see. When you click on #hash a second time it starts behaving as expected.