Header Component

Header.react.js

var React = require('react');
var Bootstrap =require('react-bootstrap');

var Navbar = Bootstrap.Navbar;
var Nav = Bootstrap.Nav;
var NavItem = Bootstrap.NavItem;
var PageHeader = Bootstrap.PageHeader;


var Header = React.createClass({
	
	render: function() {
		return (
			<section>
				<PageHeader>
					Pastoral Acts&nbsp;
					<small>chaplain information application</small>
				</PageHeader>
				<Navbar>
					<Nav onSelect={this._onSelect}>
						<NavItem eventKey={1} href="/home">Home</NavItem>
						<NavItem eventKey={2} href="/login">Login</NavItem>
					</Nav>
				</Navbar>
			</section>
		);
	},

	_onSelect: function(key) {
		alert('key: ' + key);
	}
});

module.exports = Header;

Header.react.test.js

/* global describe, it, assert */

'use strict';

var React;
var TestUtils;

var Bootstrap = require('react-bootstrap');
var PageHeader = Bootstrap.PageHeader;
var NavBar = Bootstrap.NavBar;

describe('App', function() {
	var instance;

	beforeEach(function() {
		React = require('react/addons');
		TestUtils = React.addons.TestUtils;
		Header = require('../Header.react.js');

		instance = TestUtils.renderIntoDocument(
			<Header />
		);
	});

	afterEach(function() {
		if (instance && TestUtils.isCompositeComponent(instance) && instance.isMounted()) {
			React.unmountComponentAtNode(instance.getDOMNode().parent);
		}
	});

	it ('should render header correctly', function() {
		var component = TestUtils.findRenderedComponentWithType(instance, Header);

		expect(component.getDOMNode().nodeName).toBe('SECTION');
		expect(component.getDOMNode().childNodes.length).toBe(2);
	});

	it ('should have a PageHeader component', function() {
		var components = TestUtils.scryRenderedComponentsWithType(instance, PageHeader);

		expect(components.length).toBe(1);
		expect(components[0].getDOMNode().nodeName).toBe('SECTION');
		expect(components[0].getDOMNode().textContent).toContain('Pastoral Acts chaplain information application');
	});

	it ('should have a NavBar component', function() {
		var components = TestUtils.scryRenderedComponentsWithType(instance, NavBar);

		expect(components.length).toBe(1);
	});
});