fix(Dropdown): fix key handling

Semantic-Org · Jun 1, 2017 · 054bd93 · 054bd93
1 parent dfbf4f7
commit 054bd93
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 1 deletion.
diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js
@@ -1169,7 +1169,7 @@ export default class Dropdown extends Component {
       onClick: this.handleItemClick,
       selected: selectedIndex === i,
       ...opt,
-      key: getKeyOrValue(key, value),
+      key: getKeyOrValue(opt.key, opt.value),
       // Needed for handling click events on disabled items
       style: { ...opt.style, pointerEvents: 'all' },
     }))

diff --git a/test/specs/modules/Dropdown/Dropdown-test.js b/test/specs/modules/Dropdown/Dropdown-test.js
@@ -1497,6 +1497,20 @@ describe('Dropdown', () => {
         .find('DropdownItem')
         .everyWhere(item => item.should.have.prop('data-foo', 'someValue'))
     })
+
+    it('handles keys correctly', () => {
+      const customOptions = [
+        { key: 0, text: 'foo', value: 'foo' },
+        { key: null, text: 'bar', value: 'bar' },
+        { key: undefined, text: 'baz', value: 'baz' },
+      ]
+      const wrapper = wrapperMount(<Dropdown options={customOptions} selection />)
+      const items = wrapper.find('DropdownItem')
+
+      items.at(0).key().should.equal('0')
+      items.at(1).key().should.equal('bar')
+      items.at(2).key().should.equal('baz')
+    })
   })
 
   describe('selection', () => {