diff --git a/src/BootstrapMixin.js b/src/BootstrapMixin.js index df8795de4d..cc5e1f1a15 100644 --- a/src/BootstrapMixin.js +++ b/src/BootstrapMixin.js @@ -34,9 +34,13 @@ const BootstrapMixin = { classes[prefix + bsSize] = true; } - let bsStyle = this.props.bsStyle && styleMaps.STYLES[this.props.bsStyle]; if (this.props.bsStyle) { - classes[prefix + bsStyle] = true; + let bsStyle = styleMaps.STYLES[this.props.bsStyle]; + if (bsStyle) { + classes[prefix + bsStyle] = true; + } else { + classes[this.props.bsStyle] = true; + } } } diff --git a/test/BootstrapMixinSpec.js b/test/BootstrapMixinSpec.js index 333870506b..32eaf0e147 100644 --- a/test/BootstrapMixinSpec.js +++ b/test/BootstrapMixinSpec.js @@ -2,6 +2,7 @@ import React from 'react'; import ReactTestUtils from 'react/lib/ReactTestUtils'; import BootstrapMixin from '../src/BootstrapMixin'; import styleMaps from '../src/styleMaps'; +import { shouldWarn } from './helpers'; let Component; @@ -197,14 +198,28 @@ describe('BootstrapMixin', function () { assert.equal(instance.prefixClass('title'), 'btn-title'); }); - it('should return "btn btn-wacky"', function () { - styleMaps.addStyle('wacky'); - let instance = ReactTestUtils.renderIntoDocument( - - content - - ); - assert.deepEqual(instance.getBsClassSet(), {'btn': true, 'btn-wacky': true}); + describe('Custom styles', function () { + it('should validate OK custom styles added via "addStyle()"', function () { + + styleMaps.addStyle('wacky'); + + let instance = ReactTestUtils.renderIntoDocument( + + content + + ); + assert.deepEqual(instance.getBsClassSet(), {'btn': true, 'btn-wacky': true}); + }); + + it('should allow custom styles as is but with validation warning', function () { + let instance = ReactTestUtils.renderIntoDocument( + + content + + ); + assert.deepEqual(instance.getBsClassSet(), {'btn': true, 'my-custom-class': true}); + shouldWarn('Invalid prop `bsStyle` of value `my-custom-class`'); + }); }); }); });