zoukankan      html  css  js  c++  java
  • [React Testing] Setting up dependencies && Running tests

    To write tests for our React code, we need to first install some libraries for running tests and writing assertions. In this lesson we walk through setting up Mocha as our test runner and expect as our assertion library. We will also set up some React and JSX specific test tools (React Test Utils) to make writing our tests easier.

    NOTE: There are many alternatives to Mocha, expect, and the other test tools we use in this course. Although we use these specific tools and libraries, the testing principles apply to all other tools.

    package.json:

    {
      "name": "react-testing",
      "version": "1.0.0",
      "description": "",
      "main": "index.js",
      "scripts": {
        "test": "echo "Error: no test specified" && exit 1"
      },
      "author": "",
      "license": "ISC",
      "devDependencies": {
        "expect": "1.13.4",
        "mocha": "2.3.4",
        "react-addons-test-utils": "0.14.5"
      },
      "dependencies": {
        "react": "0.14.5",
        "react-dom": "0.14.5"
      }
    }

    we walk through how to setup our tests and run them. We write a quick empty first test and assertion, so we can run the tests. Using Mocha, we can do this manually each time with the Mocha CLI. We can also automate this using task runner features from tools like Grunt, Gulp, Webpack, or npm scripts. In this course, we will use the common npm test script setup to run our tests. We will also use the Babel compiler to write our tests with modern JavaScript syntax.

    import expect from 'expect';
    
    describe('empty', ()=>{
    
        it('should work', ()=>{
            expect(true ).toEqual(true);
        });
    });

    packjson.js: Install babel also

    {
      "name": "react-testing",
      "version": "1.0.0",
      "description": "",
      "main": "index.js",
      "scripts": {
        "test": "mocha ./src/**/*.spec.js --compilers js:babel-core/register",
        "test:watch": "npm test -- --watch"
      },
      "author": "",
      "license": "ISC",
      "devDependencies": {
        "babel-core": "6.1.4",
        "babel-loader": "6.1.0",
        "babel-preset-es2015": "6.1.4",
        "babel-preset-react": "6.1.4",
        "babel-preset-stage-2": "6.1.2",
        "expect": "1.12.2",
        "mocha": "2.3.3",
        "react-addons-test-utils": "0.14.3",
      },
      "dependencies": {
        "react": "0.14.3",
        "react-dom": "0.14.3"
      }
    }

    .babelrc

    {
      "presets": ["react", "stage-2", "es2015"]
    }
  • 相关阅读:
    += 和 =+
    Ubuntu分区方案(菜鸟方案、常用方案和进阶方案)
    Apache ab测试工具使用方法(无参、get传参、post传参)(转)
    硬盘安装ubuntu遇到的问题
    Promise
    A Kill Cord for your Laptop
    python 2week
    PDCA循环原理
    python自学基础1week
    14链表中倒数第k个结点
  • 原文地址:https://www.cnblogs.com/Answer1215/p/5097698.html
Copyright © 2011-2022 走看看