After user click login, I need check the server status every 3 seconds. After 20 times check, display timeout and clear the timer.

my code:

onCheckStatus = () => {
    MAX_POLLING_COUNT = 20;
    this.timer = setInterval(() => {
        if (MAX_POLLING_COUNT > 0) {
            MAX_POLLING_COUNT -= 1;
            loginStatus(this.state.sessionId).then(
                res => {
                    const { goto, sessionId, errorMessageCode, result, hint } = res;
                    ........
                    if (goto === 'SUCCESS') {
                        this.setState({
                            messageInfo: {
                                type: 'success',
                                title: '',
                                description: result.description,
                            },
                        });
                    } else if (goto === 'ERROR') {

                    } 
                },
                () => {
                    clearInterval(this.timer);
                    this.setState({ error: true, loading: false });
                }
            );
        } else {
            this.setState({ error: true, loading: false });
        }
    }, 3000);
};

test code:

    jest.useFakeTimers();
    const wrapper = shallow(
        <AddGPForm step="GP_SIGNIN" uuid="testuuid" {...props} />
    );

    const form = shallow(wrapper.prop('children')(getMockFormApi(wrapper)));
    form.find('Login').simulate('submit', {
        reqestBody: '10x010101x0101x0101x10x0',
    });
    jest.runAllTimer();
    // jest.runTimersToTime(60000);
    // jest.runOnlyPendingTimers();

onCheckStatus will be triggered, the the codes inside the timer never trigged. I tried to pick the logic inside the timer as one single method.

new code:

onCheckStatus = () => {
    this.timer = setInterval(this.check(), 3000);
}

check method only be triggered once.

After user click login, I need check the server status every 3 seconds. After 20 times check, display timeout and clear the timer.

my code:

onCheckStatus = () => {
    MAX_POLLING_COUNT = 20;
    this.timer = setInterval(() => {
        if (MAX_POLLING_COUNT > 0) {
            MAX_POLLING_COUNT -= 1;
            loginStatus(this.state.sessionId).then(
                res => {
                    const { goto, sessionId, errorMessageCode, result, hint } = res;
                    ........
                    if (goto === 'SUCCESS') {
                        this.setState({
                            messageInfo: {
                                type: 'success',
                                title: '',
                                description: result.description,
                            },
                        });
                    } else if (goto === 'ERROR') {

                    } 
                },
                () => {
                    clearInterval(this.timer);
                    this.setState({ error: true, loading: false });
                }
            );
        } else {
            this.setState({ error: true, loading: false });
        }
    }, 3000);
};

test code:

    jest.useFakeTimers();
    const wrapper = shallow(
        <AddGPForm step="GP_SIGNIN" uuid="testuuid" {...props} />
    );

    const form = shallow(wrapper.prop('children')(getMockFormApi(wrapper)));
    form.find('Login').simulate('submit', {
        reqestBody: '10x010101x0101x0101x10x0',
    });
    jest.runAllTimer();
    // jest.runTimersToTime(60000);
    // jest.runOnlyPendingTimers();

onCheckStatus will be triggered, the the codes inside the timer never trigged. I tried to pick the logic inside the timer as one single method.

new code:

onCheckStatus = () => {
    this.timer = setInterval(this.check(), 3000);
}

check method only be triggered once.

• javascript
• reactjs
• unit-testing
• jestjs

2 Answers 2

Use jest.advanceTimersByTime to advance your timer and test in your test file.

Use jest.runAllTimers() instead of jest.runAllTicks()