diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js index c931333afc..d2116e0942 100644 --- a/src/modules/Dropdown/Dropdown.js +++ b/src/modules/Dropdown/Dropdown.js @@ -447,6 +447,7 @@ export default class Dropdown extends Component { document.addEventListener('click', this.closeOnDocumentClick) document.removeEventListener('keydown', this.openOnArrow) document.removeEventListener('keydown', this.openOnSpace) + this.scrollSelectedItemIntoView() } else if (prevState.open && !this.state.open) { debug('dropdown closed') this.handleClose() @@ -939,8 +940,11 @@ export default class Dropdown extends Component { scrollSelectedItemIntoView = () => { debug('scrollSelectedItemIntoView()') + if (!this.ref) return const menu = this.ref.querySelector('.menu.visible') + if (!menu) return const item = menu.querySelector('.item.selected') + if (!item) return debug(`menu: ${menu}`) debug(`item: ${item}`) const isOutOfUpperView = item.offsetTop < menu.scrollTop @@ -962,6 +966,7 @@ export default class Dropdown extends Component { if (onOpen) onOpen(e, this.props) this.trySetState({ open: true }) + this.scrollSelectedItemIntoView() } close = (e) => { diff --git a/test/specs/modules/Dropdown/Dropdown-test.js b/test/specs/modules/Dropdown/Dropdown-test.js index ee041c62f8..b589a3df79 100644 --- a/test/specs/modules/Dropdown/Dropdown-test.js +++ b/test/specs/modules/Dropdown/Dropdown-test.js @@ -1066,6 +1066,20 @@ describe('Dropdown', () => { .setProps({ open: true }) dropdownMenuIsOpen() }) + it('calls scrollSelectedItemIntoView when changed from false to true', () => { + wrapperMount() + + const instance = wrapper.instance() + sandbox.spy(instance, 'scrollSelectedItemIntoView') + + instance.scrollSelectedItemIntoView + .should.not.have.been.called() + + wrapper.setProps({ open: true }) + + instance.scrollSelectedItemIntoView + .should.have.been.calledOnce() + }) }) describe('multiple', () => {