Angular4 Karma-Jasmine test not running

Question

I am trying to get my Karma-Jasmine tests set-up and can't work-out where I am going wrong. Can't seem to understand where the problem is and have tried various solutions from online searches have tried to change the 'target' and 'module' amongst other fixes but none seem to work. I am not using Webpack.

Karma.Config.js

module.exports = function(config) {
config.set({
    basePath: '',
    frameworks: ['jasmine'],

    plugins: [
         require('karma-jasmine')
        ,require('karma-chrome-launcher')
        ,require('karma-jasmine-html-reporter')
    ],
    client: {clearContext: false // leave Jasmine Spec Runner output visible 
    in browser},
    files:  [{ pattern: './test.ts', watched: false }],
    mime:   {'text/x-typescript': ['ts', 'tsx']},
    reporters: ['progress', 'kjhtml'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: true
   });
 };

tsconfig.json

{
 "compilerOptions": {
 "target": "es5",
 "lib": [ "es2015", "dom" ],
 "module": "umd",
 "moduleResolution": "node",
 "inlineSourceMap": true,
 "emitDecoratorMetadata": true,
 "experimentalDecorators": true,
 "removeComments": false,
 "suppressImplicitAnyIndexErrors": true,
 "allowJs": true,
 "rootDir": "ClientApp"
 },
 "types": [ "core-js" ],
 "compileOnSave": true,
 "angularCompilerOptions": {
 "genDir": ".",
 "debug": false,
 "skipMetadataEmit": true
 },
 "exclude": [ "node_modules"]
 }

test.ts

// Load required polyfills and testing libraries
import 'reflect-metadata';
import 'zone.js';
import 'zone.js/dist/long-stack-trace-zone';
import 'zone.js/dist/proxy.js';
import 'zone.js/dist/sync-test';
import 'zone.js/dist/jasmine-patch';
import 'zone.js/dist/async-test';
import 'zone.js/dist/fake-async-test';
import * as testing from '@angular/core/testing';
import * as testingBrowser from '@angular/platform-browser-dynamic/testing';

// There's no typing for the `__karma__` variable. Just declare it as any
declare var __karma__: any;
declare var require: any;

// Prevent Karma from running prematurely
__karma__.loaded = function () {};

// First, initialize the Angular testing environment
testing.getTestBed().initTestEnvironment(
testingBrowser.BrowserDynamicTestingModule,
testingBrowser.platformBrowserDynamicTesting()
);

// Then we find all the tests
const context = require.context('../', true, /\.spec\.ts$/);

// And load the modules
context.keys().map(context);

// Finally, start Karma to run the tests
__karma__.start();

Any direction will be highly appreciated...see screenshot below

Updated test.ts

// Load required polyfills and testing libraries
import 'reflect-metadata';
import 'zone.js';
import 'zone.js/dist/long-stack-trace-zone';
import 'zone.js/dist/proxy.js';
import 'zone.js/dist/sync-test';
import 'zone.js/dist/jasmine-patch';
import 'zone.js/dist/async-test';
import 'zone.js/dist/fake-async-test';
//changes
import { getTestBed } from '@angular/core/testing';
import {BrowserDynamicTestingModule,platformBrowserDynamicTesting} from 
'@angular/platform-browser-dynamic/testing';

// There's no typing for the `__karma__` variable. Just declare it as any
declare var __karma__: any;
declare var require: any;

// Prevent Karma from running prematurely
__karma__.loaded = function () {};

getTestBed().initTestEnvironment(
  BrowserDynamicTestingModule,
  platformBrowserDynamicTesting()
);
//PREVIOUS code
// First, initialize the Angular testing environment
//testing.getTestBed().initTestEnvironment(
//    testingBrowser.BrowserDynamicTestingModule,
//    testingBrowser.platformBrowserDynamicTesting()
//);

// Then we find all the tests
const context = require.context('../', true, /\.spec\.ts$/);

// And load the modules
context.keys().map(context);

// Finally, start Karma to run the tests
__karma__.start();