@aaronflower/jtils 中文文档教程

Question

JTils

1. Init the project, be careful of your version.

npm init

2. Hierarchy the project, ignore node_modules

$ mkdir src test
$ touch .gitignore

3. Add EditorConfig Support

$ yarn add --dev editorconfig-cli
$ npx ec init

4. Add ESLint, Prettier support

$ yarn add --dev eslint
$ npx eslint --init
$ yarn add --dev eslint-plugin-prettier eslint-config-prettier
# add .eslintrc.js .prettierrc.js config file to support.

5. Add a utility function sum.js in src

export default function sum (a, b) {
  return number(a) + (b)
}

使用 ESLint 检查代码。

npx lint src/sum.js

/Users/easonzhan/learning/git_repos/jtils/src/sum.js
  1:10  error  'foo' is defined but never used  no-unused-vars
  2:10  error  Strings must use singlequote     quotes

✖ 2 problems (2 errors, 0 warnings)
  1 error and 0 warnings potentially fixable with the `--fix` option.

如果您使用 VSCode 或其他编辑器，您可以为这些编辑器安装插件以动态检查您的代码。

我使用 vim，所以我使用 vim lint 插件 ALE。

6. Add Mocha to test your code.

yarn add --dev mocha

测试代码。

$  npx mocha
~repos/jtils/test/sum.js:2
import sum from "../src/sum"
       ^^^

SyntaxError: Unexpected identifier
    at new Script (vm.js:79:7)
    at createScript (vm.js:251:10)
    at Object.runInThisContext (vm.js:303:10)

这个错误告诉我们不支持 ES6 模块。 所以我们需要添加 Babel 来支持。

7. Add babel 7 support

yarn add --dev @babel/core @babel/cli @babel/preset-env
yarn add --dev @babel/register

而对于 Babel 7，你应该添加一个 babel.config.js

module.exports = {
  presets: ["@babel/env"]
}

然后执行 Mocha。

npx mocha --require @babel/register

  Sum
    Two Positives
      ✓ should returns 4


  1 passing (9ms)

8. About the test/sum.js code

const assert = require("assert")
import sum from "../src/sum"

describe("Sum", function() {
  describe("Two Positives", function() {
    it("should returns 4", function() {
      assert.equal(sum(2, 2), 4)
    })
  })
})

Assertions

在 test/sum.js 文件中，我们使用 Node.js 内置的 assert 模块来断言我们的代码。 Mocha 允许我们使用我们想要的任何断言库。 这意味着我们可以使用这样的库：

• chai Chai is a BDD / TDD assertion library for node and the browser that can be delightfully paired with any javascript testing framework.
• should.js BDD style shown throughout these docs.
• jest/expect
• expect.js
• better-assert
• unexpected

我们应该使用 Chai，因为它有几个接口，可以让开发人员选择最舒服的接口。

Interfaces

describe()、it() 函数是 Mocha 的 BDD“接口”系统。

Mocha 的“接口”系统允许开发人员选择他们自己的 DSL 风格。 Mocha 具有 BDD、TDD、Exports、QUnit 和 Require 风格的接口。

BDD

BDD是Behavior Driven Development(BDD)的缩写，所以我们可以称Mocha是一个支持BDD的测试框架。

BDD接口提供了describe()、context()、it()、specify()、before()、after()、beforeEach()、afterEach()

context()只是 describe() 的别名，并且行为相同； 它只是提供了一种使测试更易于阅读和组织的方法。 同样，sepcify() 是 it() 的别名。

describe('Array', function() {
    before(function() {
      // ...
    });

    describe('#indexOf()', function() {
      context('when not present', function() {
        it('should not throw an error', function() {
          (function() {
            [1,2,3].indexOf(4);
          }).should.not.throw();
        });
        it('should return -1', function() {
          [1,2,3].indexOf(4).should.equal(-1);
        });
      });
      context('when present', function() {
        it('should return the index where the element first appears in the array', function() {
          [1,2,3].indexOf(3).should.equal(2);
        });
      });
    });
});