单元测试：调用onChange函数，但字段值没有更改

Question

我正在使用jest和酶编写单元测试。所有测试都通过了，但StartDate和endDate返回一个不变的值，这是无法预期的。

我的代码：

    const { startDate, endDate, onChangeDateRange} = props

    const previousRange = () => {
        const difference = moment(endDate).diff(moment(startDate), 'days')
        onChangeDateRange({
            startDate: moment(startDate).subtract(difference + 1, 'days'),
            endDate: moment(endDate).subtract(difference + 1, 'days')
        })
    }

    const nextRange = () => {
        const difference = moment(endDate).diff(moment(startDate), 'days')
        onChangeDateRange({
            startDate: moment(startDate).add(difference + 1, 'days'),
            endDate: moment(endDate).add(difference + 1, 'days')
        })
    }

    const previousButton = (
        <Button tertiary onClick={previousRange}>
            <Row alignItems='center' gridGap={8}>
                <IconChevronLeft aria-hidden />
            </Row>
        </Button>
    )

    const nextButton = (
        <Button tertiary onClick={nextRange}>
            <Row alignItems='center' gridGap={8}>
                <IconChevronRight aria-hidden={true} />
            </Row>
        </Button>
    )

    return (
        <Row >
            {previousButton}
            {nextButton}
            <DateRangeCalendar
                startDate={startDate}
                endDate={endDate}
                onChangeDateRange={onChangeDateRange}
            />
        </Row>
    )
}

export default Date

我的测试代码：

describe('Date Component', () => {
    let wrapper
    const onChangeDateRange = jest.fn()

    it('renders Date with Button, and DateRangeCalendar as child components', () => {
        wrapper = shallow(
            <Date
                onChangeDateRange={onChangeDateRange}
                startDate='2022-3-28'
                endDate='2022-3-29'
            />
        )
        expect(wrapper.length).toEqual(1)
        expect(wrapper.find('Row').length).toEqual(3)
        expect(wrapper.find('DateRangeCalendar').length).toEqual(1)
        expect(wrapper.find('Button').length).toEqual(2)
        expect(wrapper.find('Text').length).toEqual(1)
        expect(wrapper.find('Spacer').length).toEqual(2)
    })

    it('should call onChangeDateRange when clicking previousButton ', () => {
        wrapper = shallow(
            <Date
                onChangeDateRange={onChangeDateRange}
                startDate='2022-3-28'
                endDate='2022-3-29'
            />
        )
        const DateRangeCalendar = wrapper.find('DateRangeCalendar')
        wrapper.find('Button').at(0).simulate('click')
        expect(onChangeDateRange).toHaveBeenCalledTimes(1)
        expect(DateRangeCalendar.props().startDate).toEqual('2022-3-26')
        expect(DateRangeCalendar.props().endDate).toEqual('2022-3-27')
    })

    it('should call onChangeDateRange when clicking nextButton  ', () => {
        wrapper = shallow(
            <Date
                intl={intl}
                onChangeDateRange={onChangeDateRange}
                startDate='2022-3-28'
                endDate='2022-3-29'
            />
        )
        const DateRangeCalendar = wrapper.find('DateRangeCalendar')
        wrapper.find('Button').at(1).simulate('click')
        expect(onChangeDateRange).toHaveBeenCalled()
        expect(DateRangeCalendar.props().startDate).toEqual('2022-3-30')
        expect(DateRangeCalendar.props().endDate).toEqual('2022-3-31')
    })
})

运行测试时，调用了on ChangeDaterange，但是StartDate和endDate的值保持不变。它以startDate ='2022-3-28'endDate ='2022-3-29'返回。为什么值不更改？