diff --git a/src/ProgressBar.js b/src/ProgressBar.js index d80e92b174..b91f0db408 100644 --- a/src/ProgressBar.js +++ b/src/ProgressBar.js @@ -1,4 +1,4 @@ -import React, { cloneElement } from 'react'; +import React, { cloneElement, PropTypes } from 'react'; import Interpolate from './Interpolate'; import BootstrapMixin from './BootstrapMixin'; import classNames from 'classnames'; @@ -7,13 +7,14 @@ import ValidComponentChildren from './utils/ValidComponentChildren'; const ProgressBar = React.createClass({ propTypes: { - min: React.PropTypes.number, - now: React.PropTypes.number, - max: React.PropTypes.number, - label: React.PropTypes.node, - srOnly: React.PropTypes.bool, - striped: React.PropTypes.bool, - active: React.PropTypes.bool + min: PropTypes.number, + now: PropTypes.number, + max: PropTypes.number, + label: PropTypes.node, + srOnly: PropTypes.bool, + striped: PropTypes.bool, + active: PropTypes.bool, + children: onlyProgressBar }, mixins: [BootstrapMixin], @@ -127,4 +128,22 @@ const ProgressBar = React.createClass({ } }); +/** + * Custom propTypes checker + */ +function onlyProgressBar(props, propName, componentName) { + if (props[propName]) { + let error, childIdentifier; + + React.Children.forEach(props[propName], (child) => { + if (child.type !== ProgressBar) { + childIdentifier = (child.type.displayName ? child.type.displayName : child.type); + error = new Error(`Children of ${componentName} can contain only ProgressBar components. Found ${childIdentifier}`); + } + }); + + return error; + } +} + export default ProgressBar; diff --git a/test/ProgressBarSpec.js b/test/ProgressBarSpec.js index c846f7fda1..cc59c2df3e 100644 --- a/test/ProgressBarSpec.js +++ b/test/ProgressBarSpec.js @@ -1,6 +1,7 @@ import React from 'react'; import ReactTestUtils from 'react/lib/ReactTestUtils'; import ProgressBar from '../src/ProgressBar'; +import {shouldWarn} from './helpers'; const getProgressBarNode = function (wrapper) { return React.findDOMNode(ReactTestUtils.findRenderedDOMComponentWithClass(wrapper, 'progress-bar')); @@ -181,4 +182,15 @@ describe('ProgressBar', function () { assert.equal(bar2.style.width, '30%'); }); + it('allows only ProgressBar in children', function () { + ReactTestUtils.renderIntoDocument( + + +
+ + + ); + + shouldWarn('Failed propType'); + }); });