fix(list-box): Prevent focus on icon inside selection (carbon-design-…

…system#782) * fix(list-box): Prevent focus on icon inside selection This prevents a weird issue in IE where focus on the svg causes an exception in downshift. * fix(combo-box): Review comments * fix(combo-box): update snapshot
joshblack · Apr 4, 2018 · 53605d4 · 53605d4
1 parent 8071ab0
commit 53605d4
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 1 deletion.
diff --git a/src/components/ListBox/ListBoxSelection.js b/src/components/ListBox/ListBoxSelection.js
@@ -42,7 +42,7 @@ const ListBoxSelection = ({
       onKeyDown={handleOnKeyDown}
       title={description}>
       {selectionCount}
-      <Icon name="close" description={description} />
+      <Icon name="close" description={description} focusable="false" />
     </div>
   );
 };

diff --git a/src/components/ListBox/__tests__/__snapshots__/ListBoxField-test.js.snap b/src/components/ListBox/__tests__/__snapshots__/ListBoxField-test.js.snap
@@ -22,13 +22,15 @@ exports[`ListBoxField should render 1`] = `
         <Icon
           description="Clear selected item"
           fillRule="evenodd"
+          focusable="false"
           name="close"
           role="img"
         >
           <svg
             alt="Clear selected item"
             aria-label="Clear selected item"
             fillRule="evenodd"
+            focusable="false"
             height="10"
             name="close"
             role="img"

diff --git a/src/components/ListBox/__tests__/__snapshots__/ListBoxSelection-test.js.snap b/src/components/ListBox/__tests__/__snapshots__/ListBoxSelection-test.js.snap
@@ -27,13 +27,15 @@ exports[`ListBoxSelection should render 1`] = `
     <Icon
       description="translation"
       fillRule="evenodd"
+      focusable="false"
       name="close"
       role="img"
     >
       <svg
         alt="translation"
         aria-label="translation"
         fillRule="evenodd"
+        focusable="false"
         height="10"
         name="close"
         role="img"
@@ -82,13 +84,15 @@ exports[`ListBoxSelection should render 2`] = `
     <Icon
       description="translation"
       fillRule="evenodd"
+      focusable="false"
       name="close"
       role="img"
     >
       <svg
         alt="translation"
         aria-label="translation"
         fillRule="evenodd"
+        focusable="false"
         height="10"
         name="close"
         role="img"