javascript - 如何修复 DatePicker 反应组件的测试？

Question

我正在创建一个带有“from”和“to”列的简单 react-datepicker。我在测试时遇到问题。

我知道测试不正确，但我很难找到足够的文档来测试日期选择器。如果有可供我使用的资源，我也很高兴知道。

日期选择器代码：

function GenericCalendarRange() {
    const [startDate, setStartDate] = useState(
        setHours(setMinutes(new Date(), 1), 0)
    );
    const [endDate, setEndDate] = useState(
        setHours(setMinutes(new Date(), 1), 0)
    );
    return (
        <>
            <h6 className="datepicker__title">From</h6>
            <DatePicker
                selected={startDate}
                onChange={(date) => setStartDate(date)}
                showTimeSelect
                timeFormat="hh:mm:ss"
                injectTimes={[
                    setHours(setMinutes(new Date(), 1), 0),
                    setHours(setMinutes(new Date(), 5), 12),
                    setHours(setMinutes(new Date(), 59), 23)
                ]}
                dateFormat="yyyy-MM-dd hh:mm:ss"
            />
            <h6 className="datepicker__title">To</h6>
            <DatePicker
                selected={endDate}
                onChange={(date) => setEndDate(date)}
                showTimeSelect
                timeFormat="hh:mm:ss"
                injectTimes={[
                    setHours(setMinutes(new Date(), 1), 0),
                    setHours(setMinutes(new Date(), 5), 12),
                    setHours(setMinutes(new Date(), 59), 23)
                ]}
                dateFormat="yyyy-MM-dd hh:mm:ss"
            />
        </>
    );
}

export default GenericCalendarRange;

测试类代码：

describe("GenericCalendarRange", () => {
    let wrapper;
    beforeEach(() => {
        wrapper = shallow(<GenericCalendarRange />);
    });
    it("should match snapshot", () => {
        expect(wrapper).toMatchSnapshot();
    });
    it("should simulate click", () => {
        const actions = {
            onChange: jest.fn()
        };

        const component = mount(
            <GenericCalendarRange onChange={actions.onChange} />
        );

        component.find("DatePicker").text().simulate("click");

        expect(actions.onChange).toHaveBeenCalled();
    });
});

我收到的错误是：

● GenericCalendarRange › should match date given

    Method “text” is meant to be run on 1 node. 0 found instead.

      25 |      );
      26 | 
    > 27 |      component.find("DatePicker").text().simulate("click");
         |                                   ^
      28 | 
      29 |      expect(actions.onChange).toHaveBeenCalled();
      30 |  });

对我有什么指示吗？我是新来的反应，还没有得到测试。

标签： javascriptreactjstestingdatepicker