javascript - Jest.js - Testing if component method has been called (React.js) - Stack Overflow

I have a following class ponent:

export class HelloWorld extends Component {
    constructor(props) {
        super(props)
        this.methodA = this.methodA.bind(this)
        this.methodB = this.methodB.bind(this)
    }

    methodA(props) {
        if (props.someValue === true) {
            ......
            methodB(props.someValue, true)
        } else {
            ......
            methodB(props.someValue, false)
        }
    }
    ...
    ...
}

Where essentially I call methodA to call methodB with certain parameters I have to pass it.

In Jest, I am having hard time writing test coverage where methodB has been called in methodB

describe('ponentA', () => {
    it('should call ponentB', () => {
        const wrapper = enzyme.shallow(<HellowWorld {...(Object.assign(baseProps, { smsStatus: 'VALID' }))} />)

        const spyFn = {
            methodB: () => jest.fn()
        }
        const spyPreventDefault = jest.spyOn(spyFn, 'methodB')
        wrapper.instance().methodA(baseProps)
        expect(spyPreventDefault).toHaveBeenCalled()
    })
})

What am I doing wrong?

I have a following class ponent:

export class HelloWorld extends Component {
    constructor(props) {
        super(props)
        this.methodA = this.methodA.bind(this)
        this.methodB = this.methodB.bind(this)
    }

    methodA(props) {
        if (props.someValue === true) {
            ......
            methodB(props.someValue, true)
        } else {
            ......
            methodB(props.someValue, false)
        }
    }
    ...
    ...
}

Where essentially I call methodA to call methodB with certain parameters I have to pass it.

In Jest, I am having hard time writing test coverage where methodB has been called in methodB

describe('ponentA', () => {
    it('should call ponentB', () => {
        const wrapper = enzyme.shallow(<HellowWorld {...(Object.assign(baseProps, { smsStatus: 'VALID' }))} />)

        const spyFn = {
            methodB: () => jest.fn()
        }
        const spyPreventDefault = jest.spyOn(spyFn, 'methodB')
        wrapper.instance().methodA(baseProps)
        expect(spyPreventDefault).toHaveBeenCalled()
    })
})

What am I doing wrong?

• javascript
• reactjs
• jasmine
• tdd
• jestjs

Share Improve this question Follow asked Mar 29, 2018 at 0:31 AlejandroAlejandro 2,32477 gold badges3939 silver badges6464 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

You are trying to hang spy on objest spyFn, that is pletely unrelated to <HellowWorld/>. Are you just want to spy on methodB in <HellowWorld/>? If so, here are your test

describe('ponentA', () => {
  it('should call ponentB', () => {
    const wrapper = enzyme.shallow(<HellowWorld {...(Object.assign(baseProps, { smsStatus: 'VALID' }))} />)

    const spyPreventDefault = jest.spyOn(wrapper.instance(), 'methodB');
    wrapper.instance().forceUpdate();
    wrapper.instance().methodA(baseProps)
    expect(spyPreventDefault).toHaveBeenCalled()
  })
})