diff --git a/examples/nested.html b/examples/nested.html new file mode 100644 index 00000000..e69de29b diff --git a/examples/nested.js b/examples/nested.js new file mode 100644 index 00000000..956a2d16 --- /dev/null +++ b/examples/nested.js @@ -0,0 +1,59 @@ +/* eslint no-console:0 */ + +import React from 'react'; +import ReactDOM from 'react-dom'; +import Trigger from 'rc-trigger'; +import 'rc-trigger/assets/index.less'; + +const builtinPlacements = { + left: { + points: ['cr', 'cl'], + }, + right: { + points: ['cl', 'cr'], + }, + top: { + points: ['bc', 'tc'], + }, + bottom: { + points: ['tc', 'bc'], + }, + topLeft: { + points: ['bl', 'tl'], + }, + topRight: { + points: ['br', 'tr'], + }, + bottomRight: { + points: ['tr', 'br'], + }, + bottomLeft: { + points: ['tl', 'bl'], + }, +}; + +const Test = React.createClass({ + render() { + return ( +
+ i am a click popup
}> + i am a hover popup}> + trigger + + + + ); + }, +}); + +ReactDOM.render(
+ +
, document.getElementById('__react-content')); diff --git a/src/Trigger.jsx b/src/Trigger.jsx index f7644df6..cd8b7808 100644 --- a/src/Trigger.jsx +++ b/src/Trigger.jsx @@ -300,6 +300,11 @@ const Trigger = React.createClass({ newChildProps.onBlur = createChainedFunction(this.onBlur, childProps.onBlur); } + ['onClick', 'onMouseDown', 'onTouchStart', 'onMouseEnter', + 'onMouseLeave', 'onFocus', 'onBlur'].forEach(handler => { + newChildProps[handler] = createChainedFunction(props[handler], newChildProps[handler]); + }); + return React.cloneElement(child, newChildProps); }, }); diff --git a/tests/index.spec.js b/tests/index.spec.js index 839b4c14..11632cdc 100644 --- a/tests/index.spec.js +++ b/tests/index.spec.js @@ -167,6 +167,49 @@ describe('rc-trigger', function main() { next(); }], done); }); + + it('nested action works', (done)=> { + const Test = React.createClass({ + render() { + return ( + click trigger}> + hover trigger}> +
trigger
+
+
+ ); + }, + }); + const trigger = ReactDOM.render(, div); + + const target = scryRenderedDOMComponentsWithClass(trigger, 'target')[0]; + // can not simulate mouseenter + Simulate.mouseEnter(target); + Simulate.click(target); + async.series([timeout(100), (next)=> { + const clickPopupDomNode = trigger.refs.clickTrigger.getPopupDomNode(); + const hoverPopupDomNode = trigger.refs.hoverTrigger.getPopupDomNode(); + expect(clickPopupDomNode).to.be.ok(); + expect(hoverPopupDomNode).to.be.ok(); + Simulate.mouseLeave(target); + next(); + }, timeout(100), (next)=> { + const hoverPopupDomNode = trigger.refs.hoverTrigger.getPopupDomNode(); + expect($(hoverPopupDomNode).css('display')).to.be('none'); + Simulate.click(target); + next(); + }, timeout(100), (next)=> { + const clickPopupDomNode = trigger.refs.clickTrigger.getPopupDomNode(); + expect($(clickPopupDomNode).css('display')).to.be('none'); + next(); + }], done); + }); }); describe('placement', ()=> {