diff --git a/examples/simple.js b/examples/simple.js index fd91b16..dff4c48 100644 --- a/examples/simple.js +++ b/examples/simple.js @@ -64,7 +64,7 @@ const Test = React.createClass({ }, onVisibleChange(visible) { - console.log('tooltip', visible); + console.log('tooltip', visible); // eslint-disable-line no-console }, onDestroyCheck() { diff --git a/index.js b/index.js index 432390c..fd4d7e5 100644 --- a/index.js +++ b/index.js @@ -1,2 +1 @@ - module.exports = require('./src/'); diff --git a/tests/index.js b/tests/index.js index 6a4c45d..a695bed 100644 --- a/tests/index.js +++ b/tests/index.js @@ -2,77 +2,87 @@ import '../assets/bootstrap.less'; import expect from 'expect.js'; import React from 'react'; import ReactDOM from 'react-dom'; -import TestUtils from 'react-addons-test-utils'; +import { Simulate } from 'react-addons-test-utils'; import $ from 'jquery'; import Tooltip from '../index'; import async from 'async'; window.$ = $; -const Simulate = TestUtils.Simulate; -function timeout(ms) { +const timeout = (ms) => { return (done) => { setTimeout(done, ms); }; -} +}; -describe('rc-tooltip', function run() { - this.timeout(40000); - const div = document.createElement('div'); - div.style.margin = '100px'; - document.body.insertBefore(div, document.body.firstChild); +const expectComponentPopupToBeOk = (component) => { + const popupDomNode = component.getPopupDomNode(); + expect(popupDomNode).to.be.ok(); +}; + +const expectPopupToHaveContent = (component, content) => { + const popupDomNode = component.getPopupDomNode(); + expect($(popupDomNode).find('.x-content').html()).to.be(content); + expect(popupDomNode).to.be.ok(); +}; + +const expectPopupToBeHidden = (component) => { + const popupDomNode = component.getPopupDomNode(); + expect($(popupDomNode).css('display')).to.be('none'); +}; + +const verifyContent = (component, content, done) => { + const componentDomNode = ReactDOM.findDOMNode(component); + async.series([timeout(20), (next) => { + expectPopupToHaveContent(component, content); + expectComponentPopupToBeOk(component); + Simulate.click(componentDomNode); + next(); + }, timeout(20), (next) => { + expectPopupToBeHidden(component); + next(); + }], done); +}; + +describe('rc-tooltip', () => { + let div; + before(() => { + timeout(40000); + div = document.createElement('div'); + div.style.margin = '100px'; + document.body.insertBefore(div, document.body.firstChild); + }); afterEach(() => { ReactDOM.unmountComponentAtNode(div); }); - describe('trigger', () => { - it('works', (done) => { + describe('shows and hides itself on click', () => { + it('using an element overlay', (done) => { const tooltip = ReactDOM.render( tooltip2} + overlay={Tooltip content} > -
click
+
Click this
, div); - const domNode = ReactDOM.findDOMNode(tooltip); - Simulate.click(domNode); - async.series([timeout(20), (next) => { - const popupDomNode = tooltip.getPopupDomNode(); - expect($(popupDomNode).find('.x-content').html()).to.be('tooltip2'); - expect(popupDomNode).to.be.ok(); - Simulate.click(domNode); - next(); - }, timeout(20), (next) => { - const popupDomNode = tooltip.getPopupDomNode(); - expect($(popupDomNode).css('display')).to.be('none'); - next(); - }], done); + const componentDomNode = ReactDOM.findDOMNode(tooltip); + Simulate.click(componentDomNode); + verifyContent(tooltip, 'Tooltip content', done); }); - }); - describe('trigger-functon', () => { - it('works with a function overlay', (done) => { + + it('using a function overlay', (done) => { const tooltip = ReactDOM.render( (tooltip)} + overlay={() => (Tooltip content)} > -
click
+
Click this
, div); - const domNode = ReactDOM.findDOMNode(tooltip); - Simulate.click(domNode); - async.series([timeout(20), (next) => { - const popupDomNode = tooltip.getPopupDomNode(); - expect($(popupDomNode).find('.x-content').html()).to.be('tooltip'); - expect(popupDomNode).to.be.ok(); - Simulate.click(domNode); - next(); - }, timeout(20), (next) => { - const popupDomNode = tooltip.getPopupDomNode(); - expect($(popupDomNode).css('display')).to.be('none'); - next(); - }], done); + const componentDomNode = ReactDOM.findDOMNode(tooltip); + Simulate.click(componentDomNode); + verifyContent(tooltip, 'Tooltip content', done); }); }); });