Looking at the network tab in the chrome dev tools, it looks like test.ts was served as a video file - so it's not Chrome's fault. The full response headers for the file were:

HTTP/1.1 200 OK
Content-Type: video/mp2t
Cache-Control: no-cache
Pragma: no-cache
Expires: Thu, 01 Jan 1970 00:00:00 GMT
Date: Thu, 15 Sep 2016 09:44:08 GMT
Connection: keep-alive
Transfer-Encoding: chunked

I would guess that the .ts file should not have been served at all, but a compiled / transpired .js file. So somewhere the compilation of the .ts file is not happening. I've reported this exact issue, but have had no responses to my report. #2031

Ah - I didn't see that - the initial description did not have anything to do with the issue - probably why I missed it.

Note that the tests work fine in both current release (v53) and beta (v54) versions of Chrome, in addition to current release/beta/dev versions of Firefox.

Having the same problem on Chrome on OS X, Version 55.0.2859.0 dev (64-bit)

I don't see the error in Safari, (Safari Technology Preview Release 12 (Safari 9.1.2, WebKit 11603.1.3)) and Safari (Version 9.1.3 (11601.7.8))

So, it does look like a Chrome issue.

I figured out a work around. In the karma.conf.js file, add:

    mime: {
      'text/x-typescript': ['ts','tsx']
    },

This tells the Karma server to serve the .ts files with a text/x-typescript mime type. That seems to make it work.

Seems worthy of a pull-request to me.

I'll test it out your proposed patch tomorrow at around UTC 8:00 and report back - but reading over the karma docs, it looks like it should work 😃.

Your fix works great!

Cool! So if I can figure the steps to make a pull request I'll do it :)

I can verify that although it works on Chrome 53, it does show the Content-Type as video:

The file seems to be served as .ts but containing only ES5 code. This might be a problem with how Karma serves files that undergo processing... @juliemr could you weigh in perhaps?

@zzo do you have any insights here?

It's not an issue of angular-cli, it's an issue of typescript/karma.
I'm not using angular-cli, but this solution worked for me as well.

@jtsom

but what's if I don't use karma, however, such errors in *.ts files like MIME type is not executable are exists too
I'm using Ionic v1 with cordova and angular

FWIW we got this error when moving test files from one directory to another and not updating/adding an entry in the preprocessors array.

In other words we updated this:
preprocessors: { './src/*.ts': ['karma-typescript'] },

to this:
preprocessors: { './src/*.ts': ['karma-typescript'], './test/*.ts': ['karma-typescript'] },

and the error went away.

I had this error for running webpack with awesome-typescript-loader and karma mime type option in karma conf fixed it:

// Karma configuration
const webpack = require('./webpack.config.test.js');
module.exports = function (config) {
	//console.debug('karma config');process.abort();
	config.set({
		basePath: '',
		frameworks: ['jasmine', 'sinon'],
		files: [{
			pattern: './src/main.test.ts',
			included: true,
		}],
		exclude: [],
		preprocessors: {
			'./src/**/*.ts': ['webpack']
		},
		webpack,
		reporters: ['progress'],
		browsers: ['Chrome'],

		// fix typescript serving video/mp2t mime type
		mime: {
			'text/x-typescript': ['ts','tsx']
		},
	})
}

and webpack config:

module.exports = {
	entry: [
		'./src/main.test.ts'
	],
	output: {
		filename: './dist/test.js'
	},
	resolve: {
		extensions: ['.ts', '.tsx', '.js', '.jsx']
	},
	module: {
		rules: [
			{
				test: /\.(t|j)sx?$/,
				loaders: [{
					loader: 'awesome-typescript-loader',
					options: {
						configFileName: 'tsconfig.test.json'
					}
				}]
			}
		]
	},
	externals: {
		'react': 'React',
		'resct-dom': 'ReactDOM'
	}
}

typescript config:

{
	"compilerOptions": {
		/* Basic Options */
		"target": "es5",
		"module": "commonjs",
		"lib": [
			"es2017",
			"es2016",
			"es2015",
			"dom"
		],
		"jsx": "react",
		"declaration": false,
		"sourceMap": true,
		"outDir": "./dist/out-tsc",
		"removeComments": true,

		/* Strict Type-Checking Options */
		"strict": true,
		"strictNullChecks": true,
		"noImplicitThis": true,

		/* Additional Checks */
		"noUnusedLocals": true,
		"noImplicitReturns": true,
		"moduleResolution": "node",
		"baseUrl": "./src",
		"paths": {
			"app/*": ["app/*"],
			"lib/*": ["lib/*"],
			"*": ["*"]
		},
		"typeRoots": [
			"node_modules/@types"
		],
		"types": ["jasmine", "reflect-metadata"],

		/* Experimental Options */
		"experimentalDecorators": true,
		"emitDecoratorMetadata": true,
		"plugins": [{
			"name": "tslint-language-service"
		}]
	},
	"files": [
		"**/*.spec.ts"
	],
	"include": [
		"**/*.ts"
	],
	"awesomeTypescriptLoaderOptions": {
		"forceIsolatedModules": true,
		"useTranspileModule": true,
		"useBabel": true,
		"useCache": true,
		"usePrecompiledFiles": true
	}
}

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}