add tooltip test coverage

__tests__/components/Tooltip.test.jsx

@@ -3,10 +3,53 @@ import { mount } from 'enzyme';
 import Tooltip from '../../src/components/Tooltip';
 
 describe('<Tooltip />', () => {
-  let wrapper;
+  let elem;
+  let content;
+  let mouseOverHandler;
+  let mouseOutHandler;
 
   test('initially renders without crashing', () => {
-    wrapper = mount(<Tooltip />);
-    expect(wrapper.length).toBe(1);
+    elem = mount(<Tooltip />);
+    expect(elem.length).toBe(1);
+  });
+
+  test('shows/hides with mouse over and leave', () => {
+    elem = mount(<Tooltip />);
+    mouseOverHandler = elem.find('.mouseOverHandler');
+    mouseOutHandler = elem.find('.mouseOutHandler');
+    expect(elem.state().isDisplayed).toBe(false);
+    elem.update();
+    content = elem.find('.pf-c-tooltip__content');
+    expect(content.length).toBe(0);
+    mouseOverHandler.props().onMouseOver();
+    expect(elem.state().isDisplayed).toBe(true);
+    elem.update();
+    content = elem.find('.pf-c-tooltip__content');
+    expect(content.length).toBe(1);
+    mouseOutHandler.props().onMouseLeave();
+    expect(elem.state().isDisplayed).toBe(false);
+    elem.update();
+    content = elem.find('.pf-c-tooltip__content');
+    expect(content.length).toBe(0);
+  });
+
+  test('shows/hides with focus and blur', () => {
+    elem = mount(<Tooltip />);
+    mouseOverHandler = elem.find('.mouseOverHandler');
+    mouseOutHandler = elem.find('.mouseOutHandler');
+    expect(elem.state().isDisplayed).toBe(false);
+    elem.update();
+    content = elem.find('.pf-c-tooltip__content');
+    expect(content.length).toBe(0);
+    mouseOverHandler.props().onFocus();
+    expect(elem.state().isDisplayed).toBe(true);
+    elem.update();
+    content = elem.find('.pf-c-tooltip__content');
+    expect(content.length).toBe(1);
+    mouseOutHandler.props().onBlur();
+    expect(elem.state().isDisplayed).toBe(false);
+    elem.update();
+    content = elem.find('.pf-c-tooltip__content');
+    expect(content.length).toBe(0);
   });
 });

src/components/Tooltip/Tooltip.jsx

@@ -45,7 +45,9 @@ class Tooltip extends React.Component {
     return (
       <span
         style={{ position: 'relative' }}
+        className="mouseOutHandler"
         onMouseLeave={() => this.setState({ isDisplayed: false })}
+        onBlur={() => this.setState({ isDisplayed: false })}
       >
         { isDisplayed
           && (
@@ -61,6 +63,7 @@ class Tooltip extends React.Component {
           )
         }
         <span
+          className="mouseOverHandler"
           onMouseOver={() => this.setState({ isDisplayed: true })}
           onFocus={() => this.setState({ isDisplayed: true })}
         >