aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorCaitlin Potter2014-01-20 11:21:50 -0500
committerCaitlin Potter2014-01-22 14:51:47 -0500
commite0209169bf1463465ad07484421620748a4d3908 (patch)
tree019e3863a8ae8fca21910f0073fdd2e418c5e503
parentb07afa0465b73c00e7f6d7a9479011360eb29b82 (diff)
downloadangular.js-e0209169bf1463465ad07484421620748a4d3908.tar.bz2
fix(a): don't preventDefault on click when SVGAElement has an xlink:href attribute
Before this change, an SVGAElement with an xlink:href attribute and no href or name attribute which was compiled by the angular HTML compiler would never be clickable, due to the htmlAnchorDirective calling event.preventDefault() due to the missing href attribute. This change corrects this behaviour by also testing the xlink:href attribute if the element in question is determined to be an SVG anchor tag (with the href property having type SVGAnimatedString) Closes #5896 Closes #5897
-rw-r--r--src/ng/directive/a.js7
-rw-r--r--test/ng/directive/aSpec.js67
2 files changed, 72 insertions, 2 deletions
diff --git a/src/ng/directive/a.js b/src/ng/directive/a.js
index fe50a79b..9887cba5 100644
--- a/src/ng/directive/a.js
+++ b/src/ng/directive/a.js
@@ -32,11 +32,14 @@ var htmlAnchorDirective = valueFn({
element.append(document.createComment('IE fix'));
}
- if (!attr.href && !attr.name) {
+ if (!attr.href && !attr.xlinkHref && !attr.name) {
return function(scope, element) {
+ // SVGAElement does not use the href attribute, but rather the 'xlinkHref' attribute.
+ var href = toString.call(element.prop('href')) === '[object SVGAnimatedString]' ?
+ 'xlink:href' : 'href';
element.on('click', function(event){
// if we have no href url, then don't navigate anywhere.
- if (!element.attr('href')) {
+ if (!element.attr(href)) {
event.preventDefault();
}
});
diff --git a/test/ng/directive/aSpec.js b/test/ng/directive/aSpec.js
index dc0de729..bd9f246d 100644
--- a/test/ng/directive/aSpec.js
+++ b/test/ng/directive/aSpec.js
@@ -84,4 +84,71 @@ describe('a', function() {
expect(jq.prototype.on).not.toHaveBeenCalled();
});
+
+
+ if (isDefined(window.SVGElement)) {
+ describe('SVGAElement', function() {
+ it('should prevent default action to be executed when href is empty', function() {
+ var orgLocation = document.location.href,
+ preventDefaultCalled = false,
+ event,
+ child;
+
+ element = $compile('<svg><a xlink:href="">empty link</a></svg>')($rootScope);
+ child = element.children('a');
+
+ if (msie < 9) {
+
+ event = document.createEventObject();
+ expect(event.returnValue).not.toBeDefined();
+ child[0].fireEvent('onclick', event);
+ expect(event.returnValue).toEqual(false);
+
+ } else {
+
+ event = document.createEvent('MouseEvent');
+ event.initMouseEvent(
+ 'click', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
+
+ event.preventDefaultOrg = event.preventDefault;
+ event.preventDefault = function() {
+ preventDefaultCalled = true;
+ if (this.preventDefaultOrg) this.preventDefaultOrg();
+ };
+
+ child[0].dispatchEvent(event);
+
+ expect(preventDefaultCalled).toEqual(true);
+ }
+
+ expect(document.location.href).toEqual(orgLocation);
+ });
+
+
+ it('should not link and hookup an event if xlink:href is present at compile', function() {
+ var jq = jQuery || jqLite;
+ element = jq('<svg><a xlink:href="bobby">hello@you</a></svg>');
+ var linker = $compile(element);
+
+ spyOn(jq.prototype, 'on');
+
+ linker($rootScope);
+
+ expect(jq.prototype.on).not.toHaveBeenCalled();
+ });
+
+
+ it('should not link and hookup an event if name is present at compile', function() {
+ var jq = jQuery || jqLite;
+ element = jq('<svg><a name="bobby">hello@you</a></svg>');
+ var linker = $compile(element);
+
+ spyOn(jq.prototype, 'on');
+
+ linker($rootScope);
+
+ expect(jq.prototype.on).not.toHaveBeenCalled();
+ });
+ });
+ }
});