4、测试驱动开发的第一步

root9

于 2025-07-17 16:00:33 发布

阅读量55

点赞数

CC 4.0 BY-SA版权

分类专栏：精通React测试驱动开发：从入门到实践文章标签：测试驱动开发 React 预约列表

本文链接：https://blog.youkuaiyun.com/root9/article/details/150137970

精通React测试驱动开发：从入门到实践专栏收录该内容

28 篇文章 ¥499.90

订阅专栏¥69.90

会员秒杀 ¥9.9 重磅福利

超级会员免费看

测试驱动开发的第一步

1. 渲染预约列表

在开发过程中，我们可以将新组件添加到已使用的文件中，尤其是当组件是简短的函数式组件时，这样有助于将相关组件或小的组件子树集中在一起。

在 test/Appointment.test.js 文件中，我们创建一个新的 describe 块，并添加一个测试来检查是否渲染了具有特定 ID 的 div 元素，因为我们加载的 CSS 文件会查找这个元素。以下是测试代码：

describe('AppointmentsDayView', () => {
  let container;
  beforeEach(() => {
    container = document.createElement('div');
  });
  const render = component =>
    ReactDOM.render(component, container);
  it('renders a div with the right id', () => {
    render(<AppointmentsDayView appointments={[]} />);
    expect(container.querySelector('div#appointmentsDayView')).not.toBeNull();
  });
});

运行 npm test 后，会发现测试失败，