diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js
index 33f9d00de1..514369bab7 100644
--- a/src/modules/Dropdown/Dropdown.js
+++ b/src/modules/Dropdown/Dropdown.js
@@ -43,10 +43,7 @@ export default class Dropdown extends Component {
     as: customPropTypes.as,
 
     /** Label prefixed to an option added by a user. */
-    additionLabel: PropTypes.oneOfType([
-      PropTypes.element,
-      PropTypes.string,
-    ]),
+    additionLabel: PropTypes.oneOfType([PropTypes.element, PropTypes.string]),
 
     /** Position of the `Add: ...` option in the dropdown list ('top' or 'bottom'). */
     additionPosition: PropTypes.oneOf(['top', 'bottom']),
@@ -55,10 +52,7 @@ export default class Dropdown extends Component {
      * Allow user additions to the list of options (boolean).
      * Requires the use of `selection`, `options` and `search`.
      */
-    allowAdditions: customPropTypes.every([
-      customPropTypes.demand(['options', 'selection', 'search']),
-      PropTypes.bool,
-    ]),
+    allowAdditions: customPropTypes.every([customPropTypes.demand(['options', 'selection', 'search']), PropTypes.bool]),
 
     /** A Dropdown can reduce its complexity. */
     basic: PropTypes.bool,
@@ -69,10 +63,7 @@ export default class Dropdown extends Component {
     /** Primary content. */
     children: customPropTypes.every([
       customPropTypes.disallow(['options', 'selection']),
-      customPropTypes.givenProps(
-        { children: PropTypes.any.isRequired },
-        PropTypes.element.isRequired,
-      ),
+      customPropTypes.givenProps({ children: PropTypes.any.isRequired }, PropTypes.element.isRequired),
     ]),
 
     /** Additional classes. */
@@ -103,20 +94,14 @@ export default class Dropdown extends Component {
     /** Currently selected label in multi-select. */
     defaultSelectedLabel: customPropTypes.every([
       customPropTypes.demand(['multiple']),
-      PropTypes.oneOfType([
-        PropTypes.number,
-        PropTypes.string,
-      ]),
+      PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ]),
 
     /** Initial value or value array if multiple. */
     defaultValue: PropTypes.oneOfType([
       PropTypes.number,
       PropTypes.string,
-      PropTypes.arrayOf(PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.number,
-      ])),
+      PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),
     ]),
 
     /** A dropdown menu can open to the left or to the right. */
@@ -138,10 +123,7 @@ export default class Dropdown extends Component {
     header: PropTypes.node,
 
     /** Shorthand for Icon. */
-    icon: PropTypes.oneOfType([
-      PropTypes.node,
-      PropTypes.object,
-    ]),
+    icon: PropTypes.oneOfType([PropTypes.node, PropTypes.object]),
 
     /** A dropdown can be formatted to appear inline in other content. */
     inline: PropTypes.bool,
@@ -283,17 +265,10 @@ export default class Dropdown extends Component {
      * A selection dropdown can allow a user to search through a large list of choices.
      * Pass a function here to replace the default search.
      */
-    search: PropTypes.oneOfType([
-      PropTypes.bool,
-      PropTypes.func,
-    ]),
+    search: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),
 
     /** A shorthand for a search input. */
-    searchInput: PropTypes.oneOfType([
-      PropTypes.array,
-      PropTypes.node,
-      PropTypes.object,
-    ]),
+    searchInput: PropTypes.oneOfType([PropTypes.array, PropTypes.node, PropTypes.object]),
 
     /** Current value of searchQuery. Creates a controlled component. */
     searchQuery: PropTypes.string,
@@ -312,10 +287,7 @@ export default class Dropdown extends Component {
     /** Currently selected label in multi-select. */
     selectedLabel: customPropTypes.every([
       customPropTypes.demand(['multiple']),
-      PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.number,
-      ]),
+      PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     ]),
 
     /** A dropdown can be used to select between choices in a form. */
@@ -329,30 +301,20 @@ export default class Dropdown extends Component {
     simple: PropTypes.bool,
 
     /** A dropdown can receive focus. */
-    tabIndex: PropTypes.oneOfType([
-      PropTypes.number,
-      PropTypes.string,
-    ]),
+    tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
 
     /** The text displayed in the dropdown, usually for the active item. */
     text: PropTypes.string,
 
     /** Custom element to trigger the menu to become visible. Takes place of 'text'. */
-    trigger: customPropTypes.every([
-      customPropTypes.disallow(['selection', 'text']),
-      PropTypes.node,
-    ]),
+    trigger: customPropTypes.every([customPropTypes.disallow(['selection', 'text']), PropTypes.node]),
 
     /** Current value or value array if multiple. Creates a controlled component. */
     value: PropTypes.oneOfType([
       PropTypes.bool,
       PropTypes.string,
       PropTypes.number,
-      PropTypes.arrayOf(PropTypes.oneOfType([
-        PropTypes.bool,
-        PropTypes.string,
-        PropTypes.number,
-      ])),
+      PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.bool, PropTypes.string, PropTypes.number])),
     ]),
 
     /** A dropdown can open upward. */
@@ -381,12 +343,7 @@ export default class Dropdown extends Component {
     wrapSelection: true,
   }
 
