Cannot run tests using Chrome Dev v55 #2125

Activity

1. ianjoneill commented on Sep 15, 2016

   

   ianjoneill

   on Sep 15, 2016

   Author

   More actions

   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
   
2. jtsom commented on Sep 15, 2016

   

   jtsom

   on Sep 15, 2016

   Last edited by jtsom

   Contributor

   More actions

   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
3. ianjoneill commented on Sep 15, 2016

   

   ianjoneill

   on Sep 15, 2016

   Author

   More actions

   Ah - I didn't see that - the initial description did not have anything to do with the issue - probably why I missed it.
4. ianjoneill commented on Sep 15, 2016

   

   ianjoneill

   on Sep 15, 2016

   Last edited by ianjoneill

   Author

   More actions

   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.
5. jtsom commented on Sep 15, 2016

   

   jtsom

   on Sep 15, 2016

   Contributor

   More actions

   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.
6. jtsom commented on Sep 15, 2016

   

   jtsom

   on Sep 15, 2016

   Contributor

   More actions

   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.

   👍React with 👍146Reacted by Michal Vanko, Adam Duren, Denilson Rodrigues, Sam Bleckley, Christian Rackerseder, Yerkebulan, Bogusław Skrzypkowiak, Exequiel Ceasar Navarrete, Vlad Sabev, ernaone and 136 more

   🎉React with 🎉54Reacted by Vlad Sabev, Peng, Chad Brockman, Jonathan Samples, Alex Malkevich, Abdulhaq Emhemmed, Samuel Béliveau, Emilio Martinez, Daniel Shafer, Jonas Krispin and 44 more

   😕React with 😕1Reacted by jeenn

   ❤️React with ❤️54Reacted by Vlad Sabev, Peng, Chad Brockman, Jonathan Samples, Abdulhaq Emhemmed, Daniel Shafer, Jonas Krispin, Patrick Williams, Raviteja Valluri, Tanguy Vaessen and 44 more
7. ianjoneill commented on Sep 15, 2016

   

   ianjoneill

   on Sep 15, 2016

   Author

   More actions

   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 😃.
8. ianjoneill commented on Sep 16, 2016

   

   ianjoneill

   on Sep 16, 2016

   Author

   More actions

   Your fix works great!
9. jtsom commented on Sep 16, 2016

   

   jtsom

   on Sep 16, 2016

   Contributor

   More actions

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

    added a commit that references this issue on Sep 16, 2016

    Fix(config):Add MIME type to work around Chrome > 54 problem (angular…

    ...

    1fe953a
11. filipesilva commented on Sep 21, 2016

    

    filipesilva

    on Sep 21, 2016

    Contributor

    More actions

    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?
12. juliemr commented on Sep 21, 2016

    

    juliemr

    on Sep 21, 2016

    More actions

    @zzo do you have any insights here?
13. filipesilva

    added

    type: bug/fix

    on Oct 10, 2016
14. filipesilva

    added a commit that references this issue on Oct 28, 2016

    fix(test):add ts MIME type

    ...

    This issue will close once commit cfee22b is merged into the 'main' branch.

    cfee22b
15. filipesilva

    closed this as completedin cfee22bon Oct 28, 2016
16. sandikbarr

    added a commit that references this issue on Dec 15, 2016

    set mime type for karma angular/angular-cli#2125 (comment)

    76b13d8
17. arosh

    added a commit that references this issue on Dec 19, 2016

    Fix MIME type ('text/x-typescript')

    ...

    e3a7374
18. seza443

    added a commit that references this issue on Dec 21, 2016

    fix issue : angular/angular-cli#2125 (comment)

    82c13f9
19. ebeer

    added a commit that references this issue on Jan 5, 2017

    change to specify mime type for chrome dev v55 compatibility. see ang…

    ...

    057081e
20. MRHarrison

    added a commit that references this issue on Feb 9, 2017

    fix(test):add ts MIME type

    ...

    This issue will close once commit e857ca4 is merged into the 'master' branch.

    e857ca4
21. JohannesHoppe

    added a commit that references this issue on Feb 23, 2017

    fixes `npm test` due to a bug in chrome, see angular/angular-cli#2125

    a1596f3
22. ducin commented on May 12, 2017

    

    ducin

    on May 12, 2017

    More actions

    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.

    👍React with 👍1Reacted by Johnny Everson
23. dbeylkhanov commented on Sep 4, 2017

    

    dbeylkhanov

    on Sep 4, 2017

    Last edited by dbeylkhanov

    More actions

    @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
24. bobbyg603 commented on Sep 20, 2017

    

    bobbyg603

    on Sep 20, 2017

    Last edited by bobbyg603

    More actions

    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.
25. Xesenix commented on Dec 1, 2017

    

    Xesenix

    on Dec 1, 2017

    More actions

    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
    	}
    }
    
26. angular-automatic-lock-bot commented on Sep 7, 2019

    

    angular-automatic-lock-botBot

    on Sep 7, 2019

    More actions

    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.}
27. angular-automatic-lock-bot

    locked and limited conversation to collaborators on Sep 7, 2019
28. mostafaibr

    added a commit that references this issue on May 29, 2026

    fix(test):add ts MIME type

    ...

    This issue will close once commit 8bef8f0 is merged into the 'master' branch.

    8bef8f0