How to test React HOC function that is not passed into the wrapped component?

162 views Asked by At

I have a HOC like so and I want to test the getStuff2 function:

function withHoc(aComponent) {
  class hocClass extends React.Component {

    getStuff1 = () => {

    }

    getStuff2 = () => {

    }

    render() {
      return <aComponent {...this.props} getStuff1={this.getStuff1} />;
    }
}
}

I'm testing it like so:

class MockApp extends React.PureComponent {
  render() {
    return <p>Hello from your Mock App</p>;
  }
}

const MockWithHOC = withHoc(MockApp);

const wrapper = shallow(<MockWithHOC />);

it('Test getStuff2', () => {
    const result = wrapper.getStuff2();
});

But when I run this, it says getStuff2 not found. When I print out the wrapper, I only see getStuff1 which I passed in while rendering:

<MockApp getStuff1={[Function]} />

I don't want to pass getStuff2 into the wrapped component because it's not needed there. It's only needed as a helper method for getStuff1 so is there a way to access that method without passing it into the wrapped component?

1

There are 1 answers

0
kca On

(I assume you are using enzyme, because of the shallow() you are using)

You can use the wrapper.instance():

const result = wrapper.instance().getStuff2();

See ShallowWrapper.instance()