Simple test helper for testing recompose HOCs

gistfile1.txt

import React from 'react'
import { mount } from 'enzyme'

const render = ({ hoc, data, context }) => {
    const Component = () => <div />
    const WrappedComponent = hoc(Component)
    return mount(<WrappedComponent {...data} />, { context })
}

// By default, return the 'inner', wrapped component.
export default (hoc, data, context) =>
    render({ hoc, data, context }).find('Component')
    
// to test state updates we need to return the component and the update method    
export const renderHOCWithStateUpdate = (hoc, data, context) => {
    const component = render({ hoc, data, context })
    const update = () => {
        component.update()
        return component.find('Component')
    }
    return {
        component: component.find('Component'),
        update,
        root: component,
    }
}

// Usage 

import renderHOC, {renderHOCWithStateUpdate} from './utils/renderHOC'

// simple case without setState
const component = renderHOC({hoc: someHOC, data:{some:'data'}})
expect(component).toMatchSnapshot()

// case without setState
const wrapper = renderHOCWithStateUpdate({hoc: someHOC, data:{some:'data'}})
let component = wrapper.component
let update = wrapper.update
component.prop('someStateUpdateMethod')()
component = update()
expect(component).toMatchSnapshot()

The main idea is to render HOCs independently from real views, by using just a simple dummy component and only test that the props passed to the dummy are correct.