How to unit test the state of props using mocha chai and enzyme?

Question

I'm trying to unit test onClick the state of the props in my component clear.

I tried doing it this way:

props = {
    attributeTableData: data,
    clearMessage: onClickMethod,
    reset: () => { },
    resetAttributeTable: () => { },
    statusMessage: {
        messageType: 'message-success',
        userMessage: 'Template has been saved successfully. Please wait …see your results display with the latest'
    },
    submitTemplateCreationStatus: () => { },
    templateAttributeFormData: () => { },
    templateFormSubmission: true,
    templateAttributeFormSubmission: true,
    templateFormData: () => { },
    userRoles: new Set(['admin'])
};
let emptyStatusMessage = {};
actualComponent = shallow(<CreateTemplateResults { ...props } />);
actualComponent.instance().resetForms();
expect(onClickMethod.called).to.be.true;
expect(actualComponent.state('statusMessage')).to.eql(emptyStatusMessage)

But I get:

" TypeError: ShallowWrapper::state("statusMessage") requires that state not be null or undefined "

Answer 1

You are creating a shallow render of <CreateTemplateResults /> , but never passing actualComponent.setState(nextState) . Therefore, when you are trying to access the state on your last line, it is throwing an error because state is null / undefined .

shallow().setState