diff --git a/src/MenuItem.js b/src/MenuItem.js index e2f6777301..a6ff69de23 100644 --- a/src/MenuItem.js +++ b/src/MenuItem.js @@ -1,7 +1,9 @@ -import React from 'react'; import classnames from 'classnames'; +import React from 'react'; import all from 'react-prop-types/lib/all'; + import SafeAnchor from './SafeAnchor'; +import createChainedFunction from './utils/createChainedFunction'; export default class MenuItem extends React.Component { constructor(props) { @@ -35,6 +37,8 @@ export default class MenuItem extends React.Component { ); } + const {className, style, href, onClick, ...props} = this.props; + const classes = { disabled: this.props.disabled, active: this.props.active @@ -42,20 +46,16 @@ export default class MenuItem extends React.Component { return (
  • - {this.props.children} - + href={href || ''} + onClick={createChainedFunction(onClick, this.handleClick)} + />
  • ); } @@ -80,6 +80,7 @@ MenuItem.propTypes = { href: React.PropTypes.string, target: React.PropTypes.string, title: React.PropTypes.string, + onClick: React.PropTypes.func, onKeyDown: React.PropTypes.func, onSelect: React.PropTypes.func, id: React.PropTypes.oneOfType([ diff --git a/test/MenuItemSpec.js b/test/MenuItemSpec.js index e8a88395ef..7fb7037220 100644 --- a/test/MenuItemSpec.js +++ b/test/MenuItemSpec.js @@ -82,6 +82,21 @@ describe('MenuItem', () => { ReactTestUtils.Simulate.click(anchor); }); + it('should call custom onClick', () => { + const handleClick = sinon.spy(); + const handleSelect = sinon.spy(); + + const instance = ReactTestUtils.renderIntoDocument( + Item + ); + const anchor = ReactTestUtils.findRenderedDOMComponentWithTag(instance, 'A'); + + ReactTestUtils.Simulate.click(anchor); + + expect(handleClick).to.have.been.called; + expect(handleSelect).to.have.been.called; + }); + it('does not fire onSelect when divider is clicked', () => { const handleSelect = () => { throw new Error('Should not invoke onSelect with divider flag applied');