From b6f1ad0ad9d55018a9a82c6a5e5775aa5421665f Mon Sep 17 00:00:00 2001 From: Neil Duffy Date: Thu, 13 Apr 2017 16:27:49 -0500 Subject: [PATCH] using react's prop-types lib --- package.json | 2 +- rollup.config.js | 2 +- src/index.js | 12 ++++-------- test/component.js | 34 +++++++++++++++++----------------- 4 files changed, 23 insertions(+), 27 deletions(-) diff --git a/package.json b/package.json index 7a1f67b..8092d7b 100644 --- a/package.json +++ b/package.json @@ -82,7 +82,7 @@ "immutability-helper": "^2.1.2", "preact-render-to-string": "^3.6.0", "preact-transition-group": "^1.1.0", - "proptypes": "^0.14.3", + "prop-types": "^15.5.8", "standalone-react-addons-pure-render-mixin": "^0.1.1" } } diff --git a/rollup.config.js b/rollup.config.js index 9221e3d..d14decd 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -21,7 +21,7 @@ export default { useStrict: false, globals: { 'preact': 'preact', - 'proptypes': 'PropTypes' + 'prop-types': 'PropTypes' }, plugins: [ format==='umd' && memory({ diff --git a/src/index.js b/src/index.js index aa9c2da..574fc4d 100644 --- a/src/index.js +++ b/src/index.js @@ -1,4 +1,4 @@ -import PropTypes from 'proptypes'; +import PropTypes from 'prop-types'; import { render as preactRender, cloneElement as preactCloneElement, h, Component as PreactComponent, options } from 'preact'; const version = '15.1.0'; // trick libraries to think we are react @@ -514,14 +514,10 @@ function propsHook(props, context) { if (DEV) { let ctor = typeof this==='function' ? this : this.constructor, propTypes = this.propTypes || ctor.propTypes; + const displayName = this.displayName || ctor.name; + if (propTypes) { - for (let prop in propTypes) { - if (propTypes.hasOwnProperty(prop) && typeof propTypes[prop]==='function') { - const displayName = this.displayName || ctor.name; - let err = propTypes[prop](props, prop, displayName, 'prop'); - if (err) console.error(new Error(err.message || err)); - } - } + PropTypes.checkPropTypes(propTypes, props, 'prop', displayName); } } } diff --git a/test/component.js b/test/component.js index cb2a877..639ed37 100644 --- a/test/component.js +++ b/test/component.js @@ -173,13 +173,13 @@ describe('components', () => { }); describe('propTypes', () => { - function checkPropTypes(Foo) { + function checkPropTypes(Foo, name = 'Foo') { sinon.stub(console, 'error'); - React.render(, scratch); - expect(console.error).to.have.been.calledWithMatch({ - message: 'Required prop `func` was not specified in `Foo`.' - }); + expect(console.error).to.have.been.calledWithMatch( + 'Warning: Failed prop type: The prop `func` is marked as required in `' + name + '`, but its value is `undefined`.' + ); + expect(console.error).to.have.been.called; console.error.reset(); @@ -187,9 +187,9 @@ describe('components', () => { expect(console.error).not.to.have.been.called; React.render({}} bool="one" />, scratch); - expect(console.error).to.have.been.calledWithMatch({ - message: 'Invalid prop `bool` of type `string` supplied to `Foo`, expected `boolean`.' - }); + expect(console.error).to.have.been.calledWithMatch( + 'Warning: Failed prop type: Invalid prop `bool` of type `string` supplied to `' + name + '`, expected `boolean`.' + ); console.error.restore(); } @@ -209,7 +209,7 @@ describe('components', () => { }); it('should support propTypes for createClass components', () => { - const Foo = React.createClass({ + const Bar = React.createClass({ propTypes: { func: React.PropTypes.func.isRequired, bool: React.PropTypes.bool @@ -217,24 +217,24 @@ describe('components', () => { render: () =>
}); - checkPropTypes(Foo); + checkPropTypes(Bar, 'Bar'); }); it('should support propTypes for pure components', () => { - function Foo() { return
; } - Foo.propTypes = { + function Baz() { return
; } + Baz.propTypes = { func: React.PropTypes.func.isRequired, bool: React.PropTypes.bool }; - checkPropTypes(Foo); + checkPropTypes(Baz, 'Baz'); - const Foo2 = () =>
; - Foo2.displayName = 'Foo'; - Foo2.propTypes = { + const Bip = () =>
; + Bip.displayName = 'Bip'; + Bip.propTypes = { func: React.PropTypes.func.isRequired, bool: React.PropTypes.bool }; - checkPropTypes(Foo2); + checkPropTypes(Bip, 'Bip'); }); });