From baa3b4a02a1dd14e9c4906b763724a15d2a033c2 Mon Sep 17 00:00:00 2001
From: mohamed amr <m_ma7med@hotmail.com>
Date: Thu, 9 Feb 2017 06:41:03 +0200
Subject: [PATCH] feat(ngHref): bind href attribute to ng-href attribute in
 case SVG element

---
 src/ng/directive/attrs.js             | 12 ++++++++++--
 test/ng/directive/booleanAttrsSpec.js | 23 +++++++++++++++++++++--
 2 files changed, 31 insertions(+), 4 deletions(-)

diff --git a/src/ng/directive/attrs.js b/src/ng/directive/attrs.js
index 56d237da74b6..40db49ca0f81 100644
--- a/src/ng/directive/attrs.js
+++ b/src/ng/directive/attrs.js
@@ -399,6 +399,14 @@ forEach(ALIASED_ATTR, function(htmlAttr, ngAttr) {
   };
 });
 
+
+// Helper
+var updateAttribute = function(attr, name, value) {
+  attr.$set(name, value);
+  if (name === 'xlinkHref') {
+    attr.$set('href', value);
+  }
+};
 // ng-src, ng-srcset, ng-href are interpolated
 forEach(['src', 'srcset', 'href'], function(attrName) {
   var normalized = directiveNormalize('ng-' + attrName);
@@ -419,12 +427,12 @@ forEach(['src', 'srcset', 'href'], function(attrName) {
         attr.$observe(normalized, function(value) {
           if (!value) {
             if (attrName === 'href') {
-              attr.$set(name, null);
+              updateAttribute(attr, name, null);
             }
             return;
           }
 
-          attr.$set(name, value);
+          updateAttribute(attr, name, value);
 
           // Support: IE 9-11 only
           // On IE, if "ng:src" directive declaration is used and "src" attribute doesn't exist
diff --git a/test/ng/directive/booleanAttrsSpec.js b/test/ng/directive/booleanAttrsSpec.js
index b146c1aae705..2a216be01d2c 100644
--- a/test/ng/directive/booleanAttrsSpec.js
+++ b/test/ng/directive/booleanAttrsSpec.js
@@ -299,25 +299,44 @@ describe('ngHref', function() {
 
   if (isDefined(window.SVGElement)) {
     describe('SVGAElement', function() {
-      it('should interpolate the expression and bind to xlink:href', inject(function($compile, $rootScope) {
+      it('should interpolate the expression and bind to xlink:href and href', inject(function($compile, $rootScope) {
         element = $compile('<svg><a ng-href="some/{{id}}"></a></svg>')($rootScope);
         var child = element.children('a');
         $rootScope.$digest();
         expect(child.attr('xlink:href')).toEqual('some/');
+        expect(child.attr('href')).toEqual('some/');
 
         $rootScope.$apply(function() {
           $rootScope.id = 1;
         });
         expect(child.attr('xlink:href')).toEqual('some/1');
+        expect(child.attr('href')).toEqual('some/1');
       }));
 
 
-      it('should bind xlink:href even if no interpolation', inject(function($rootScope, $compile) {
+      it('should bind xlink:href and href even if no interpolation', inject(function($rootScope, $compile) {
         element = $compile('<svg><a ng-href="http://server"></a></svg>')($rootScope);
         var child = element.children('a');
         $rootScope.$digest();
         expect(child.attr('xlink:href')).toEqual('http://server');
+        expect(child.attr('href')).toEqual('http://server');
       }));
+
+      they('should set xlink:href and href to null when ng-href value is $prop', ['', 0, null, false, undefined],
+          function(value) {
+            var $compile, $rootScope;
+            inject(function(_$compile_, _$rootScope_) {
+              $compile = _$compile_;
+              $rootScope = _$rootScope_;
+            });
+
+            $rootScope.url = value;
+            element = $compile('<svg><a ng-href="{{url}}"></a></svg>')($rootScope);
+            var child = element.children('a');
+            expect(child.attr('xlink:href')).toBeUndefined();
+            expect(child.attr('href')).toBeUndefined();
+          }
+      );
     });
   }
 });