-  static autoControlledProps = [
-    'open',
-    'searchQuery',
-    'selectedLabel',
-    'value',
-  ]
+  static autoControlledProps = ['open', 'searchQuery', 'selectedLabel', 'value']
 
   static _meta = {
     name: 'Dropdown',
@@ -430,12 +387,12 @@ export default class Dropdown extends Component {
       if (hasValue && nextProps.multiple && !isNextValueArray) {
         console.error(
           'Dropdown `value` must be an array when `multiple` is set.' +
-          ` Received type: \`${Object.prototype.toString.call(nextProps.value)}\`.`,
+            ` Received type: \`${Object.prototype.toString.call(nextProps.value)}\`.`,
         )
       } else if (hasValue && !nextProps.multiple && isNextValueArray) {
         console.error(
           'Dropdown `value` must not be an array when `multiple` is not set.' +
-          ' Either set `multiple={true}` or use a string or number value.',
+            ' Either set `multiple={true}` or use a string or number value.',
         )
       }
     }
@@ -456,7 +413,8 @@ export default class Dropdown extends Component {
     return !shallowEqual(nextProps, this.props) || !shallowEqual(nextState, this.state)
   }
 
-  componentDidUpdate(prevProps, prevState) { // eslint-disable-line complexity
+  componentDidUpdate(prevProps, prevState) {
+    // eslint-disable-line complexity
     debug('componentDidUpdate()')
     debug('to state:', objectDiff(prevState, this.state))
 
@@ -465,7 +423,7 @@ export default class Dropdown extends Component {
       debug('dropdown focused')
       if (!this.isMouseDown) {
         const { minCharacters, openOnFocus, search } = this.props
-        const openable = !search || (search && minCharacters === 1)
+        const openable = !search || (search && minCharacters === 1 && !this.state.open)
 
         debug('mouse is not down, opening')
         if (openOnFocus && openable) this.open()
@@ -500,11 +458,7 @@ export default class Dropdown extends Component {
     } else if (prevState.open && !this.state.open) {
       debug('dropdown closed')
       this.handleClose()
-      eventStack.unsub('keydown', [
-        this.closeOnEscape,
-        this.moveSelectionOnKeyDown,
-        this.selectItemOnEnter,
-      ])
+      eventStack.unsub('keydown', [this.closeOnEscape, this.moveSelectionOnKeyDown, this.selectItemOnEnter])
       eventStack.unsub('click', this.closeOnDocumentClick)
       if (!this.state.focus) {
         eventStack.unsub('keydown', this.removeItemOnBackspace)
@@ -539,9 +493,7 @@ export default class Dropdown extends Component {
 
   closeOnChange = (e) => {
     const { closeOnChange, multiple } = this.props
-    const shouldClose = _.isUndefined(closeOnChange)
-      ? !multiple
-      : closeOnChange
+    const shouldClose = _.isUndefined(closeOnChange) ? !multiple : closeOnChange
 
     if (shouldClose) this.close(e)
   }
@@ -831,8 +783,7 @@ export default class Dropdown extends Component {
 
         const re = new RegExp(_.escapeRegExp(strippedQuery), 'i')
 
-        filteredOptions = _.filter(filteredOptions, opt =>
-          re.test(deburr ? _.deburr(opt.text) : opt.text))
+        filteredOptions = _.filter(filteredOptions, opt => re.test(deburr ? _.deburr(opt.text) : opt.text))
       }
     }
 
@@ -846,10 +797,7 @@ export default class Dropdown extends Component {
         key: 'addition',
         // by using an array, we can pass multiple elements, but when doing so
         // we must specify a `key` for React to know which one is which
-        text: [
-          additionLabelElement,
-          <b key='addition-query'>{searchQuery}</b>,
-        ],
+        text: [additionLabelElement, <b key='addition-query'>{searchQuery}</b>],
         value: searchQuery,
         className: 'addition',
         'data-additional': true,
@@ -871,10 +819,14 @@ export default class Dropdown extends Component {
   getEnabledIndices = (givenOptions) => {
     const options = givenOptions || this.getMenuOptions()
 
-    return _.reduce(options, (memo, item, index) => {
-      if (!item.disabled) memo.push(index)
-      return memo
-    }, [])
+    return _.reduce(
+      options,
+      (memo, item, index) => {
+        if (!item.disabled) memo.push(index)
+        return memo
+      },
+      [],
+    )
   }
 
   getItemByValue = (value) => {
@@ -944,9 +896,7 @@ export default class Dropdown extends Component {
       // Select the currently active item, if none, use the first item.
       // Multiple selects remove active items from the list,
       // their initial selected index should be 0.
-      newSelectedIndex = multiple
-        ? firstIndex
-        : this.getMenuItemIndexByValue(value, options) || enabledIndicies[0]
+      newSelectedIndex = multiple ? firstIndex : this.getMenuItemIndexByValue(value, options) || enabledIndicies[0]
     } else if (multiple) {
       // multiple selects remove options from the menu as they are made active
       // keep the selected index within range of the remaining items
@@ -1096,12 +1046,13 @@ export default class Dropdown extends Component {
     debug(`menu: ${menu}`)
     debug(`item: ${item}`)
     const isOutOfUpperView = item.offsetTop < menu.scrollTop
-    const isOutOfLowerView = (item.offsetTop + item.clientHeight) > menu.scrollTop + menu.clientHeight
+    const isOutOfLowerView = item.offsetTop + item.clientHeight > menu.scrollTop + menu.clientHeight
 
     if (isOutOfUpperView) {
       menu.scrollTop = item.offsetTop
     } else if (isOutOfLowerView) {
-      menu.scrollTop = (item.offsetTop + item.clientHeight) - menu.clientHeight
+      // eslint-disable-next-line no-mixed-operators
+      menu.scrollTop = item.offsetTop + item.clientHeight - menu.clientHeight
     }
   }
 
@@ -1152,15 +1103,9 @@ export default class Dropdown extends Component {
   renderText = () => {
     const { multiple, placeholder, search, text } = this.props
     const { searchQuery, value, open } = this.state
-    const hasValue = multiple
-      ? !_.isEmpty(value)
-      : !_.isNil(value) && value !== ''
+    const hasValue = multiple ? !_.isEmpty(value) : !_.isNil(value) && value !== ''
 
-    const classes = cx(
-      placeholder && !hasValue && 'default',
-      'text',
-      search && searchQuery && 'filtered',
-    )
+    const classes = cx(placeholder && !hasValue && 'default', 'text', search && searchQuery && 'filtered')
     let _text = placeholder
     if (searchQuery) {
       _text = null
@@ -1172,7 +1117,11 @@ export default class Dropdown extends Component {
       _text = _.get(this.getItemByValue(value), 'text')
     }
 
-    return <div className={classes} role='alert' aria-live='polite'>{_text}</div>
+    return (
+      <div className={classes} role='alert' aria-live='polite'>
+        {_text}
+      </div>
+    )
   }
 
   renderSearchInput = () => {
@@ -1180,13 +1129,15 @@ export default class Dropdown extends Component {
     const { searchQuery } = this.state
 
     if (!search) return null
-    return DropdownSearchInput.create(searchInput, { defaultProps: {
-      inputRef: this.handleSearchRef,
-      onChange: this.handleSearchChange,
-      style: { width: this.computeSearchInputWidth() },
-      tabIndex: this.computeSearchInputTabIndex(),
-      value: searchQuery,
-    } })
+    return DropdownSearchInput.create(searchInput, {
+      defaultProps: {
+        inputRef: this.handleSearchRef,
+        onChange: this.handleSearchChange,
+        style: { width: this.computeSearchInputWidth() },
+        tabIndex: this.computeSearchInputTabIndex(),
+        value: searchQuery,
+      },
+    })
   }
 
   renderSearchSizer = () => {
@@ -1218,10 +1169,7 @@ export default class Dropdown extends Component {
         value: item.value,
       }
 
-      return Label.create(
-        renderLabel(item, index, defaultProps),
-        { defaultProps },
-      )
+      return Label.create(renderLabel(item, index, defaultProps), { defaultProps })
     })
   }
 
@@ -1234,19 +1182,19 @@ export default class Dropdown extends Component {
       return <div className='message'>{noResultsMessage}</div>
     }
 
-    const isActive = multiple
-      ? optValue => _.includes(value, optValue)
-      : optValue => optValue === value
-
-    return _.map(options, (opt, i) => DropdownItem.create({
-      active: isActive(opt.value),
-      onClick: this.handleItemClick,
-      selected: selectedIndex === i,
-      ...opt,
-      key: getKeyOrValue(opt.key, opt.value),
-      // Needed for handling click events on disabled items
-      style: { ...opt.style, pointerEvents: 'all' },
-    }))
+    const isActive = multiple ? optValue => _.includes(value, optValue) : optValue => optValue === value
+
+    return _.map(options, (opt, i) =>
+      DropdownItem.create({
+        active: isActive(opt.value),
+        onClick: this.handleItemClick,
+        selected: selectedIndex === i,
+        ...opt,
+        key: getKeyOrValue(opt.key, opt.value),
+        // Needed for handling click events on disabled items
+        style: { ...opt.style, pointerEvents: 'all' },
+      }),
+    )
   }
 
   renderMenu = () => {
@@ -1257,11 +1205,7 @@ export default class Dropdown extends Component {
     // single menu child
     if (!childrenUtils.isNil(children)) {
       const menuChild = Children.only(children)
-      const className = cx(
-        direction,
-        useKeyOnly(open, 'visible'),
-        menuChild.props.className,
-      )
+      const className = cx(direction, useKeyOnly(open, 'visible'), menuChild.props.className)
 
       return cloneElement(menuChild, { className, ...ariaOptions })
     }
diff --git a/test/specs/modules/Dropdown/Dropdown-test.js b/test/specs/modules/Dropdown/Dropdown-test.js
index 175fedd724..4ebf4f3e3e 100644
--- a/test/specs/modules/Dropdown/Dropdown-test.js
+++ b/test/specs/modules/Dropdown/Dropdown-test.js
@@ -33,11 +33,12 @@ const wrapperRender = (...args) => (wrapper = render(...args))
 // ----------------------------------------
 // Options
 // ----------------------------------------
-const getOptions = (count = 5) => _.times(count, (i) => {
-  const text = `${i}-${faker.hacker.noun}`
-  const value = `${i}-${_.snakeCase(text)}`
-  return { text, value }
-})
+const getOptions = (count = 5) =>
+  _.times(count, (i) => {
+    const text = `${i}-${faker.hacker.noun}`
+    const value = `${i}-${_.snakeCase(text)}`
+    return { text, value }
+  })
 
 // -------------------------------
 // Common Assertions
@@ -117,19 +118,24 @@ describe('Dropdown', () => {
   common.propKeyOnlyToClassName(Dropdown, 'upward')
 
   common.propKeyOrValueAndKeyToClassName(Dropdown, 'pointing', [
-    'left', 'right', 'top', 'top left', 'top right', 'bottom', 'bottom left', 'bottom right',
+    'left',
+    'right',
+    'top',
+    'top left',
+    'top right',
+    'bottom',
+    'bottom left',
+    'bottom right',
   ])
 
   describe('defaultSearchQuery', () => {
     it('changes default value of searchQuery', () => {
-      shallow(<Dropdown defaultSearchQuery='foo' />)
-        .should.have.state('searchQuery', 'foo')
+      shallow(<Dropdown defaultSearchQuery='foo' />).should.have.state('searchQuery', 'foo')
     })
   })
 
   it('closes on blur', () => {
-    wrapperMount(<Dropdown options={options} />)
-      .simulate('click')
+    wrapperMount(<Dropdown options={options} />).simulate('click')
 
     dropdownMenuIsOpen()
     wrapper.simulate('blur')
@@ -137,8 +143,7 @@ describe('Dropdown', () => {
   })
 
   it('does not close on blur with closeOnBlur set to false', () => {
-    wrapperMount(<Dropdown options={options} closeOnBlur={false} />)
-      .simulate('click')
+    wrapperMount(<Dropdown options={options} closeOnBlur={false} />).simulate('click')
 
     dropdownMenuIsOpen()
     wrapper.simulate('blur')
@@ -155,8 +160,7 @@ describe('Dropdown', () => {
     wrapper.simulate('click')
     dropdownMenuIsClosed()
 
-    instance.ref.blur
-      .should.have.been.calledOnce()
+    instance.ref.blur.should.have.been.calledOnce()
   })
 
   it('blurs the Dropdown node on close by clicking outside component', () => {
@@ -169,8 +173,7 @@ describe('Dropdown', () => {
     document.body.click()
     dropdownMenuIsClosed()
 
-    instance.ref.blur
-      .should.have.been.calledOnce()
+    instance.ref.blur.should.have.been.calledOnce()
   })
 
   it('does not close on click when search is true and options are empty', () => {
@@ -220,18 +223,15 @@ describe('Dropdown', () => {
 
   describe('tabIndex', () => {
     it('defaults to 0', () => {
-      shallow(<Dropdown options={options} />)
-        .should.have.prop('tabIndex', 0)
+      shallow(<Dropdown options={options} />).should.have.prop('tabIndex', 0)
     })
 
     it('defaults to -1 when disabled', () => {
-      shallow(<Dropdown disabled options={options} />)
-        .should.have.prop('tabIndex', -1)
+      shallow(<Dropdown disabled options={options} />).should.have.prop('tabIndex', -1)
     })
 
     it('applies when defined', () => {
-      shallow(<Dropdown options={options} tabIndex={1} />)
-        .should.have.prop('tabIndex', 1)
+      shallow(<Dropdown options={options} tabIndex={1} />).should.have.prop('tabIndex', 1)
     })
 
     describe('tabIndex', () => {
@@ -260,13 +260,11 @@ describe('Dropdown', () => {
       })
 
       it('is not present on the root when is search', () => {
-        shallow(<Dropdown options={options} selection search />)
-          .should.not.have.prop('tabIndex')
+        shallow(<Dropdown options={options} selection search />).should.not.have.prop('tabIndex')
       })
 
       it('is not present on the root when is search and defined', () => {
-        shallow(<Dropdown options={options} selection search tabIndex={1} />)
-          .should.not.have.prop('tabIndex')
+        shallow(<Dropdown options={options} selection search tabIndex={1} />).should.not.have.prop('tabIndex')
       })
     })
   })
@@ -274,11 +272,17 @@ describe('Dropdown', () => {
   describe('aria', () => {
     it('should label normal dropdown as a listbox', () => {
       wrapperMount(<Dropdown />)
-      wrapper.find('div').at(0).should.have.prop('role', 'listbox')
+      wrapper
+        .find('div')
+        .at(0)
+        .should.have.prop('role', 'listbox')
     })
     it('should label search dropdown as a combobox', () => {
       wrapperMount(<Dropdown search />)
-      wrapper.find('div').at(0).should.have.prop('role', 'combobox')
+      wrapper
+        .find('div')
+        .at(0)
+        .should.have.prop('role', 'combobox')
     })
     it('should label search dropdownMenu as a listbox', () => {
       wrapperMount(<Dropdown search />)
@@ -294,31 +298,52 @@ describe('Dropdown', () => {
     })
     it('should label disabled dropdown as aria-disabled', () => {
       wrapperMount(<Dropdown disabled />)
-      wrapper.find('div').at(0).should.have.prop('aria-disabled', true)
+      wrapper
+        .find('div')
+        .at(0)
+        .should.have.prop('aria-disabled', true)
     })
     it('should label normal dropdown without aria-disabled', () => {
       wrapperMount(<Dropdown />)
-      wrapper.find('div').at(0).should.not.have.prop('aria-disabled')
+      wrapper
+        .find('div')
+        .at(0)
+        .should.not.have.prop('aria-disabled')
     })
     it('should label multiple dropdown as aria-multiselectable', () => {
       wrapperMount(<Dropdown multiple />)
-      wrapper.find('div').at(0).should.have.prop('aria-multiselectable', true)
+      wrapper
+        .find('div')
+        .at(0)
+        .should.have.prop('aria-multiselectable', true)
     })
     it('should not label multiple search dropdown as aria-multiselectable', () => {
       wrapperMount(<Dropdown search multiple />)
-      wrapper.find('div').at(0).should.not.have.prop('aria-multiselectable')
+      wrapper
+        .find('div')
+        .at(0)
+        .should.not.have.prop('aria-multiselectable')
     })
     it('should label normal dropdown without aria-multiselectable', () => {
       wrapperMount(<Dropdown />)
-      wrapper.find('div').at(0).should.not.have.prop('aria-multiselectable')
+      wrapper
+        .find('div')
+        .at(0)
+        .should.not.have.prop('aria-multiselectable')
     })
     it('should label loading dropdown as aria-busy', () => {
       wrapperMount(<Dropdown loading />)
-      wrapper.find('div').at(0).should.have.prop('aria-busy', true)
+      wrapper
+        .find('div')
+        .at(0)
+        .should.have.prop('aria-busy', true)
     })
     it('should label normal dropdown without aria-busy', () => {
       wrapperMount(<Dropdown />)
-      wrapper.find('div').at(0).should.not.have.prop('aria-busy')
+      wrapper
+        .find('div')
+        .at(0)
+        .should.not.have.prop('aria-busy')
     })
     it('should label search dropdown input aria-autocomplete=list', () => {
       wrapperMount(<Dropdown search />)
@@ -335,8 +360,7 @@ describe('Dropdown', () => {
       const spy = sandbox.spy()
       const event = { foo: 'bar' }
 
-      wrapperShallow(<Dropdown onBlur={spy} />)
-        .simulate('blur', event)
+      wrapperShallow(<Dropdown onBlur={spy} />).simulate('blur', event)
 
       spy.should.have.been.calledOnce()
       spy.should.have.been.calledWithMatch(event)
@@ -350,8 +374,7 @@ describe('Dropdown', () => {
 
       wrapper.simulate('blur')
 
-      instance.makeSelectedItemActive
-        .should.have.been.calledOnce()
+      instance.makeSelectedItemActive.should.have.been.calledOnce()
     })
 
     it('sets focus state to false', () => {
@@ -391,8 +414,7 @@ describe('Dropdown', () => {
       wrapper.simulate('mousedown')
       wrapper.simulate('blur')
 
-      instance.makeSelectedItemActive
-        .should.not.have.been.called()
+      instance.makeSelectedItemActive.should.not.have.been.called()
     })
 
     it('does not set focus state when the mouse is down', () => {
@@ -417,9 +439,7 @@ describe('Dropdown', () => {
       wrapper.simulate('click')
       dropdownMenuIsClosed()
 
-      instance
-        .handleClose
-        .should.have.been.calledOnce()
+      instance.handleClose.should.have.been.calledOnce()
     })
 
     it('prevents Space from opening a search Dropdown after selecting an item', () => {
@@ -454,12 +474,12 @@ describe('Dropdown', () => {
 
   describe('closeOnChange', () => {
     it('will close when defined and dropdown is multiple', () => {
-      wrapperMount(<Dropdown selection multiple search closeOnChange options={options} />)
-        .simulate('click')
+      wrapperMount(<Dropdown selection multiple search closeOnChange options={options} />).simulate('click')
 
       dropdownMenuIsOpen()
 
-      wrapper.find('DropdownItem')
+      wrapper
+        .find('DropdownItem')
         .first()
         .simulate('click', nativeEvent)
 
@@ -467,12 +487,12 @@ describe('Dropdown', () => {
     })
 
     it('will remain open when undefined and dropdown is multiple', () => {
-      wrapperMount(<Dropdown selection multiple search options={options} />)
-        .simulate('click')
+      wrapperMount(<Dropdown selection multiple search options={options} />).simulate('click')
 
       dropdownMenuIsOpen()
 
-      wrapper.find('DropdownItem')
+      wrapper
+        .find('DropdownItem')
         .first()
         .simulate('click', nativeEvent)
 
@@ -506,26 +526,20 @@ describe('Dropdown', () => {
 
   describe('isMouseDown', () => {
     it('tracks when the mouse is down', () => {
-      wrapperShallow(<Dropdown />)
-        .simulate('mousedown')
+      wrapperShallow(<Dropdown />).simulate('mousedown')
 
-      wrapper.instance()
-        .isMouseDown
-        .should.equal(true)
+      wrapper.instance().isMouseDown.should.equal(true)
 
       domEvent.mouseUp(document)
 
-      wrapper.instance()
-        .isMouseDown
-        .should.equal(false)
+      wrapper.instance().isMouseDown.should.equal(false)
     })
   })
 
   describe('icon', () => {
     it('defaults to a dropdown icon', () => {
       Dropdown.defaultProps.icon.should.equal('dropdown')
-      wrapperRender(<Dropdown />)
-        .should.contain.descendants('.dropdown.icon')
+      wrapperRender(<Dropdown />).should.contain.descendants('.dropdown.icon')
     })
 
     it('always opens a dropdown on click', () => {
@@ -560,13 +574,11 @@ describe('Dropdown', () => {
 
   describe('searchQuery', () => {
     it('defaults to empty string', () => {
-      shallow(<Dropdown />)
-        .should.have.state('searchQuery', '')
+      shallow(<Dropdown />).should.have.state('searchQuery', '')
     })
 
     it('passes value to state', () => {
-      shallow(<Dropdown searchQuery='foo' />)
-        .should.have.state('searchQuery', 'foo')
+      shallow(<Dropdown searchQuery='foo' />).should.have.state('searchQuery', 'foo')
     })
   })
 
@@ -598,8 +610,7 @@ describe('Dropdown', () => {
 
       wrapperShallow(<Dropdown options={[]} selection value={value} />)
 
-      wrapper
-        .setProps({ options, value })
+      wrapper.setProps({ options, value })
 
       wrapper
         .find('DropdownItem')
@@ -609,8 +620,7 @@ describe('Dropdown', () => {
     it('is null when all options disabled', () => {
       const disabledOptions = options.map(o => ({ ...o, disabled: true }))
 
-      wrapperRender(<Dropdown options={disabledOptions} selection />)
-        .should.not.have.descendants('.selected')
+      wrapperRender(<Dropdown options={disabledOptions} selection />).should.not.have.descendants('.selected')
     })
     it('is set when clicking an item', () => {
       // random item, skip the first as it's selected by default
@@ -698,17 +708,13 @@ describe('Dropdown', () => {
         .find('input.search')
         .simulate('change', { target: { value: 'a' } })
 
-      wrapper
-        .find('.selected')
-        .should.contain.text('a1')
+      wrapper.find('.selected').should.contain.text('a1')
 
       // move selection down
       domEvent.keyDown(document, { key: 'ArrowDown' })
       wrapper.update()
 
-      wrapper
-        .find('.selected')
-        .should.contain.text('a2')
+      wrapper.find('.selected').should.contain.text('a2')
     })
     it('filters diacritics on options when using deburr prop', () => {
       const inputText = 'floresti'
@@ -726,9 +732,7 @@ describe('Dropdown', () => {
         .find('input.search')
         .simulate('change', { target: { value: inputText } })
 
-      wrapper
-        .find('.selected')
-        .should.contain.text(textToFind)
+      wrapper.find('.selected').should.contain.text(textToFind)
     })
     it('filters diacritics on input when using deburr prop', () => {
       const inputText = 'FLORÉŞTI'
@@ -746,9 +750,7 @@ describe('Dropdown', () => {
         .find('input.search')
         .simulate('change', { target: { value: inputText } })
 
-      wrapper
-        .find('.selected')
-        .should.contain.text(textToFind)
+      wrapper.find('.selected').should.contain.text(textToFind)
     })
     it('should not filter diacritics when deburr is not set', () => {
       const inputText = 'FLORÉŞTI'
@@ -769,16 +771,10 @@ describe('Dropdown', () => {
         .find('input.search')
         .simulate('change', { target: { value: inputText } })
 
-      wrapper
-        .find('.message')
-        .should.contain.text(noResultsText)
+      wrapper.find('.message').should.contain.text(noResultsText)
     })
     it('still works after encountering "no results"', () => {
-      const opts = [
-        { text: 'a1', value: 'a1' },
-        { text: 'a2', value: 'a2' },
-        { text: 'a3', value: 'a3' },
-      ]
+      const opts = [{ text: 'a1', value: 'a1' }, { text: 'a2', value: 'a2' }, { text: 'a3', value: 'a3' }]
       wrapperMount(<Dropdown options={opts} search selection />)
 
       // search for 'a4'
@@ -794,21 +790,21 @@ describe('Dropdown', () => {
       // no results is removed
       // first item is selected
       // down arrow moves selection
-      wrapper
-        .find('input.search')
-        .simulate('change', { target: { value: 'a' } })
+      wrapper.find('input.search').simulate('change', { target: { value: 'a' } })
 
       wrapper.should.not.have.descendants('.message')
 
-      wrapper
-        .should.have.exactly(1).descendants('.selected')
+      wrapper.should.have
+        .exactly(1)
+        .descendants('.selected')
         .which.contain.text('a1')
 
       // move selection down
       domEvent.keyDown(document, { key: 'ArrowDown' })
 
-      wrapper
-        .should.have.exactly(1).descendants('.selected')
+      wrapper.should.have
+        .exactly(1)
+        .descendants('.selected')
         .which.contain.text('a2')
     })
     it('skips over disabled items', () => {
@@ -821,25 +817,17 @@ describe('Dropdown', () => {
       wrapperMount(<Dropdown options={opts} search selection />)
       wrapper.simulate('click')
 
-      wrapper
-        .find('.selected')
-        .should.contain.text('a1')
+      wrapper.find('.selected').should.contain.text('a1')
 
       // move selection down
       domEvent.keyDown(document, { key: 'ArrowDown' })
       wrapper.update()
 
-      wrapper
-        .find('.selected')
-        .should.contain.text('a2')
+      wrapper.find('.selected').should.contain.text('a2')
     })
     it('does not enter an infinite loop when all items are disabled', () => {
-      const opts = [
-        { text: '1', value: '1', disabled: true },
-        { text: '2', value: '2', disabled: true },
-      ]
-      wrapperMount(<Dropdown options={opts} search selection />)
-        .simulate('click')
+      const opts = [{ text: '1', value: '1', disabled: true }, { text: '2', value: '2', disabled: true }]
+      wrapperMount(<Dropdown options={opts} search selection />).simulate('click')
 
       const instance = wrapper.instance()
       sandbox.spy(instance, 'moveSelectionBy')
@@ -847,16 +835,13 @@ describe('Dropdown', () => {
       // move selection down
       domEvent.keyDown(document, { key: 'ArrowDown' })
 
-      instance
-        .moveSelectionBy
-        .should.have.been.calledOnce()
+      instance.moveSelectionBy.should.have.been.calledOnce()
     })
     it('scrolls the selected item into view', () => {
       // get enough options to make the menu scrollable
       const opts = getOptions(20)
 
-      wrapperMount(<Dropdown options={opts} selection />)
-        .simulate('click')
+      wrapperMount(<Dropdown options={opts} selection />).simulate('click')
 
       dropdownMenuIsOpen()
       const menu = document.querySelector('.ui.dropdown .menu.visible')
@@ -870,17 +855,13 @@ describe('Dropdown', () => {
       //
 
       // make sure first item is selected
-      wrapper
-        .find('.selected')
-        .should.contain.text(opts[0].text)
+      wrapper.find('.selected').should.contain.text(opts[0].text)
 
       // wrap selection to last item
       domEvent.keyDown(document, { key: 'ArrowUp' })
 
       // make sure last item is selected
-      wrapper
-        .find('.selected')
-        .should.contain.text(_.tail(opts).text)
+      wrapper.find('.selected').should.contain.text(_.tail(opts).text)
 
       // menu should be completely scrolled to the bottom
       const isMenuScrolledToBottom = menu.scrollTop + menu.clientHeight === menu.scrollHeight
@@ -896,9 +877,7 @@ describe('Dropdown', () => {
       domEvent.keyDown(document, { key: 'ArrowDown' })
 
       // make sure first item is selected
-      wrapper
-        .find('.selected')
-        .should.contain.text(opts[0].text)
+      wrapper.find('.selected').should.contain.text(opts[0].text)
 
       // Note: For some reason the first item's offsetTop is not 0 so we need
       // to find the item's offsetTop and ensure it's at the top.
@@ -933,8 +912,7 @@ describe('Dropdown', () => {
         .should.have.prop('active', true)
     })
     it('closes the menu', () => {
-      wrapperMount(<Dropdown options={options} selection />)
-        .simulate('click')
+      wrapperMount(<Dropdown options={options} selection />).simulate('click')
 
       dropdownMenuIsOpen()
 
@@ -1045,9 +1023,7 @@ describe('Dropdown', () => {
         .at(_.random(options.length - 1))
         .simulate('click')
 
-      wrapper
-        .find('div.text')
-        .should.contain.text(text)
+      wrapper.find('div.text').should.contain.text(text)
     })
     it('is updated on item click if not already defined', () => {
       wrapperMount(<Dropdown options={options} selection />)
@@ -1062,30 +1038,21 @@ describe('Dropdown', () => {
         .simulate('click')
 
       // text updated
-      wrapper
-        .find('div.text')
-        .should.contain.text(item.text())
+      wrapper.find('div.text').should.contain.text(item.text())
     })
     it('is updated on item enter if multiple search results present', () => {
-      const searchOptions = [
-        { value: 0, text: 'foo' },
-        { value: 1, text: 'foe' },
-      ]
+      const searchOptions = [{ value: 0, text: 'foo' }, { value: 1, text: 'foe' }]
       wrapperMount(<Dropdown options={searchOptions} search selection />)
 
       // open and simulate search
-      wrapper
-        .simulate('click')
-        .setState({ searchQuery: 'fo' })
+      wrapper.simulate('click').setState({ searchQuery: 'fo' })
 
       // arrow down
       domEvent.keyDown(document, { key: 'ArrowDown' })
       domEvent.keyDown(document, { key: 'Enter' })
 
       // text updated
-      wrapper
-        .find('div.text')
-        .should.contain.text('foe')
+      wrapper.find('div.text').should.contain.text('foe')
     })
     it('displays if value is 0', () => {
       const text = faker.hacker.noun()
@@ -1096,14 +1063,10 @@ describe('Dropdown', () => {
       wrapper.simulate('click')
 
       // click item
-      const item = wrapper
-        .find('DropdownItem')
-        .simulate('click')
+      const item = wrapper.find('DropdownItem').simulate('click')
 
       // text updated
-      wrapper
-        .find('div.text')
-        .should.contain.text(item.text())
+      wrapper.find('div.text').should.contain.text(item.text())
     })
     it("does not display if value is ''", () => {
       const text = faker.hacker.noun()
@@ -1113,9 +1076,7 @@ describe('Dropdown', () => {
         .find('DropdownItem')
         .simulate('click')
 
-      wrapper
-        .find('div.text')
-        .should.contain.text('')
+      wrapper.find('div.text').should.contain.text('')
     })
     it('does not display if value is null', () => {
       const text = faker.hacker.noun()
@@ -1125,9 +1086,7 @@ describe('Dropdown', () => {
         .find('DropdownItem')
         .simulate('click')
 
-      wrapper
-        .find('div.text')
-        .should.contain.text('')
+      wrapper.find('div.text').should.contain.text('')
     })
     it('does not display if value is undefined', () => {
       const text = faker.hacker.noun()
@@ -1137,9 +1096,7 @@ describe('Dropdown', () => {
         .find('DropdownItem')
         .simulate('click')
 
-      wrapper
-        .find('div.text')
-        .should.contain.text('')
+      wrapper.find('div.text').should.contain.text('')
     })
   })
 
@@ -1156,8 +1113,9 @@ describe('Dropdown', () => {
       const text = faker.hacker.phrase()
       const trigger = <div className='trigger'>{text}</div>
 
-      wrapperRender(<Dropdown options={options} trigger={trigger} text={text} />)
-        .should.not.have.descendants('div.text')
+      wrapperRender(<Dropdown options={options} trigger={trigger} text={text} />).should.not.have.descendants(
+        'div.text',
+      )
     })
   })
 
@@ -1172,8 +1130,8 @@ describe('Dropdown', () => {
 
     it('opens on arrow down when focused', () => {
       wrapperMount(<Dropdown options={options} selection />)
-      // Note: This mousedown is necessary to get the Dropdown focused
-      // without it being open.
+        // Note: This mousedown is necessary to get the Dropdown focused
+        // without it being open.
         .simulate('mousedown')
         .simulate('focus')
 
@@ -1184,8 +1142,8 @@ describe('Dropdown', () => {
 
     it('opens on space when focused', () => {
       wrapperMount(<Dropdown options={options} selection />)
-      // Note: This mousedown is necessary to get the Dropdown focused
-      // without it being open.
+        // Note: This mousedown is necessary to get the Dropdown focused
+        // without it being open.
         .simulate('mousedown')
         .simulate('focus')
 
@@ -1220,9 +1178,7 @@ describe('Dropdown', () => {
 
     it('closes on menu item click', () => {
       wrapperMount(<Dropdown options={options} selection />)
-      const item = wrapper
-        .find('DropdownItem')
-        .at(_.random(options.length - 1))
+      const item = wrapper.find('DropdownItem').at(_.random(options.length - 1))
 
       // open
       wrapper.simulate('click')
@@ -1235,9 +1191,7 @@ describe('Dropdown', () => {
 
     it('blurs after menu item click (mousedown)', () => {
       wrapperMount(<Dropdown options={options} selection />)
-      const item = wrapper
-        .find('DropdownItem')
-        .at(_.random(options.length - 1))
+      const item = wrapper.find('DropdownItem').at(_.random(options.length - 1))
 
       // open
       wrapper.simulate('click')
@@ -1266,9 +1220,7 @@ describe('Dropdown', () => {
       wrapperMount(<Dropdown options={options} selection />)
 
       // open
-      wrapper
-        .find('Dropdown')
-        .simulate('click')
+      wrapper.find('Dropdown').simulate('click')
       dropdownMenuIsOpen()
 
       // esc
@@ -1293,6 +1245,16 @@ describe('Dropdown', () => {
       domEvent.keyDown(document, { key: 'ArrowDown' })
       onOpen.should.not.have.been.calledOnce()
     })
+
+    it('is called once when the icon is clicked with a search prop', () => {
+      // https://github.com/Semantic-Org/Semantic-UI-React/issues/2600
+      const onOpen = sandbox.spy()
+      wrapperMount(<Dropdown options={options} selection search onOpen={onOpen} />)
+        .find('i.icon')
+        .simulate('click')
+
+      onOpen.should.have.been.calledOnce()
+    })
   })
 
   describe('onClose', () => {
@@ -1327,13 +1289,11 @@ describe('Dropdown', () => {
       dropdownMenuIsClosed()
     })
     it('closes the menu when toggled from true to false', () => {
-      wrapperMount(<Dropdown options={options} selection open />)
-        .setProps({ open: false })
+      wrapperMount(<Dropdown options={options} selection open />).setProps({ open: false })
       dropdownMenuIsClosed()
     })
     it('opens the menu when toggled from false to true', () => {
-      wrapperMount(<Dropdown options={options} selection open={false} />)
-        .setProps({ open: true })
+      wrapperMount(<Dropdown options={options} selection open={false} />).setProps({ open: true })
       dropdownMenuIsOpen()
     })
     it('calls scrollSelectedItemIntoView when changed from false to true', () => {
@@ -1342,20 +1302,17 @@ describe('Dropdown', () => {
       const instance = wrapper.instance()
       sandbox.spy(instance, 'scrollSelectedItemIntoView')
 
-      instance.scrollSelectedItemIntoView
-        .should.not.have.been.called()
+      instance.scrollSelectedItemIntoView.should.not.have.been.called()
 
       wrapper.setProps({ open: true })
 
-      instance.scrollSelectedItemIntoView
-        .should.have.been.calledOnce()
+      instance.scrollSelectedItemIntoView.should.have.been.calledOnce()
     })
   })
 
   describe('multiple', () => {
     it('does not close the menu on item selection with enter', () => {
-      wrapperMount(<Dropdown options={options} selection multiple />)
-        .simulate('click')
+      wrapperMount(<Dropdown options={options} selection multiple />).simulate('click')
 
       dropdownMenuIsOpen()
 
@@ -1376,18 +1333,18 @@ describe('Dropdown', () => {
     it('filters active options out of the list', () => {
       // make all the items active, expect to see none in the list
       const value = _.map(options, 'value')
-      wrapperShallow(<Dropdown options={options} selection value={value} multiple />)
-        .should.not.have.descendants('DropdownItem')
+      wrapperShallow(<Dropdown options={options} selection value={value} multiple />).should.not.have.descendants(
+        'DropdownItem',
+      )
     })
     it('displays a label for active items', () => {
       // select a random item, expect a label with the item's text
       const activeItem = _.sample(options)
-      wrapperShallow(<Dropdown options={options} selection value={[activeItem.value]} multiple />)
-        .should.have.descendants('Label')
+      wrapperShallow(
+        <Dropdown options={options} selection value={[activeItem.value]} multiple />,
+      ).should.have.descendants('Label')
 
-      wrapper
-        .find('Label')
-        .should.have.prop('content', activeItem.text)
+      wrapper.find('Label').should.have.prop('content', activeItem.text)
     })
     it('keeps the selection within the range of remaining options', () => {
       // items are removed as they are made active
@@ -1402,8 +1359,7 @@ describe('Dropdown', () => {
       domEvent.keyDown(document, { key: 'ArrowUp' })
       wrapper.update()
 
-      wrapper
-        .should.have.exactly(options.length).descendants('DropdownItem')
+      wrapper.should.have.exactly(options.length).descendants('DropdownItem')
       wrapper
         .find('DropdownItem')
         .last()
@@ -1413,8 +1369,7 @@ describe('Dropdown', () => {
       wrapper.update()
 
       // one item should be gone, and the _new_ last item should be selected
-      wrapper
-        .should.have.exactly(options.length - 1).descendants('DropdownItem')
+      wrapper.should.have.exactly(options.length - 1).descendants('DropdownItem')
       wrapper
         .find('DropdownItem')
         .last()
@@ -1423,19 +1378,17 @@ describe('Dropdown', () => {
     it('has labels with delete icons', () => {
       // add a value so we have a label
       const value = [_.head(options).value]
-      wrapperRender(<Dropdown options={options} selection value={value} multiple />)
-        .should.have.descendants('.label')
+      wrapperRender(<Dropdown options={options} selection value={value} multiple />).should.have.descendants('.label')
 
-      wrapper
-        .find('.label')
-        .should.have.descendants('.delete.icon')
+      wrapper.find('.label').should.have.descendants('.delete.icon')
     })
     it('enables custom rendering', () => {
       const value = [_.head(options).value]
       const renderLabel = () => ({ content: 'My custom text!', as: 'div' })
 
-      wrapperRender(<Dropdown options={options} selection value={value} multiple renderLabel={renderLabel} />)
-        .should.have.descendants('.label')
+      wrapperRender(
+        <Dropdown options={options} selection value={value} multiple renderLabel={renderLabel} />,
+      ).should.have.descendants('.label')
 
       const label = wrapper.find('.label')
 
@@ -1501,8 +1454,7 @@ describe('Dropdown', () => {
           .at(randomIndex)
           .simulate('click', nativeEvent)
 
-        wrapper.instance()
-          .searchRef.should.eq(document.activeElement)
+        wrapper.instance().searchRef.should.eq(document.activeElement)
       })
     })
     describe('removing items', () => {
@@ -1557,9 +1509,7 @@ describe('Dropdown', () => {
     it('removes the last item when there is no search query when uncontrolled', () => {
       const value = _.map(options, 'value')
       const expected = _.dropRight(value)
-      wrapperMount(
-        <Dropdown options={options} selection defaultValue={value} multiple search onChange={spy} />,
-      )
+      wrapperMount(<Dropdown options={options} selection defaultValue={value} multiple search onChange={spy} />)
 
       // open
       wrapper.simulate('click')
@@ -1569,9 +1519,7 @@ describe('Dropdown', () => {
       spy.should.have.been.calledOnce()
       spy.should.have.been.calledWithMatch({}, { value: expected })
 
-      wrapper
-        .state('value')
-        .should.deep.equal(expected)
+      wrapper.state('value').should.deep.equal(expected)
     })
     it('does not remove the last item when there is a search query', () => {
       // search for random item
@@ -1580,9 +1528,7 @@ describe('Dropdown', () => {
       wrapperMount(<Dropdown options={options} selection value={value} multiple search onChange={spy} />)
 
       // open and simulate search
-      wrapper
-        .simulate('click')
-        .setState({ searchQuery })
+      wrapper.simulate('click').setState({ searchQuery })
 
       domEvent.keyDown(document, { key: 'Backspace' })
 
@@ -1621,8 +1567,7 @@ describe('Dropdown', () => {
     })
     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')
+      wrapperMount(<Dropdown options={options} selection onChange={spy} />).simulate('click')
 
       domEvent.keyDown(document, { key: 'Enter' })
 
@@ -1667,8 +1612,7 @@ describe('Dropdown', () => {
       const value = _.sample(options).value
       const next = _.sample(_.without(options, value)).value
 
-      wrapperMount(<Dropdown options={options} selection value={value} onChange={spy} />)
-        .setProps({ value: next })
+      wrapperMount(<Dropdown options={options} selection value={value} onChange={spy} />).setProps({ value: next })
 
       spy.should.not.have.been.called()
     })
@@ -1752,10 +1696,13 @@ describe('Dropdown', () => {
         .simulate('change', { target: { value: 'a' }, stopPropagation: _.noop })
 
       spy.should.have.been.calledOnce()
-      spy.should.have.been.calledWithMatch({ target: { value: 'a' } }, {
-        search: true,
-        searchQuery: 'a',
-      })
+      spy.should.have.been.calledWithMatch(
+        { target: { value: 'a' } },
+        {
+          search: true,
+          searchQuery: 'a',
+        },
+      )
     })
 
     it("don't open the menu on change if query's length is less than minCharacters", () => {
@@ -1764,9 +1711,7 @@ describe('Dropdown', () => {
       dropdownMenuIsClosed()
 
       // simulate search with query's length is less than minCharacters
-      wrapper
-        .find('input.search')
-        .simulate('change', { target: { value: 'a' } })
+      wrapper.find('input.search').simulate('change', { target: { value: 'a' } })
 
       dropdownMenuIsClosed()
     })
@@ -1815,24 +1760,15 @@ describe('Dropdown', () => {
         { text: 'cadabra', value: 'cadabra' },
         { text: 'bang', value: 'bang' },
       ]
-      wrapperMount(
-        <Dropdown options={customOptions} />,
-      )
-        .find('input.search')
+      wrapperMount(<Dropdown options={customOptions} />).find('input.search')
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(3)
+      wrapper.find('DropdownItem').should.have.lengthOf(3)
 
       wrapper.setProps({ options: [...customOptions, { text: 'bar', value: 'bar' }] })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(4)
+      wrapper.find('DropdownItem').should.have.lengthOf(4)
 
-      const newItem = wrapper
-        .find('DropdownItem')
-        .last()
+      const newItem = wrapper.find('DropdownItem').last()
 
       newItem.should.have.prop('text', 'bar')
       newItem.should.have.prop('value', 'bar')
@@ -1858,26 +1794,34 @@ describe('Dropdown', () => {
       wrapperShallow(<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')
+      items
+        .at(0)
+        .key()
+        .should.equal('0')
+      items
+        .at(1)
+        .key()
+        .should.equal('bar')
+      items
+        .at(2)
+        .key()
+        .should.equal('baz')
     })
   })
 
   describe('search', () => {
     it('does not add a search input when not defined', () => {
-      wrapperShallow(<Dropdown options={options} selection />)
-        .should.not.have.descendants('input.search')
+      wrapperShallow(<Dropdown options={options} selection />).should.not.have.descendants('input.search')
     })
 
     it('adds a search input when present', () => {
       wrapperShallow(<Dropdown options={options} selection search />)
-        .should.have.exactly(1).descendants(DropdownSearchInput)
+        .should.have.exactly(1)
+        .descendants(DropdownSearchInput)
     })
 
     it('sets focus to the search input on open', () => {
-      wrapperMount(<Dropdown options={options} selection search />)
-        .simulate('click')
+      wrapperMount(<Dropdown options={options} selection search />).simulate('click')
 
       const activeElement = document.activeElement
       const searchIsFocused = activeElement === document.querySelector('input.search')
@@ -1905,9 +1849,7 @@ describe('Dropdown', () => {
       wrapperMount(<Dropdown options={options} selection search />)
 
       // open and simulate search
-      wrapper
-        .simulate('click')
-        .setState({ searchQuery })
+      wrapper.simulate('click').setState({ searchQuery })
 
       // click first item (we searched for exact text)
       wrapper
@@ -1925,9 +1867,7 @@ describe('Dropdown', () => {
       dropdownMenuIsClosed()
 
       // simulate search
-      wrapper
-        .find('input.search')
-        .simulate('change', { target: { value: faker.hacker.noun() } })
+      wrapper.find('input.search').simulate('change', { target: { value: faker.hacker.noun() } })
 
       dropdownMenuIsOpen()
     })
@@ -1937,36 +1877,28 @@ describe('Dropdown', () => {
       wrapperMount(<Dropdown options={options} selection search onChange={onChangeSpy} />)
 
       // simulate search
-      wrapper
-        .find('input.search')
-        .simulate('change', { target: { value: faker.hacker.noun() } })
+      wrapper.find('input.search').simulate('change', { target: { value: faker.hacker.noun() } })
 
       onChangeSpy.should.not.have.been.called()
     })
 
     it('filters the items based on display text', () => {
-      const search = wrapperMount(<Dropdown options={options} selection search />)
-        .find('input.search')
+      const search = wrapperMount(<Dropdown options={options} selection search />).find('input.search')
 
       // search for value yields 0 results
       search.simulate('change', { target: { value: _.sample(options).value } })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(0, "Searching for an item's value did not yield 0 results.")
+      wrapper.find('DropdownItem').should.have.lengthOf(0, "Searching for an item's value did not yield 0 results.")
 
       // search for text yields 1 result
       search.simulate('change', { target: { value: _.sample(options).text } })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(1, "Searching for an item's text did not yield any results.")
+      wrapper.find('DropdownItem').should.have.lengthOf(1, "Searching for an item's text did not yield any results.")
     })
 
     it('filters the items based on custom search function', () => {
       const searchFunction = sandbox.stub().returns(options.slice(0, 2))
-      const search = wrapperMount(<Dropdown options={options} selection search={searchFunction} />)
-        .find('input.search')
+      const search = wrapperMount(<Dropdown options={options} selection search={searchFunction} />).find('input.search')
       const searchQuery = '__nonExistingSearchQuery__'
 
       // search for value yields 2 results as per our custom search function
@@ -1981,8 +1913,7 @@ describe('Dropdown', () => {
     })
 
     it('sets the selected item to the first search result', () => {
-      const search = wrapperMount(<Dropdown options={options} selection search />)
-        .find('input.search')
+      const search = wrapperMount(<Dropdown options={options} selection search />).find('input.search')
 
       // the first item is selected by default
       // avoid it to prevent false positives
@@ -2041,8 +1972,7 @@ describe('Dropdown', () => {
       wrapperMount(<Dropdown options={options} search selection />)
       wrapper.simulate('click')
 
-      wrapper.find('input.search')
-        .simulate('change', { target: { value: 'foo' } })
+      wrapper.find('input.search').simulate('change', { target: { value: 'foo' } })
       domEvent.keyDown(document, { key: 'Enter' })
 
       dropdownMenuIsOpen()
@@ -2051,19 +1981,14 @@ describe('Dropdown', () => {
 
   describe('no results message', () => {
     it('is shown when a search yields no results', () => {
-      const search = wrapperMount(<Dropdown options={options} selection search />)
-        .find('input.search')
+      const search = wrapperMount(<Dropdown options={options} selection search />).find('input.search')
 
-      wrapper
-        .find('.message')
-        .should.not.be.present()
+      wrapper.find('.message').should.not.be.present()
 
       // search for something we know will not exist
       search.simulate('change', { target: { value: '_________________' } })
 
-      wrapper
-        .find('.message')
-        .should.be.present()
+      wrapper.find('.message').should.be.present()
     })
 
     it('is not shown on multiple dropdowns with no remaining items', () => {
@@ -2076,53 +2001,46 @@ describe('Dropdown', () => {
       dropdownMenuIsOpen()
 
       // confirm there are no items
-      wrapper
-        .should.not.have.descendants('DropdownItem')
+      wrapper.should.not.have.descendants('DropdownItem')
 
       // expect no message
-      wrapper
-        .find('.message')
-        .should.not.be.present()
+      wrapper.find('.message').should.not.be.present()
     })
 
     it('uses default noResultsMessage', () => {
-      const search = wrapperMount(<Dropdown options={options} selection search />)
-        .find('input.search')
+      const search = wrapperMount(<Dropdown options={options} selection search />).find('input.search')
 
       // search for something we know will not exist
       search.simulate('change', { target: { value: '_________________' } })
 
-      wrapper
-        .find('.message')
-        .should.have.text('No results found.')
+      wrapper.find('.message').should.have.text('No results found.')
     })
 
     it('uses custom noResultsMessage', () => {
-      const search = wrapperMount(<Dropdown options={options} selection search noResultsMessage='Something custom' />)
-        .find('input.search')
+      const search = wrapperMount(
+        <Dropdown options={options} selection search noResultsMessage='Something custom' />,
+      ).find('input.search')
 
       // search for something we know will not exist
       search.simulate('change', { target: { value: '_________________' } })
 
-      wrapper
-        .find('.message')
-        .should.have.text('Something custom')
+      wrapper.find('.message').should.have.text('Something custom')
     })
 
     it('uses no noResultsMessage', () => {
-      const search = wrapperMount(<Dropdown options={options} selection search noResultsMessage='' />)
-        .find('input.search')
+      const search = wrapperMount(<Dropdown options={options} selection search noResultsMessage='' />).find(
+        'input.search',
+      )
 
       // search for something we know will not exist
       search.simulate('change', { target: { value: '_________________' } })
 
-      wrapper
-        .find('.message')
-        .should.have.text('')
+      wrapper.find('.message').should.have.text('')
     })
     it('is not shown when set to `null`', () => {
-      const search = wrapperMount(<Dropdown options={options} selection search noResultsMessage={null} />)
-        .find('input.search')
+      const search = wrapperMount(<Dropdown options={options} selection search noResultsMessage={null} />).find(
+        'input.search',
+      )
 
       // search for something we know will not exist
       search.simulate('change', { target: { value: '_________________' } })
@@ -2133,20 +2051,20 @@ describe('Dropdown', () => {
 
   describe('placeholder', () => {
     it('is present when defined', () => {
-      wrapperShallow(<Dropdown options={options} selection placeholder='hi' />)
-        .should.have.descendants('.default.text')
+      wrapperShallow(<Dropdown options={options} selection placeholder='hi' />).should.have.descendants('.default.text')
     })
     it('is not present when not defined', () => {
-      wrapperShallow(<Dropdown options={options} selection />)
-        .should.not.have.descendants('.default.text')
+      wrapperShallow(<Dropdown options={options} selection />).should.not.have.descendants('.default.text')
     })
     it('is not present when there is a value', () => {
-      wrapperShallow(<Dropdown options={options} selection value='hi' placeholder='hi' />)
-        .should.not.have.descendants('.default.text')
+      wrapperShallow(<Dropdown options={options} selection value='hi' placeholder='hi' />).should.not.have.descendants(
+        '.default.text',
+      )
     })
     it('is present on a multiple dropdown with an empty value array', () => {
-      wrapperShallow(<Dropdown options={options} selection multiple placeholder='hi' />)
-        .should.have.descendants('.default.text')
+      wrapperShallow(<Dropdown options={options} selection multiple placeholder='hi' />).should.have.descendants(
+        '.default.text',
+      )
     })
     it('has a filtered className when there is a search query', () => {
       wrapperShallow(<Dropdown options={options} selection search placeholder='hi' />)
@@ -2162,13 +2080,11 @@ describe('Dropdown', () => {
       const instance = wrapper.instance()
       sandbox.spy(instance, 'renderText')
 
-      instance.renderText
-        .should.not.have.been.called()
+      instance.renderText.should.not.have.been.called()
 
       instance.render()
 
-      instance.renderText
-        .should.have.been.called()
+      instance.renderText.should.have.been.called()
     })
   })
 
@@ -2178,12 +2094,9 @@ describe('Dropdown', () => {
         <Dropdown text='required prop'>
           <Dropdown.Menu data-find-me />
         </Dropdown>,
-      )
-        .should.contain.descendants('DropdownMenu')
+      ).should.contain.descendants('DropdownMenu')
 
-      wrapper
-        .find('DropdownMenu')
-        .should.have.prop('data-find-me', true)
+      wrapper.find('DropdownMenu').should.have.prop('data-find-me', true)
     })
 
     it('opens on click', () => {
@@ -2203,12 +2116,9 @@ describe('Dropdown', () => {
         <Dropdown text='required prop'>
           <Dropdown.Menu data-foo-bar />
         </Dropdown>,
-      )
-        .should.contain.descendants('DropdownMenu')
+      ).should.contain.descendants('DropdownMenu')
 
-      wrapper
-        .find('DropdownMenu')
-        .should.have.prop('data-foo-bar', true)
+      wrapper.find('DropdownMenu').should.have.prop('data-foo-bar', true)
     })
 
     it("merges the user's menu className", () => {
@@ -2216,12 +2126,9 @@ describe('Dropdown', () => {
         <Dropdown text='required prop'>
           <Dropdown.Menu className='foo-bar' />
         </Dropdown>,
-      )
-        .should.contain.descendants('DropdownMenu')
+      ).should.contain.descendants('DropdownMenu')
 
-      const menu = wrapper
-        .find('DropdownMenu')
-        .shallow()
+      const menu = wrapper.find('DropdownMenu').shallow()
 
       menu.should.have.className('menu')
       menu.should.have.className('foo-bar')
@@ -2236,37 +2143,29 @@ describe('Dropdown', () => {
     ]
 
     it('adds an option for arbitrary search value', () => {
-      const search = wrapperMount(<Dropdown options={customOptions} selection search allowAdditions />)
-        .find('input.search')
+      const search = wrapperMount(<Dropdown options={customOptions} selection search allowAdditions />).find(
+        'input.search',
+      )
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(3)
+      wrapper.find('DropdownItem').should.have.lengthOf(3)
 
       search.simulate('change', { target: { value: 'boo' } })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(1)
+      wrapper.find('DropdownItem').should.have.lengthOf(1)
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.prop('value', 'boo')
+      wrapper.find('DropdownItem').should.have.prop('value', 'boo')
     })
 
     it('adds an option for prefix search value', () => {
-      const search = wrapperMount(<Dropdown options={customOptions} selection search allowAdditions />)
-        .find('input.search')
+      const search = wrapperMount(<Dropdown options={customOptions} selection search allowAdditions />).find(
+        'input.search',
+      )
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(3)
+      wrapper.find('DropdownItem').should.have.lengthOf(3)
 
       search.simulate('change', { target: { value: 'a' } })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(4)
+      wrapper.find('DropdownItem').should.have.lengthOf(4)
 
       wrapper
         .find('DropdownItem')
@@ -2275,23 +2174,20 @@ describe('Dropdown', () => {
     })
 
     it('uses default additionLabel', () => {
-      const search = wrapperMount(<Dropdown options={customOptions} selection search allowAdditions />)
-        .find('input.search')
+      const search = wrapperMount(<Dropdown options={customOptions} selection search allowAdditions />).find(
+        'input.search',
+      )
 
       search.simulate('change', { target: { value: 'boo' } })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(1)
+      wrapper.find('DropdownItem').should.have.lengthOf(1)
 
       wrapper
         .find('DropdownItem')
         .last()
         .should.have.prop('className', 'addition')
 
-      const text = wrapper
-        .find('DropdownItem')
-        .prop('text')
+      const text = wrapper.find('DropdownItem').prop('text')
 
       expect(text[0]).to.equal('Add ')
       shallow(text[1]).equals(<b key='addition-query'>boo</b>)
@@ -2300,23 +2196,18 @@ describe('Dropdown', () => {
     it('uses custom additionLabel string', () => {
       const search = wrapperMount(
         <Dropdown options={customOptions} selection search allowAdditions additionLabel='New: ' />,
-      )
-        .find('input.search')
+      ).find('input.search')
 
       search.simulate('change', { target: { value: 'boo' } })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(1)
+      wrapper.find('DropdownItem').should.have.lengthOf(1)
 
       wrapper
         .find('DropdownItem')
         .last()
         .should.have.prop('className', 'addition')
 
-      const text = wrapper
-        .find('DropdownItem')
-        .prop('text')
+      const text = wrapper.find('DropdownItem').prop('text')
 
       expect(text[0]).to.equal('New: ')
       shallow(text[1]).equals(<b key='addition-query'>boo</b>)
@@ -2325,23 +2216,18 @@ describe('Dropdown', () => {
     it('uses custom additionLabel element', () => {
       const search = wrapperMount(
         <Dropdown options={customOptions} selection search allowAdditions additionLabel={<i>New: </i>} />,
-      )
-        .find('input.search')
+      ).find('input.search')
 
       search.simulate('change', { target: { value: 'boo' } })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(1)
+      wrapper.find('DropdownItem').should.have.lengthOf(1)
 
       wrapper
         .find('DropdownItem')
         .last()
         .should.have.prop('className', 'addition')
 
-      const text = wrapper
-        .find('DropdownItem')
-        .prop('text')
+      const text = wrapper.find('DropdownItem').prop('text')
 
       shallow(text[0]).equals(<i key='label'>New: </i>)
       shallow(text[1]).equals(<b key='addition-query'>boo</b>)
@@ -2350,23 +2236,18 @@ describe('Dropdown', () => {
     it('uses no additionLabel', () => {
       const search = wrapperMount(
         <Dropdown options={customOptions} selection search allowAdditions additionLabel='' />,
-      )
-        .find('input.search')
+      ).find('input.search')
 
       search.simulate('change', { target: { value: 'boo' } })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(1)
+      wrapper.find('DropdownItem').should.have.lengthOf(1)
 
       wrapper
         .find('DropdownItem')
         .last()
         .should.have.prop('className', 'addition')
 
-      const text = wrapper
-        .find('DropdownItem')
-        .prop('text')
+      const text = wrapper.find('DropdownItem').prop('text')
 
       expect(text[0]).to.equal('')
       shallow(text[1]).equals(<b key='addition-query'>boo</b>)
@@ -2375,14 +2256,11 @@ describe('Dropdown', () => {
     it('keeps custom value option (bottom) when options change', () => {
       const search = wrapperMount(
         <Dropdown options={customOptions} selection search allowAdditions additionPosition='bottom' />,
-      )
-        .find('input.search')
+      ).find('input.search')
 
       search.simulate('change', { target: { value: 'a' } })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(4)
+      wrapper.find('DropdownItem').should.have.lengthOf(4)
 
       wrapper
         .find('DropdownItem')
@@ -2391,9 +2269,7 @@ describe('Dropdown', () => {
 
       wrapper.setProps({ options: [...customOptions, { text: 'bar', value: 'bar' }] })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(5)
+      wrapper.find('DropdownItem').should.have.lengthOf(5)
 
       wrapper
         .find('DropdownItem')
@@ -2402,16 +2278,13 @@ describe('Dropdown', () => {
     })
 
     it('keeps custom value option (top) when options change', () => {
-      const search = wrapperMount(
-        <Dropdown options={customOptions} selection search allowAdditions />,
+      const search = wrapperMount(<Dropdown options={customOptions} selection search allowAdditions />).find(
+        'input.search',
       )
-        .find('input.search')
 
       search.simulate('change', { target: { value: 'a' } })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(4)
+      wrapper.find('DropdownItem').should.have.lengthOf(4)
 
       wrapper
         .find('DropdownItem')
@@ -2420,9 +2293,7 @@ describe('Dropdown', () => {
 
       wrapper.setProps({ options: [...customOptions, { text: 'bar', value: 'bar' }] })
 
-      wrapper
-        .find('DropdownItem')
-        .should.have.lengthOf(5)
+      wrapper.find('DropdownItem').should.have.lengthOf(5)
 
       wrapper
         .find('DropdownItem')
@@ -2434,16 +2305,8 @@ describe('Dropdown', () => {
       const onAddItem = sandbox.spy()
       const onChange = sandbox.spy()
       const search = wrapperMount(
-        <Dropdown
-          allowAdditions
-          onAddItem={onAddItem}
-          onChange={onChange}
-          options={customOptions}
-          search
-          selection
-        />,
-      )
-        .find('input.search')
+        <Dropdown allowAdditions onAddItem={onAddItem} onChange={onChange} options={customOptions} search selection />,
+      ).find('input.search')
 
       search.simulate('change', { target: { value: 'boo' } })
 
@@ -2462,16 +2325,8 @@ describe('Dropdown', () => {
       const onAddItem = sandbox.spy()
       const onChange = sandbox.spy()
       const search = wrapperMount(
-        <Dropdown
-          allowAdditions
-          onAddItem={onAddItem}
-          onChange={onChange}
-          options={customOptions}
-          search
-          selection
-        />,
-      )
-        .find('input.search')
+        <Dropdown allowAdditions onAddItem={onAddItem} onChange={onChange} options={customOptions} search selection />,
+      ).find('input.search')
 
       search.simulate('change', { target: { value: 'boo' } })
       domEvent.keyDown(document, { key: 'Enter' })
@@ -2483,10 +2338,9 @@ describe('Dropdown', () => {
     })
 
     it('clears value of the searchQuery when selection is only option', () => {
-      const search = wrapperMount(
-        <Dropdown options={customOptions} selection search allowAdditions />,
+      const search = wrapperMount(<Dropdown options={customOptions} selection search allowAdditions />).find(
+        'input.search',
       )
-        .find('input.search')
 
       search.simulate('change', { target: { value: 'boo' } })
       domEvent.keyDown(document, { key: 'Enter' })
@@ -2504,8 +2358,7 @@ describe('Dropdown', () => {
         .should.contain.text(text)
     })
     it('does not render a header when not present', () => {
-      wrapperRender(<Dropdown options={options} />)
-        .should.not.have.descendants('.menu .header')
+      wrapperRender(<Dropdown options={options} />).should.not.have.descendants('.menu .header')
     })
   })
 
@@ -2551,13 +2404,7 @@ describe('Dropdown', () => {
     it('is on by default', () => {
       const spy = sandbox.spy()
 
-      wrapperMount(
-        <Dropdown
-          options={options}
-          defaultValue={options[0].value}
-          onChange={spy}
-        />,
-      )
+      wrapperMount(<Dropdown options={options} defaultValue={options[0].value} onChange={spy} />)
 
       // open
       wrapper.simulate('click')
@@ -2572,14 +2419,7 @@ describe('Dropdown', () => {
       const spy = sandbox.spy()
       const value = options[0].value
 
-      wrapperMount(
-        <Dropdown
-          options={options}
-          defaultValue={value}
-          selectOnNavigation={false}
-          onChange={spy}
-        />,
-      )
+      wrapperMount(<Dropdown options={options} defaultValue={value} selectOnNavigation={false} onChange={spy} />)
 
       // open
       wrapper.simulate('click')