fix(Dropdown): not calls onChange when value is not changed on item…

… click (#3482)

* fix(Dropdown): not calls `onChange` when value is not changed on item click

* add small fixes

* Update Dropdown.js

* Update Dropdown.js

src/modules/Dropdown/Dropdown.js

@@ -676,6 +676,7 @@ export default class Dropdown extends Component {
     debug('handleItemClick()', item)
 
     const { multiple, search } = this.props
+    const { value: currentValue } = this.state
     const { value } = item
 
     // prevent toggle() in handleClick()
@@ -686,14 +687,19 @@ export default class Dropdown extends Component {
 
     const isAdditionItem = item['data-additional']
     const newValue = multiple ? _.union(this.state.value, [value]) : value
+    const valueHasChanged = multiple
+      ? !!_.difference(newValue, currentValue).length
+      : newValue !== currentValue
 
     // notify the onChange prop that the user is trying to change value
-    this.setValue(newValue)
-    this.setSelectedIndex(value)
+    if (valueHasChanged) {
+      this.setValue(newValue)
+      this.setSelectedIndex(value)
 
-    this.clearSearchQuery()
+      this.handleChange(e, newValue)
+    }
 
-    this.handleChange(e, newValue)
+    this.clearSearchQuery()
     this.closeOnChange(e)
 
     // Heads up! This event handler should be called after `onChange`

test/specs/modules/Dropdown/Dropdown-test.js

@@ -1689,6 +1689,25 @@ describe('Dropdown', () => {
       spy.should.have.been.calledOnce()
       spy.should.have.been.calledWithMatch({}, { value: randomValue })
     })
+    it('is not called when value is not changed on item click', () => {
+      wrapperMount(<Dropdown options={options} selection onChange={spy} />)
+
+      wrapper
+        .simulate('click')
+        .find('DropdownItem')
+        .at(0)
+        .simulate('click')
+      spy.should.have.been.calledOnce()
+      dropdownMenuIsClosed()
+
+      wrapper
+        .simulate('click')
+        .find('DropdownItem')
+        .at(0)
+        .simulate('click')
+      spy.should.have.been.calledOnce()
+      dropdownMenuIsClosed()
+    })
     it('is called with event and value when pressing enter on a selected item', () => {
       const firstValue = options[0].value
       wrapperMount(<Dropdown options={options} selection onChange={spy} />).simulate('click')