Testing¶

Resources¶

Reactjs
- Enzyme
Other
- Karma - runner
- Mocha - framework
- Chai - assertion library
Acceptance testing
- Robot Framework
  - Using mkvirtualenv - mkvirtualenv -a . johan-martin
  - pip install robotframework

Getting started¶

installation npm i --save-dev enzyme enzyme-adapter-react-16 chai mocha karma
Install Robot Framework
- mkvirtualenv -a . johan-martin
- pip install robotframework

Testing framework¶

Using Karma, Mocha, Chai
- npm -i --save-dev karma mocha chai

TAP¶

Test Anything Protocol
- tap-spec - output similar to Mocha
- Faucet - TAP Reporter

Tape¶

Why I use Tape…

Jasmine and Karma¶

Testing with Tape¶

Requirements¶

Using typescript for development
Using webpack for hot reload and packaging.

Tape¶

Tape
Testing JavaScript Modules with Tape
Seems to be simpler to get up and running then the other frameworks.
Can run the tests in node.
SuperTest - API Testing.

Setup¶

webpack-tape-run - run tests in webapck
TS-Node - Run Typescript in Node.js.
- Experimenting with TS-Node

Typescript Dependencies¶

@types/tape
awesome-typescript-loader
tslint
tsnode

Tape Dependencies¶

Faucet - TAP Reporter

Configuration Example¶

package.json

"scripts": {
    "start": "npm-run-all --parallel dev:server lint:watch",
    "watch": "webpack -w -d",
    "build": "webpack -d",
    "dev:server": "webpack-dev-server --hot --inline --progress --colors",
    "lint": "esw webpack.config.* src --color",
    "lint:watch": "npm run lint -- --watch",
    "test": "node_modules/.bin/ts-node node_modules/.bin/tape src/tests/*.ts | node_modules/.bin/faucet"
  },
  "author": "Johan Martin <martin.johan@johan-martin.com> (http://www.johan-martin.com/)",
  "license": "ISC",
  "dependencies": {},
  "devDependencies": {
    "@types/tape": "^4.2.30",
    "awesome-typescript-loader": "^3.2.3",
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.0",
    "babel-preset-latest": "^6.24.1",
    "electron": "^1.7.8",
    "eslint": "^4.7.2",
    "eslint-config-standard": "^10.2.1",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-node": "^5.1.1",
    "eslint-plugin-promise": "^3.5.0",
    "eslint-plugin-standard": "^3.0.1",
    "eslint-watch": "^3.1.2",
    "faucet": "0.0.1",
    "html-webpack-plugin": "^2.30.1",
    "npm-run-all": "^4.1.1",
    "tap-spec": "^4.1.1",
    "tape": "^4.8.0",
    "ts-node": "^3.3.0",
    "tslint": "^5.7.0",
    "typescript": "^2.5.3",
    "webpack": "^3.6.0",
    "webpack-dev-server": "^2.9.0",
    "webpack-tape-run": "0.0.7"
  },
  "babel": {
    "presets": [
      [
        "env",
        {
          "targets": {
            "browsers": [
              "last 2 versions",
              "ie >= 7"
            ]
          }
        }
      ]
    ]
  }

Issues¶

Error: “Module not found: Error: Can’t resolve ‘fs’ in”
- Browser Testing and Code Coverage with Karma, Tape, and Webpack
- Resolved by adding below to webpack.config.js:
```
node: {
    fs: 'empty'
  },
```

Last update: April 13, 2020 16:50:19