jest test 測試要等待的東西


https://github.com/mrdulin/react-act-examples/blob/master/sync.md

  describe('page buttons', () => {
    it('should change page number when click the next button', async () => {
      // Given
      let wrapper;

      act(() => {
        wrapper = mount(<PDFViewer pdf={pdfUrl} />);
        wrapper.find('Document').props().onLoadSuccess({ numPages: 2 });
      });

      const buttonRight = wrapper.find('.PDFViewer__button-right');
      expect(wrapper.find('Page').props().pageNumber).toEqual(1);

      // When
      act(() => {
        buttonRight.simulate('click');
      });
      wrapper.update();

      // Then
      expect(wrapper.find('Page').props().pageNumber).toEqual(2);
    });

    it('should change page number when click the prev button', async () => {
      // Given
      let wrapper;

      act(() => {
        wrapper = mount(<PDFViewer pdf={pdfUrl} />);
        wrapper.find('Document').props().onLoadSuccess({ numPages: 2 });
      });

      const buttonRight = wrapper.find('.PDFViewer__button-right');
      const buttonLeft = wrapper.find('.PDFViewer__button-left');
      expect(wrapper.find('Page').props().pageNumber).toEqual(1);
      act(() => {
        buttonRight.simulate('click');
      });
      wrapper.update();

      // When
      act(() => {
        buttonLeft.simulate('click');
      });
      wrapper.update();

      // Then
      expect(wrapper.find('Page').props().pageNumber).toEqual(1);
    });
  });

Ref

Alex Krolick: Testing Async Components
https://www.youtube.com/watch?v=b8SOFNc_X_A&list=PLRvKvw42Rc7NEul9GviGijdznGbh8yl4Z&index=5








你可能感興趣的文章

[Other] - 那些在 CSS 遇到的問題

[Other] - 那些在 CSS 遇到的問題

第二章:6 一行程式碼研發策略

第二章:6 一行程式碼研發策略

JavaScript 閉包(Closure)新手入門解析教學

JavaScript 閉包(Closure)新手入門解析教學






留言討論