Awesome Open Source
Awesome Open Source

react-fake-props Build Status npm

Magically generate fake props for your React tests 🔮

react-fake-props parses your Component prop types using react-docgen and generates fake props. Supports Flow and PropTypes. Works great with Jest snapshots and Enzyme.


npm install react-fake-props --save-dev
yarn add react-fake-props --dev


Assuming the following Component with Flow types:

// @flow
type Props = {
  id: number,
  name: string

class Component extends React.Component<Props> {
  // ...

Or PropTypes:

class Component extends React.Component {
  // ...

Component.propTypes = {
  id: PropTypes.number.isRequired,
  name: PropTypes.string.isRequired

With react-fake-props, you can generate valid props based on your Component prop types:

const props = fakeProps(componentPath)
  id: 1,
  name: 'name'
<Component {...props} />


import path from 'path'
import fakeProps from 'react-fake-props'

const componentPath = path.join(__dirname, './Component.jsx')
const props = fakeProps(componentPath)

To include optional props, pass { optional: true }.

Please note:

  • custom validators and PropTypes.instanceOf aren't supported, you'll still need to set them manually.
  • react-fake-props requires the component path to be passed, instead of the component itself, to be able to support Flow and PropTypes.

For multiple components in single file

By passing { all: true }, fakeProps will return an array of all components found in componentPath with corresponding fake props. Works even for the ones that aren't exported.

// Pick the component you want to get fake props using displayName
const components = fakeProps(componentPath, { all: true })
const { props } = components.find({ displayName } => displayName === 'SomeComponent')


fakeProps(componentPath[, { optional: false, all: false } ])


When checking for a value, use props.A rather than 'A' as react-fake-props output may change.

const wrapper = shallow(<Component {...props} />)

wrapper.text().to.contain('A') // bad
wrapper.text().to.contain(props.A) // good

See also


MIT - Typicode 🌵 - Patreon

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (68,778
react (5,307
test (203
flow (150
enzyme (43
props (26

Find Open Source By Browsing 7,000 Topics Across 59 Categories