Skip to content

Commit

Permalink
Move and refactor CollapsableNavSpec
Browse files Browse the repository at this point in the history
  • Loading branch information
AlexKVal committed Apr 28, 2015
1 parent 626fefa commit 333c663
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 22 deletions.
2 changes: 1 addition & 1 deletion src/CollapsibleNav.js
Original file line number Diff line number Diff line change
Expand Up @@ -110,7 +110,7 @@ const CollapsibleNav = React.createClass({
activeKey: this.props.activeKey,
activeHref: this.props.activeHref,
onSelect: createChainedFunction(child.props.onSelect, this.props.onSelect),
ref: 'collapsable_' + key,
ref: 'collapsible_' + key,
key: key,
navItem: true
}
Expand Down
42 changes: 21 additions & 21 deletions test/CollapsableNavSpec.js → test/CollapsibleNavSpec.js
Original file line number Diff line number Diff line change
@@ -1,22 +1,22 @@
import React from 'react';
import ReactTestUtils from 'react/lib/ReactTestUtils';
import Navbar from '../src/Navbar';
import CollapsableNav from '../src/CollapsableNav';
import CollapsibleNav from '../src/CollapsibleNav';
import Nav from '../src/Nav';
import NavItem from '../src/NavItem';

describe('CollapsableNav', function () {
describe('CollapsibleNav', function () {
it('Should create div and add collapse class', function () {
let Parent = React.createClass({
render: function() {
return (
<Navbar toggleNavKey={1}>
<CollapsableNav eventKey={1}>
<CollapsibleNav eventKey={1}>
<Nav>
<NavItem eventKey={1} ref='item1'>Item 1 content</NavItem>
<NavItem eventKey={2} ref='item2'>Item 2 content</NavItem>
</Nav>
</CollapsableNav>
</CollapsibleNav>
</Navbar>
);
}
Expand All @@ -30,7 +30,7 @@ describe('CollapsableNav', function () {
render: function() {
return (
<Navbar toggleNavKey={1}>
<CollapsableNav eventKey={1} ref='collapsable_object'>
<CollapsibleNav eventKey={1} ref='collapsible_object'>
<Nav>
<NavItem eventKey={1} ref='item1'>Item 1 content</NavItem>
<NavItem eventKey={2} ref='item2'>Item 2 content</NavItem>
Expand All @@ -39,33 +39,33 @@ describe('CollapsableNav', function () {
<NavItem eventKey={1} ref='item1'>Item 1 content</NavItem>
<NavItem eventKey={2} ref='item2'>Item 2 content</NavItem>
</Nav>
</CollapsableNav>
</CollapsibleNav>
</Navbar>
);
}
});
let instance = ReactTestUtils.renderIntoDocument(<Parent />);
assert.ok(ReactTestUtils.findRenderedComponentWithType(instance.refs.collapsable_object.refs.collapsable_0, Nav));
assert.ok(ReactTestUtils.findRenderedComponentWithType(instance.refs.collapsable_object.refs.collapsable_1, Nav));
assert.ok(ReactTestUtils.findRenderedComponentWithType(instance.refs.collapsible_object.refs.collapsible_0, Nav));
assert.ok(ReactTestUtils.findRenderedComponentWithType(instance.refs.collapsible_object.refs.collapsible_1, Nav));
});

it('Should just render children and move along if not in <Navbar>', function () {
let Parent = React.createClass({
render: function() {
return (
<CollapsableNav eventKey={1}>
<CollapsibleNav eventKey={1}>
<Nav>
<NavItem eventKey={1} ref='item1'>Item 1 content</NavItem>
<NavItem eventKey={2} ref='item2'>Item 2 content</NavItem>
</Nav>
</CollapsableNav>
</CollapsibleNav>
);
}
});
let instance = ReactTestUtils.renderIntoDocument(<Parent />);
let collapsableNav = ReactTestUtils.findRenderedComponentWithType(instance, CollapsableNav);
assert.notOk(collapsableNav.getDOMNode().className.match(/\navbar-collapse\b/));
let nav = ReactTestUtils.findRenderedComponentWithType(collapsableNav.refs.nocollapse_0, Nav);
let collapsibleNav = ReactTestUtils.findRenderedComponentWithType(instance, CollapsibleNav);
assert.notOk(collapsibleNav.getDOMNode().className.match(/\navbar-collapse\b/));
let nav = ReactTestUtils.findRenderedComponentWithType(collapsibleNav.refs.nocollapse_0, Nav);
assert.ok(nav);
});

Expand All @@ -74,39 +74,39 @@ describe('CollapsableNav', function () {
render: function() {
return (
<Navbar toggleNavKey={1}>
<CollapsableNav eventKey={1} ref='collapsable_object'>
<CollapsibleNav eventKey={1} ref='collapsible_object'>
<Nav>
<NavItem eventKey={1} ref='item1' className='foo bar'>Item 1 content</NavItem>
<NavItem eventKey={2} ref='item2' className='baz'>Item 2 content</NavItem>
</Nav>
</CollapsableNav>
</CollapsibleNav>
</Navbar>
);
}
});
let instance = ReactTestUtils.renderIntoDocument(<Parent />);
assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance.refs.collapsable_object.refs.collapsable_0, 'foo'));
assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance.refs.collapsable_object.refs.collapsable_0, 'bar'));
assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance.refs.collapsable_object.refs.collapsable_0, 'baz'));
assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance.refs.collapsible_object.refs.collapsible_0, 'foo'));
assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance.refs.collapsible_object.refs.collapsible_0, 'bar'));
assert.ok(ReactTestUtils.findRenderedDOMComponentWithClass(instance.refs.collapsible_object.refs.collapsible_0, 'baz'));
});

it('Should should not duplicate classes', function () {
let Parent = React.createClass({
render: function() {
return (
<Navbar toggleNavKey={1}>
<CollapsableNav eventKey={1} ref='collapsable_object' className='foo navbar-collapse'>
<CollapsibleNav eventKey={1} ref='collapsible_object' className='foo navbar-collapse'>
<Nav>
<NavItem eventKey={1} ref='item1' className='foo bar'>Item 1 content</NavItem>
<NavItem eventKey={2} ref='item2' className='baz'>Item 2 content</NavItem>
</Nav>
</CollapsableNav>
</CollapsibleNav>
</Navbar>
);
}
});
let instance = ReactTestUtils.renderIntoDocument(<Parent />);
let classDOM = ReactTestUtils.findRenderedDOMComponentWithTag(instance.refs.collapsable_object, 'DIV').props.className
let classDOM = ReactTestUtils.findRenderedDOMComponentWithTag(instance.refs.collapsible_object, 'DIV').props.className
, classArray = classDOM.split(' ')
, idx = classArray.indexOf('navbar-collapse');
assert.equal(classArray.indexOf('navbar-collapse', idx+1), -1);
Expand Down

0 comments on commit 333c663

Please sign in to comment.