Testing

The WebAssembly Studio mostly relies on unit tests to verify the functionality. The architecture (react + flux) was chosen just for this reason. We are using the jest as our testing platform.

Execution

The tests are executed by running npm run test command. That includes execution of:

• tslint for TypeScript coding guidelines verification;
• jest for unit tests.

It's possible to run just the unit tests using jest command. Running it via the jest command allows, e.g. to specify the particular test, update the snapshot, etc.

Creation of a unit test

The unit tests are location at the "tests/" folder and further grouped by particular component or action. To verify the components state we are using enzyme testing utilities.

The jest allows to replace modules with mocks -- that will allow to simply unit test creation.

Note: The project is at its first iterations and is migrated from the pilot code. It is essential to add (unit) test to existing code first.

Measuring test coverage

It is recommended to measure test coverage when adding new unit tests. This helps you detect any uncovered lines/statements/functions. To generate a coverage report, simply run:

npm run coverage

The generated coverage report includes coverage for all files in /src to give you the whole picture.

Mutation testing

Measuring test coverage is great - it helps you find untested parts of your code. However, test coverage does not tell you much about the actual quality of your tests. Mutation testing is basically testing the quality of your tests to see if they are effective in catching bugs. The WebAssembly Studio development environment comes with the mutation testing framework Stryker installed. Running Stryker can be useful for when adding new unit tests to make sure that they are effective enough.

Mutate a single file

Useful for when writing tests for a single file/component

npm run mutate -- -m {path-to-file}
npm run mutate -- -m src/components/StatusBar.tsx

Mutating the whole project (Takes about 7 hours)

npm run mutate

References

• https://reactjs.org/blog/2014/09/24/testing-flux-applications.html
• https://facebook.github.io/jest/docs/en/tutorial-react.html
• https://github.com/airbnb/enzyme
• Coding guidelines
• Stryker