fix(storefront): BCTHEME-909 Social media icons failing wave scan wit…

…h Empty Link. (#2202)
bigcommerce · Apr 28, 2022 · b02094e · b02094e
1 parent 8c40e35
commit b02094e
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ## Draft
+- Social media icons failing wave scan with "Empty Link". [#2202](https://github.com/bigcommerce/cornerstone/issues/2202)
 - Search results containing % symbol result in errored page. [#2205](https://github.com/bigcommerce/cornerstone/issues/2205)
 - Remove translations for adminBar component [#2196](https://github.com/bigcommerce/cornerstone/issues/2196)
 - Remove adminBar. [#2191](https://github.com/bigcommerce/cornerstone/issues/2191)

diff --git a/templates/components/common/social-links.html b/templates/components/common/social-links.html
@@ -2,8 +2,16 @@
     <ul class="socialLinks socialLinks--alt">
         {{#each social_media}}
             <li class="socialLinks-item">
-                <a class="icon icon--{{display_name}}" href="{{url}}" target="_blank" rel="noopener">
-                    <svg><use xlink:href="#icon-{{display_name}}" /></svg>
+                <a class="icon icon--{{display_name}}"
+                   href="{{url}}"
+                   target="_blank"
+                   rel="noopener"
+                   title="{{{capitalize display_name}}}"
+                >
+                    <span class="aria-description--hidden">{{{capitalize display_name}}}</span>
+                    <svg>
+                        <use xlink:href="#icon-{{display_name}}"/>
+                    </svg>
                 </a>
             </li>
         {{/each}}