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
This commit is contained in:
Igor Minar 2013-02-14 15:13:50 -08:00
parent 1ace5eb396
commit 37e8b12265
3 changed files with 34 additions and 9 deletions

View file

@ -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) {

View file

@ -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() {

View file

@ -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');
});
});