Fast tests are the best

goodtest.component.spec.ts

import { TestBed, async } from '@angular/core/testing';
import { AppComponent } from './app.component';
import { By } from '@angular/platform-browser';
import { NO_ERRORS_SCHEMA } from '@angular/core';

describe('AppComponent', () => {
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [
        AppComponent
      ],
      imports: [],
      providers: [],
      schemas: [NO_ERRORS_SCHEMA]
    }).compileComponents();
  }));
  it('should create the app', async(() => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.debugElement.componentInstance;
    expect(app).toBeTruthy();
  }));
  it(`should have a title`, async(() => {
    const fixture = TestBed.createComponent(AppComponent);
    const titleEl = fixture.debugElement.query(By.css('h1'));
    expect(titleEl).not.toBeNull();
  }));
});

karma.conf.js

// Karma configuration file, see link for more information
// https://karma-runner.github.io/0.13/config/configuration-file.html
const path = require('path')
module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine-ajax', 'jasmine', '@angular/cli'],
    plugins: [
      require('karma-jasmine'),
      require('karma-jasmine-ajax'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage-istanbul-reporter'),
      require('@angular/cli/plugins/karma'),
      require('karma-spec-reporter')
    ],
    client: {
      clearContext: false // leave Jasmine Spec Runner output visible in browser
    },
    files: [
      { pattern: './src/test.ts', watched: false },
      { pattern: './node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css', watched: false }
    ],
    preprocessors: {
      './src/test.ts': ['@angular/cli']
    },
    mime: {
      'text/x-typescript': ['ts', 'tsx']
    },
    coverageIstanbulReporter: {
      reports: [ 'html', 'lcovonly', 'text-summary' ],
      dir: path.join(__dirname, 'coverage'),
      fixWebpackSourcePaths: true
    },
    angularCli: {
      config: './.angular-cli.json',
      environment: 'dev'
    },
    reporters: ['spec', 'kjhtml', 'coverage-istanbul'],
    specReporter: {
      spec: {
        displayDuration: true,
      }
    },
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome', 'chrome_headless'],
    singleRun: false,
    customLaunchers: {
      chrome_headless: {
        base: 'Chrome',
        flags: [
          '--headless',
          '--no-sandbox',
          '--disable-gpu',
          ' --remote-debugging-port=9222'
        ]
      }
    }
  })
}

package.json

{
  "name": "chrome headless example",
  "angular-cli": {},
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "lint": "ng lint",
    "test": "ng test --code-coverage --browsers 'Chrome' --traceResolution",
    "e2e": "ng e2e --webdriver-update false --environment e2e",
    "e2e:st": "ng e2e --webdriver-update false --config ./protractor.st.conf.js --serve false",
    "e2e:repl": "ng e2e --webdriver-update false --config ./protractor.st.conf.js --serve false -ee",
    "test:build": "ng build --aot true",
    "test:ci": "ng lint && ng test --single-run --no-sourcemap --browsers 'chrome_headless'",
    "update:webdriver": "webdriver-manager update"
  },
  "private": true,
  "dependencies": {
    "...":"..."
  },
  "devDependencies": {
    "@angular/cli": "^1.4.2",
    "@angular/compiler-cli": "^4.4.3",
    "@types/jasmine": "^2.6.0",
    "@types/jasmine-ajax": "^3.1.37",
    "@types/node": "^8.0.28",
    "codelyzer": "^3.2.0",
    "jasmine-core": "^2.8.0",
    "jasmine-spec-reporter": "^4.2.1",
    "karma": "^1.7.1",
    "karma-chrome-launcher": "^2.2.0",
    "karma-cli": "^1.0.1",
    "karma-coverage-istanbul-reporter": "^1.3.0",
    "karma-jasmine": "^1.1.0",
    "karma-jasmine-ajax": "^0.1.13",
    "karma-jasmine-html-reporter": "^0.2.2",
    "karma-spec-reporter": "^0.0.31",
    "protractor": "^5.1.2",
    "ts-node": "^3.3.0",
    "typescript": ">=2.1.0 <2.4.0"
  }
}