diff --git a/src/Tooltip.js b/src/Tooltip.js index 0cecc0dc9b..9d78e6f1ec 100644 --- a/src/Tooltip.js +++ b/src/Tooltip.js @@ -43,7 +43,11 @@ const Tooltip = React.createClass({ /** * Title text */ - title: React.PropTypes.node + title: React.PropTypes.node, + /** + * Style hash + */ + style: React.PropTypes.object }, getDefaultProps() { @@ -60,7 +64,8 @@ const Tooltip = React.createClass({ const style = { 'left': this.props.positionLeft, - 'top': this.props.positionTop + 'top': this.props.positionTop, + ...this.props.style }; const arrowStyle = { diff --git a/test/TooltipSpec.js b/test/TooltipSpec.js index 01b93bc42c..44d2e442cb 100644 --- a/test/TooltipSpec.js +++ b/test/TooltipSpec.js @@ -5,12 +5,25 @@ import Tooltip from '../src/Tooltip'; describe('Tooltip', function () { it('Should output a tooltip with content', function () { let instance = ReactTestUtils.renderIntoDocument( - + Tooltip Content ); assert.ok(ReactTestUtils.findRenderedDOMComponentWithTag(instance, 'strong')); + const tooltip = ReactTestUtils.findRenderedDOMComponentWithClass(instance, 'tooltip'); + assert.deepEqual(tooltip.props.style, {top: 10, left: 20}); }); + describe('When a style property is provided', function () { + it('Should render a tooltip with merged styles', function () { + let instance = ReactTestUtils.renderIntoDocument( + + Tooltip Content + + ); + const tooltip = ReactTestUtils.findRenderedDOMComponentWithClass(instance, 'tooltip'); + assert.deepEqual(tooltip.props.style, {opacity: 0.9, top: 10, left: 20}); + }); + }); });