fix(a): handle SVGAElement differently from HTML anchor tag

Before this change, SVG elements without an 'href' attribute (but with an xlink:href attribute)
within the application would always have their click event preventDefault, due to the href
attribute being falsy.

This change fixes this by giving an SVGAElement a separate link function which is concerned with
the xlink:href attribute.

Closes angular#5896

src/ng/directive/a.js

@@ -32,7 +32,18 @@ var htmlAnchorDirective = valueFn({
       element.append(document.createComment('IE fix'));
     }
 
-    if (!attr.href && !attr.name) {
+    // SVGAElement does not use the href attribute, but rather the 'xlinkHref' attribute.
+    if (toString.call(element.prop('href')) === '[object SVGAnimatedString]') {
+      if (!attr.xlinkHref && !attr.name) {
+        return function(scope, element) {
+          element.on('click', function(event) {
+            if (!element.attr('xlink:href')) {
+              event.preventDefault();
+            }
+          });
+        }
+      }
+    } else if (!attr.href && !attr.name) {
       return function(scope, element) {
         element.on('click', function(event){
           // if we have no href url, then don't navigate anywhere.

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();
+      });
+    });
+  }
 });