前端中的单元测试

在单元测试中，常用的方法论有两个: TDD和BDD。

• TDD( Test-driven development): 其基本思路是通过测试推动开发的进行。从调用者的角度出发，尝试函数逻辑的各种可能 性，进而辅助性增强代码质量。
• BDD(Behavior-driven development): 其基本思路是通过预期行为逐步构建功能块。通过与客户讨论，对预期结果有初步的认 知，尝试达到预期效果。

目前前端测试框架有Mocha、 jasmine、 jest 等，它们配合断言库来进行单元测试。断言库包括assert(nodejs 自带断言库)、chai 等，接下来写几个小例子

• 例1:普通函数测试

import { expect } from 'chai';import add from  '../src/common/add';
describe('加法函数测试', () => {it('应该返回两个数之和', () => {    expect(add(4, 5)).to.be.equal(9);});});

/*    加法函数测试    √ 应该返回两个数之和
    1 passingnpm */

• 例 2：异步函数测试

import { expect } from 'chai';import asyncFn from('../src/common/asyncFn');
describe('异步函数测试', () => {it('async with done', async () => {    const res = await asyncFn();
    expect(res).to.have.deep.property('status', 200);});});

/*    异步函数测试    √ async with done (176ms)
    1 passing*/

• 例 3：react 组件测试

需使用 enzyme 库对组件进行渲染

import { expect } from 'chai';import { render } from 'enzyme';
import Foo from './Foo';
describe('<Foo />', () => {it('renders three `.foo-bar`s', () => {    const wrapper = render(<Foo />);    expect(wrapper.find('.foo-bar')).to.have.lengthOf(3);});

/*    <Foo />    √ renders three `.foo-bar`s (176ms)
    1 passing*/