[fixed] ModalTrigger passes onMouseOver prop and onMouseOut prop to child

Author: teloo

src/ModalTrigger.js

@@ -49,12 +49,13 @@ const ModalTrigger = React.createClass({
 
   render() {
     let child = React.Children.only(this.props.children);
-    return cloneElement(
-      child,
-      {
-        onClick: createChainedFunction(child.props.onClick, this.toggle)
-      }
-    );
+    let props = {};
+
+    props.onClick = createChainedFunction(child.props.onClick, this.toggle);
+    props.onMouseOver = createChainedFunction(child.props.onMouseOver, this.props.onMouseOver);
+    props.onMouseOut = createChainedFunction(child.props.onMouseOut, this.props.onMouseOut);
+
+    return cloneElement(child, props);
   }
 });
 

test/ModalTriggerSpec.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import ReactTestUtils from 'react/lib/ReactTestUtils';
+import ModalTrigger from '../src/ModalTrigger';
+
+describe('ModalTrigger', function() {
+  it('Should create ModalTrigger element', function() {
+    let instance = ReactTestUtils.renderIntoDocument(
+      <ModalTrigger modal={<div>test</div>}>
+        <button>button</button>
+      </ModalTrigger>
+    );
+    let modalTrigger = instance.getDOMNode();
+    assert.equal(modalTrigger.nodeName, 'BUTTON');
+  });
+
+  it('Should pass ModalTrigger onMouseOver prop to children', function() {
+    let called = false;
+    let callback = function() {
+      called = true;
+    };
+    let instance = ReactTestUtils.renderIntoDocument(
+      <ModalTrigger modal={<div>test</div>} onMouseOver={callback}>
+        <button>button</button>
+      </ModalTrigger>
+    );
+    let modalTrigger = instance.getDOMNode();
+    ReactTestUtils.Simulate.mouseOver(modalTrigger);
+    assert.equal(called, true);
+  });
+
+  it('Should pass ModalTrigger onMouseOut prop to children', function() {
+    let called = false;
+    let callback = function() {
+      called = true;
+    };
+    let instance = ReactTestUtils.renderIntoDocument(
+      <ModalTrigger modal={<div>test</div>} onMouseOut={callback}>
+        <button>button</button>
+      </ModalTrigger>
+    );
+    let modalTrigger = instance.getDOMNode();
+    ReactTestUtils.Simulate.mouseOut(modalTrigger);
+    assert.equal(called, true);
+  });
+});