fix(a11y): add role to make lock icon readable

refactor(tests): update snapshots
Videodock · Feb 28, 2024 · b08159a · b08159a
1 parent 954d40f
commit b08159a
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 1 deletion.
diff --git a/packages/ui-react/src/components/Card/Card.tsx b/packages/ui-react/src/components/Card/Card.tsx
@@ -122,7 +122,7 @@ function Card({
             {featured && !disabled && heading}
             <div className={styles.tags}>
               {isLocked && (
-                <div className={classNames(styles.tag, styles.lock)} aria-label={t('card_lock')}>
+                <div className={classNames(styles.tag, styles.lock)} aria-label={t('card_lock')} role="img">
                   <Icon icon={Lock} />
                 </div>
               )}

diff --git a/packages/ui-react/src/components/Card/__snapshots__/Card.test.tsx.snap b/packages/ui-react/src/components/Card/__snapshots__/Card.test.tsx.snap
@@ -35,6 +35,7 @@ exports[`<Card> > should render anchor tag 1`] = `
           <div
             aria-label="card_lock"
             class="_tag_d75732 _lock_d75732"
+            role="img"
           >
             <svg
               aria-hidden="true"

diff --git a/packages/ui-react/src/components/Filter/__snapshots__/Filter.test.tsx.snap b/packages/ui-react/src/components/Filter/__snapshots__/Filter.test.tsx.snap
@@ -8,6 +8,7 @@ exports[`<Filter> > renders Filter 1`] = `
     role="listbox"
   >
     <button
+      aria-selected="false"
       class="_button_f8f296 _default_f8f296 _outlined_f8f296"
       role="option"
       type="button"
@@ -17,6 +18,7 @@ exports[`<Filter> > renders Filter 1`] = `
       </span>
     </button>
     <button
+      aria-selected="false"
       class="_button_f8f296 _default_f8f296 _outlined_f8f296"
       role="option"
       type="button"
@@ -26,6 +28,7 @@ exports[`<Filter> > renders Filter 1`] = `
       </span>
     </button>
     <button
+      aria-selected="false"
       class="_button_f8f296 _default_f8f296 _outlined_f8f296"
       role="option"
       type="button"
@@ -35,6 +38,7 @@ exports[`<Filter> > renders Filter 1`] = `
       </span>
     </button>
     <button
+      aria-selected="false"
       class="_button_f8f296 _default_f8f296 _outlined_f8f296"
       role="option"
       type="button"