No testing solution out there is perfect. That said, jest is an excellent unit testing option which provides great TypeScript support.

Install the following using npm:

Explanation:

• Install jest framwork (jest)
• Install the types for jest (@types/jest)
• Install the TypeScript preprocessor for jest (ts-jest) which allows jest to transpile TypeScript on the fly and have source-map support built in.
• Save all of these to your dev dependencies (testing is almost always a npm dev-dependency)

module.exports = {
  "roots": [
    "<rootDir>/src"
  ],
  "transform": {
    "^.+\\.tsx?$": "ts-jest"
  },
  "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$",
  "moduleFileExtensions": [
    "ts",
    "tsx",
    "js",
    "jsx",
    "json",
    "node"
  ],
}

Explanation:

• We always recommend having all TypeScript files in a src folder in your project. We assume this is true and specify this using roots option.
• The transform config just tells jest to use ts-jest for ts / tsx files.
• The testRegex tells Jest to look for tests in any __tests__ folder AND also any files anywhere that use the (.test|.spec).(ts|tsx) extension e.g. asdf.test.tsx etc.
• The moduleFileExtensions tells jest to recognize our file extensions. This is needed as we add ts/ into the defaults (js|jsx|json|node).

Run npx jest from your project root and jest will execute any tests you have.

Add package.json:

  "test": "jest"
}

• This allows you to run the tests with a simple npm t.
• And even in watch mode with npm t -- --watch.

• npx jest -w

• For a file foo.ts:

import { sum } from '../';
test('basic', () => {
  expect(sum()).toBe(0);
});
test('basic again', () => {
  expect(sum(1, 2)).toBe(3);
});

Notes:

• Jest provides the global test function.
• Jest comes prebuilt with assertions in the form of the global expect.

Jest has built-in async/await support. e.g.

test('basic',async () => {
  expect(sum()).toBe(0);
});
test('basic again', async () => {
  expect(sum(1, 2)).toBe(3);
}, 1000 /* optional timeout */);

Enzyme allows you to test react components with dom support. There are three steps to setting up enzyme:

1. Install enzyme, types for enzyme, a better snapshot serializer for enzyme, enzyme-adapter-react for your react version npm i enzyme /enzyme enzyme-to-json enzyme-adapter-react-16 -D
2. Add "snapshotSerializers" and "setupTestFrameworkScriptFile" to your jest.config.js:

1. Create src/setupEnzyme.ts file.

import * as EnzymeAdapter from 'enzyme-adapter-react-16';
configure({ adapter: new EnzymeAdapter() });

• checkboxWithLabel.tsx:

import * as React from 'react';
  labelOn: string,
  labelOff: string
}, {
    isChecked: boolean
  }> {
  constructor(props) {
    super(props);
    this.state = { isChecked: false };
  }
  onChange = () => {
    this.setState({ isChecked: !this.state.isChecked });
  }
  render() {
    return (
      <label>
        <input
          type="checkbox"
          checked={this.state.isChecked}
          onChange={this.onChange}
        />
        {this.state.isChecked ? this.props.labelOn : this.props.labelOff}
      </label>
    );
  }
}

• checkboxWithLabel.test.tsx:

• Built-in assertion library.
• Great TypeScript support.
• Very reliable test watcher.
• Snapshot testing.
• Built-in coverage reports.
• Built-in async/await support.