WattyRev/check-prop-types

Check PropTypes, returning errors instead of logging them

checkPropTypes

Manually check PropTypes-compatible proptypes, returning any errors instead of logging them to console.error.

This function is more suitable for checking propTypes in unit tests than mocking console.error, avoiding some serious problems with that approach.

Forked from https://github.com/ratehub/check-prop-types to have a build output using common js.

Install

$ npm install --save wattyrev-check-prop-types

Usage

Call it just like PropTypes.checkPropTypes, but it returns any problems as an error message string.

import PropTypes from "prop-types";
import checkPropTypes from "wattyrev-check-prop-types";

const HelloComponent = ({ name }) => <h1>Hi, {name}</h1>;

HelloComponent.propTypes = {
  name: PropTypes.string.isRequired
};

let result = checkPropTypes(
  HelloComponent.propTypes,
  { name: "Julia" },
  "prop",
  HelloComponent.name
);
assert(result === undefined);

result = checkPropTypes(
  HelloComponent.propTypes,
  { name: 123 },
  "prop",
  HelloComponent.name
);
assert(
  result ===
    "Failed prop type: Invalid prop `name` of type `number` supplied to `HelloComponent`, expected `string`."
);

assertPropTypes

To throw errors instead of returning them, a helper called assertPropTypes is included:

import PropTypes from "prop-types";
import { assertPropTypes } from "wattyrev-check-prop-types";

const HelloComponent = ({ name }) => <h1>Hi, {name}</h1>;

HelloComponent.propTypes = {
  name: PropTypes.string.isRequired
};

assertPropTypes(
  HelloComponent.propTypes,
  { name: "Julia" },
  "prop",
  HelloComponent.name
);
// fine...

assertPropTypes(
  HelloComponent.propTypes,
  { name: 123 },
  "prop",
  HelloComponent.name
);
// throws Error: Failed prop type: Invalid prop `name` of type `number` supplied to `HelloComponent`, expected `string`.

See test.js for more usage examples.