84 lines
2.6 KiB
JavaScript
84 lines
2.6 KiB
JavaScript
import expect from 'expect';
|
|
import utils from '../../utils/testing';
|
|
import ReactTestUtils from 'react-addons-test-utils';
|
|
|
|
import React, { Component } from 'react';
|
|
import ReactDOM from 'react-dom';
|
|
|
|
import Tabs, { Tabs as RawTabs } from '../Tabs';
|
|
import Tab from '../Tab';
|
|
import TabContent from '../TabContent';
|
|
import theme from '../theme.scss';
|
|
|
|
const getRenderedClassName = (tree, TargetComponent) => {
|
|
const rendered = ReactTestUtils.findRenderedComponentWithType(tree, TargetComponent);
|
|
return ReactDOM.findDOMNode(rendered).getAttribute('class');
|
|
};
|
|
|
|
describe('Tabs', function () {
|
|
let tabContents, composition;
|
|
|
|
it('only renders the current tab', function () {
|
|
class Composition extends Component {
|
|
constructor () {
|
|
super();
|
|
this.state = { index: 0 };
|
|
}
|
|
|
|
render () {
|
|
return (
|
|
<Tabs index={this.state.index}>
|
|
<Tab label="tab1">tab1</Tab>
|
|
<Tab label="tab2">tab2</Tab>
|
|
</Tabs>
|
|
);
|
|
}
|
|
}
|
|
|
|
// initial render
|
|
composition = utils.renderComponent(Composition);
|
|
|
|
tabContents = ReactTestUtils
|
|
.scryRenderedComponentsWithType(composition, TabContent);
|
|
|
|
expect(tabContents.length).toEqual(1);
|
|
expect(tabContents[0].props.tabIndex).toEqual(0);
|
|
|
|
// after tab change
|
|
composition.setState({ index: 1 });
|
|
composition.forceUpdate();
|
|
|
|
tabContents = ReactTestUtils
|
|
.scryRenderedComponentsWithType(composition, TabContent);
|
|
|
|
expect(tabContents.length).toEqual(1);
|
|
expect(tabContents[0].props.tabIndex).toEqual(1);
|
|
});
|
|
|
|
describe('#render', function () {
|
|
it('does not use fixed by default', function () {
|
|
const tree = ReactTestUtils.renderIntoDocument(<Tabs theme={theme} />);
|
|
const className = getRenderedClassName(tree, RawTabs);
|
|
expect(className).toNotContain(theme.fixed);
|
|
});
|
|
|
|
it('uses fixed when set', function () {
|
|
const tree = ReactTestUtils.renderIntoDocument(<Tabs theme={theme} fixed />);
|
|
const className = getRenderedClassName(tree, RawTabs);
|
|
expect(className).toContain(theme.fixed);
|
|
});
|
|
|
|
it('does not use inverse by default', function () {
|
|
const tree = ReactTestUtils.renderIntoDocument(<Tabs theme={theme} />);
|
|
const className = getRenderedClassName(tree, RawTabs);
|
|
expect(className).toNotContain(theme.inverse);
|
|
});
|
|
|
|
it('uses inverse when set', function () {
|
|
const tree = ReactTestUtils.renderIntoDocument(<Tabs theme={theme} inverse />);
|
|
const className = getRenderedClassName(tree, RawTabs);
|
|
expect(className).toContain(theme.inverse);
|
|
});
|
|
});
|
|
});
|