React Native倒计时组件Jest单元测试实战

import React from 'react';
import { render, unmountComponentAtNode } from 'react-dom';
import Timer from '../Timer';

jest.useFakeTimers();

describe('Timer', () => {
  let container = null;

  beforeEach(() => {
    container = document.createElement('div');
    document.body.appendChild(container);
  });

  afterEach(() => {
    unmountComponentAtNode(container);
    container.remove();
    container = null;
  });

  it('renders without crashing', () => {
    render(<Timer />, container);
  });

  it('starts the timer', () => {
    const leftTime = 3600; // 1 hour
    render(<Timer leftTime={leftTime} />, container);

    expect(container.textContent).toContain('00:00:00');

    jest.advanceTimersByTime(1000); // advance 1 second

    expect(container.textContent).toContain('00:59:59');

    jest.advanceTimersByTime(60000); // advance 1 minute

    expect(container.textContent).toContain('00:58:59');

    jest.advanceTimersByTime(3600000); // advance 1 hour

    expect(container.textContent).toContain('23:58:59');
  });

  it('calls onReload when leftTime is less than 0', () => {
    const onReload = jest.fn();
    const leftTime = -1;
    render(<Timer leftTime={leftTime} onReload={onReload} />, container);

    expect(onReload).toHaveBeenCalled();
  });
});