javascript - Jest 单元测试 - 测试 setState()

Question

我在函数中定义了setState。设置函数的函数被另一个函数调用，如下所示:

    pageChanged(page) {
      this.setPage(page, false);

    }

    setPage(page, isLoading) {
        var pager = this.state.pager;
        var totalItems = this.props.totalItems;

        if (page < 1 || page > pager.totalPages) {
            return null;
        }

        pager = this.getPager(totalItems, page, 6);

        this.setState({ pager: pager });

        if(!isLoading){ 
            this.props.onChangePage(pager.startIndex);
        }
    }

函数pageChanged(page)在点击时被调用。

onClick={this.pageChanged(page)}

我尝试使用sinon.spy编写许多测试，但没有成功。有关如何进行测试的任何帮助。

Answer 1

  describe('pageChanged', () => {
    it('expect to call setPage', () => {
      const wrapper = shallow(<YourComponent />);
      const page = 'test';
      wrapper.instance().setPage = jest.fn(); // mock `setPage` method
      wrapper.instance().pageChanged(page);

      expect(wrapper.instance().setPage).toHaveBeenCalledWith(page, false);
    });
  });

  describe('setPage', () => {
    it('expect to change state', () => {
      const wrapper = shallow(<YourComponent />);
      const page = 'test';
      const pager = '?page=test'
      wrapper.instance().getPager = () => pager; // mock `getPager` method
      // it also can be mocked using jest.fn():
      // wrapper.instance().getPager = jest.fn().mockReturnValue(pager);
      wrapper.instance().setPage(page);

      expect(wrapper.state.pager).toBe(pager);
    });
  });