testify

testify

Simple command-line interface plus opinionated configuration for testing browser-based Typescript projects with Mocha.

💡 Builds upon many of the ideas from @tomazzaman's excellent article “How to get fast unit tests with(out) Webpack”

• What it does
  • ✨ Bonus features
• Using it in your projects
  • Install with yarn or npm
  • Add run script(s) to package.json
    • Single test run
    • Watch mode (re-run tests when files are changed)
    • Single test run w/coverage
• Customizing the test environment
  • Require API

What it does

Initializes and configures a testing environment with the following:

• ts-node for writing tests and transpiling .ts imports
• mocha for running tests
• sinon for mocking/stubbing functions
• chai for assertions w/
  • sinon-chai
  • chai-dom
• jsdom for a browser-esque environment

✨ Bonus features

• 😏 No webpack
• 🚀 Tracks dependencies in watch mode and only re-runs tests that are affected
• 📦 Limited support for loading .vue files (only <template> and <script lang="ts"> are currently supported

Using it in your projects

Install with yarn or npm

yarn add @snaptopixel/testify

Add run script(s) to package.json

Single test run

{
  "test": "testify -t tests/**/*.spec.ts"
}

Watch mode (re-run tests when files are changed)

{
  "test:watch": "testify -t packages/**/*.spec.ts -w"
}

Single test run w/coverage

🗒 Install nyc and prepend it to your script before testify. Check nyc's README for configuration options

{
  "test": "nyc testify -t tests/**/*.spec.ts"
}

Customizing the test environment

You can require any number of .ts or .js files using the -r argument like so:

{
  "test": "testify -t tests/**/*.spec.ts -r some-file.ts some-other-file.js"
}

These scripts will be required and executed in the node environment once jsdom has been initialized.

This is useful if your scripts depend on global variables, for example:

// In required js file
window.SomeGlobal = {
  someMethod: sinon.spy()
}

// In test file
describe('globals', () => {
  it('can access global', () => {
    window.SomeGlobal.someMethod('hey')
    expect(window.SomeGlobal.someMethod).calledWith('hey')
  })
})

Require API

If your require file exports a function it will be called with an api object that allows for a few customization options:

TypeScript example

export default function initTests(api: IRequireApi) {
  // Add chai plugins via api.chai.use(MyPlugin)
  // Add require aliases via api.addAlias('~'. './path/to/files')
}

JavaScript example

module.exports = function initTests(api) {
  // Add chai plugins via api.chai.use(MyPlugin)
  // Add require aliases via api.addAlias('~'. './path/to/files')
}