From 7d4b5b031a1432dc9cc01961344835ef61e20cc5 Mon Sep 17 00:00:00 2001
From: Patrick Cate <patrickcate@users.noreply.github.com>
Date: Sun, 12 Jan 2025 08:05:23 -0500
Subject: [PATCH] feat(UsaIcon): switch from deprecated `xlink:href` attribute
 to `href`

This aligns with USWDS 3.11.0 latest markup changes:
https://github.com/uswds/uswds/releases/tag/v3.11.0

ISSUES CLOSED: #1131
---
 src/components/UsaIcon/UsaIcon.test.js | 4 ++--
 src/components/UsaIcon/UsaIcon.vue     | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/UsaIcon/UsaIcon.test.js b/src/components/UsaIcon/UsaIcon.test.js
index b2acf20b..45e2c1cb 100644
--- a/src/components/UsaIcon/UsaIcon.test.js
+++ b/src/components/UsaIcon/UsaIcon.test.js
@@ -17,7 +17,7 @@ describe('UsaIcon', () => {
 
     cy.get('svg > use').should(
       'have.attr',
-      'xlink:href',
+      'href',
       '/assets/img/sprite.svg#flag',
     )
   })
@@ -44,7 +44,7 @@ describe('UsaIcon', () => {
       .and('have.attr', 'focusable', 'true')
       .and('have.class', 'usa-icon--size-3')
 
-    cy.get('svg > use').should('have.attr', 'xlink:href', '/test.svg#github')
+    cy.get('svg > use').should('have.attr', 'href', '/test.svg#github')
   })
 
   it('custom slot content is used', () => {
diff --git a/src/components/UsaIcon/UsaIcon.vue b/src/components/UsaIcon/UsaIcon.vue
index e3e0885b..580692ae 100644
--- a/src/components/UsaIcon/UsaIcon.vue
+++ b/src/components/UsaIcon/UsaIcon.vue
@@ -62,6 +62,6 @@ const iconHref = computed(() => `${svgSpritePath}#${props.name}`)
     :focusable="focusable"
   >
     <slot name="title"></slot>
-    <use :xlink:href="iconHref"></use>
+    <use :href="iconHref"></use>
   </svg>
 </template>