fix(a): workaround IE bug affecting mailto urls

Apparently there is a really weird bug in IE6-8 that causes anchor textContent
to be reset with href content when both contain @ symbol.

Inserting a bogus comment node into all anchor elements in IE works around this
browser bug.

I'm fixing the issue via directive because that way we'll fix it for jQuery as
well.

I fixed an e2e test too because it was incorrect.

Closes #1949

3 files changed, 34 insertions, 9 deletions

diff --git a/src/ng/directive/a.js b/src/ng/directive/a.js
index 9b6c67c9..7ee8f572 100644
--- a/src/ng/directive/a.js
+++ b/src/ng/directive/a.js
@@ -16,10 +16,20 @@
 var htmlAnchorDirective = valueFn({
   restrict: 'E',
   compile: function(element, attr) {
-    // turn <a href ng-click="..">link</a> into a link in IE
-    // but only if it doesn't have name attribute, in which case it's an anchor
-    if (!attr.href) {
-      attr.$set('href', '');
+
+    if (msie <= 8) {
+
+      // turn <a href ng-click="..">link</a> into a stylable link in IE
+      // but only if it doesn't have name attribute, in which case it's an anchor
+      if (!attr.href && !attr.name) {
+        attr.$set('href', '');
+      }
+
+      // add a comment node to anchors to workaround IE bug that causes element content to be reset
+      // to new attribute content if attribute is updated with value containing @ and element also
+      // contains value with @
+      // see issue #1949
+      element.append(document.createComment('IE fix'));
     }
 
     return function(scope, element) {
diff --git a/src/ng/directive/booleanAttrs.js b/src/ng/directive/booleanAttrs.js
index 8902c35d..80de41a4 100644
--- a/src/ng/directive/booleanAttrs.js
+++ b/src/ng/directive/booleanAttrs.js
@@ -66,7 +66,7 @@
         it('should execute ng-click but not reload when no href but name specified', function() {
           element('#link-5').click();
           expect(input('value').val()).toEqual('5');
-          expect(element('#link-5').attr('href')).toBe('');
+          expect(element('#link-5').attr('href')).toBe(undefined);
         });
 
         it('should only change url when only ng-href', function() {
diff --git a/test/ng/directive/aSpec.js b/test/ng/directive/aSpec.js
index 8aa2449d..a284f4bc 100644
--- a/test/ng/directive/aSpec.js
+++ b/test/ng/directive/aSpec.js
@@ -1,7 +1,13 @@
 'use strict';
 
 describe('a', function() {
-  var element;
+  var element, $compile, $rootScope;
+
+
+  beforeEach(inject(function(_$compile_, _$rootScope_) {
+    $compile = _$compile_;
+    $rootScope = _$rootScope_;
+  }));
 
 
   afterEach(function(){
@@ -9,8 +15,7 @@ describe('a', function() {
   });
 
 
-  it('should prevent default action to be executed when href is empty',
-      inject(function($rootScope, $compile) {
+  it('should prevent default action to be executed when href is empty', function() {
     var orgLocation = document.location.href,
         preventDefaultCalled = false,
         event;
@@ -42,5 +47,15 @@ describe('a', function() {
     }
 
     expect(document.location.href).toEqual(orgLocation);
-  }));
+  });
+
+
+  it('should prevent IE for changing text content when setting attribute', function() {
+    // see issue #1949
+    element = jqLite('<a href="">hello@you</a>');
+    $compile(element);
+    element.attr('href', 'bye@me');
+
+    expect(element.text()).toBe('hello@you');
+  });
 });