#describe 和 #it 方法在 TDD 反应测试中的作用是什么？答案

【问题标题】：What does #describe and #it methods do in TDD react testing?#describe 和 #it 方法在 TDD 反应测试中的作用是什么？
【发布时间】：2017-02-13 07:16:21
【问题描述】：

我正在通过 site 学习 TDD 和 React，但不明白作者是如何获得 describe 和 it 的，这些通常不是来自 Jasmine 吗？我在作者的 github 上的 node_modules 中没有看到这个包，他的 tests.js 也没有导入任何看起来像 describe 或 it 的东西。这两种方法从何而来？

import React from 'react';
import { expect } from 'chai';
import { shallow, mount, render } from 'enzyme';


describe('Test suite for User component', () => {
  it('UserComponent should exist', () => {
    let wrapper = shallow(<User />)
    expect(wrapper).to.exist;
  });
});

【问题讨论】：

他们来自mocha。作者已经将它添加到 package.json 中以使用 mocha 运行测试。检查这个github.com/r31gN/tdd-react-enzyme-article/blob/master/…。
我注意到他也使用了#childAt，但他没有从酶中导入，这怎么可能？
我认为你弄错了。这是一个包装对象的方法。

标签： javascript reactjs tdd chai enzyme

【解决方案1】：

如果这是您将在测试套件中使用的唯一 it() 语句，则您实际上不需要 describe() 块。

describe() 结构确实存在于 Jest 中，它也存在于 Mocha 中。

describe() 函数用于将某些具有一些共同设置的测试集组合在一起，并为它们中的每一个进行拆除。这就是为什么我说，根据你粘贴的代码，如果你没有进一步的测试，你不需要describe()函数。

因此，当您运行 create-react-app 时，自动加载的库之一就是 Jest 测试套件。

我也会重写那个测试，而不是 UserComponent 应该存在，我会这样做

it('shows a user component', () => {
  let wrapper = shallow(<User />);
  expect(wrapper.find(User).length).toEqual(1);
});

因此，我建议在这里不仅要遵循教程，还要查找他们在这些教程中使用的工具的文档。在 Enzyme 的情况下，有一个非常好的方法称为 find() 来查找组件，它提供了一个数组，因此您可以添加 .length 并且由于它只是 User 的一个组件，您可以在末尾添加 .toEqual(1);

【讨论】：