AsyncTestCompleter Browserify Angular2 HTTP Mock Test
Question
I am about to get started with Angular 2 tests, I am pretty new to Angular 2 and got stuck with testing.
I am following the testing guide: https://angular.io/docs/ts/latest/guide/testing.html
> TimesheetCrusher@0.0.5 test C:\Users\Toby\WebstormProjects\timesheetCrusher
> tsc && concurrently "tsc -w" "karma start karma.conf.js"
[1] 10 10 2016 09:11:27.801:DEBUG [plugin]: Loading inlined plugin (defining framework:jasmine).
[1] 10 10 2016 09:11:27.807:DEBUG [plugin]: Loading inlined plugin (defining launcher:Chrome, launcher:ChromeCanary, launcher:Dartium, test).
[1] 10 10 2016 09:11:27.808:DEBUG [plugin]: Loading inlined plugin (defining reporter:html).
[1] 10 10 2016 09:11:27.808:DEBUG [plugin]: Loading inlined plugin (defining bro, framework:browserify, preprocessor:browserify, preprocessor:browserify-bundle, preprocess).
[1] 10 10 2016 09:11:27.808:DEBUG [plugin]: Loading inlined plugin (defining launcher:Chrome_travis_ci).
[1] 10 10 2016 09:11:27.823:DEBUG [framework.browserify]: created browserify bundle: C:\Users\Toby\AppData\Local\Temp\a3ebde98982e7b28c9d1624786c469a4.browserify
[1] 10 10 2016 09:11:27.856:DEBUG [framework.browserify]: no matching preprocessed file was found, defaulting to prepend
[1] 10 10 2016 09:11:27.857:DEBUG [framework.browserify]: add bundle to config.files at position 0
[1] 10 10 2016 09:11:27.875:DEBUG [web-server]: Instantiating middleware
[1] 10 10 2016 09:11:27.907:DEBUG [reporter]: Trying to load reporter: html
[1] 10 10 2016 09:11:27.909:DEBUG [reporter]: Trying to load color-version of reporter: html (html_color)
[1] 10 10 2016 09:11:27.909:DEBUG [reporter]: Couldn't load color-version.
[1] 10 10 2016 09:11:29.104:WARN [watcher]: Pattern "C:/Users/Toby/WebstormProjects/timesheetCrusher/systemjs.config.extras.js" does not match any file.
[1] 10 10 2016 09:11:29.118:WARN [watcher]: Pattern "C:/Users/Toby/WebstormProjects/timesheetCrusher/dist/src/**/*.html" does not match any file.
[1] 10 10 2016 09:11:29.123:WARN [watcher]: Pattern "C:/Users/Toby/WebstormProjects/timesheetCrusher/dist/src/**/*.css" does not match any file.
[1] 10 10 2016 09:11:29.522:DEBUG [framework.browserify]: building bundle
[1] 10 10 2016 09:11:29.921:DEBUG [framework.browserify]: updating dist\test\backand\backand-rest.service.spec.js in bundle
[1] 10 10 2016 09:11:30.627:DEBUG [framework.browserify]: bundling
[0] 9:11:30 AM - Compilation complete. Watching for file changes.
[1] 10 10 2016 09:11:31.762:ERROR [framework.browserify]: bundle error
[1] 10 10 2016 09:11:31.762:ERROR [framework.browserify]:
[1] C:\Users\Toby\WebstormProjects\timesheetCrusher\node_modules\@angular\core\testing\async_test_completer.js:11
[1] export var AsyncTestCompleter = (function () {
[1] ^
[1] ParseError: 'import' and 'export' may appear only with 'sourceType: module'
[1] 10 10 2016 09:11:31.800:WARN [karma]: Port 9876 in use
[1] 10 10 2016 09:11:31.801:INFO [karma]: Karma v1.3.0 server started at http://localhost:9877/
[1] 10 10 2016 09:11:31.802:INFO [launcher]: Launching browser Chrome with unlimited concurrency
[1] 10 10 2016 09:11:31.833:INFO [launcher]: Starting browser Chrome
[1] 10 10 2016 09:11:31.833:DEBUG [temp-dir]: Creating temp dir at C:\Users\Toby\AppData\Local\Temp\karma-98045299
[1] 10 10 2016 09:11:31.834:DEBUG [launcher]: C:\Program Files (x86)\Google\Chrome\Application\chrome.exe --user-data-dir=C:\Users\Toby\AppData\Local\Temp\karma-98045299 --no-default-browser-check --no-first-run --disable-default-apps --disable-popup-blocking --disable-translate --disable-background-timer-throttling http://localhost:9877/?id=98045299
[1] 10 10 2016 09:11:33.249:DEBUG [web-server]: serving: C:\Users\Toby\WebstormProjects\timesheetCrusher\node_modules\karma\static/client.html
[1] 10 10 2016 09:11:33.278:DEBUG [web-server]: serving: C:\Users\Toby\WebstormProjects\timesheetCrusher\node_modules\karma\static/karma.js
[1] 10 10 2016 09:11:33.463:DEBUG [karma]: A browser has connected on socket /#xhFGIxQD4-dw1xNtAAAA
[1] 10 10 2016 09:11:33.467:DEBUG [web-server]: serving: C:\Users\Toby\WebstormProjects\timesheetCrusher\node_modules\karma\static/favicon.ico
[1] 10 10 2016 09:11:33.483:DEBUG [web-server]: upgrade /socket.io/?EIO=3&transport=websocket&sid=xhFGIxQD4-dw1xNtAAAA
[1] 10 10 2016 09:11:33.484:DEBUG [proxy]: NOT upgrading proxyWebSocketRequest /socket.io/?EIO=3&transport=websocket&sid=xhFGIxQD4-dw1xNtAAAA
[1] 10 10 2016 09:11:33.524:INFO [Chrome 53.0.2785 (Windows 10 0.0.0)]: Connected on socket /#xhFGIxQD4-dw1xNtAAAA with id 98045299
[1] 10 10 2016 09:11:33.525:DEBUG [launcher]: Chrome (id 98045299) captured in 1.722 secs
[1] 10 10 2016 09:11:33.544:DEBUG [middleware:karma]: custom files null null
[1] 10 10 2016 09:11:33.544:DEBUG [middleware:karma]: Serving static request /context.html
[1] 10 10 2016 09:11:33.557:DEBUG [web-server]: serving: C:\Users\Toby\WebstormProjects\timesheetCrusher\node_modules\karma\static/context.html
[1] 10 10 2016 09:11:33.571:DEBUG [web-server]: serving: C:\Users\Toby\WebstormProjects\timesheetCrusher\node_modules\karma\static/context.js
[1] 10 10 2016 09:11:33.583:DEBUG [middleware:source-files]: Requesting /absoluteC:/Users/Toby/AppData/Local/Temp/a3ebde98982e7b28c9d1624786c469a4.browserify?59c06c9eba4f4adc27dc229cfaebba395247ee16 /
[1] 10 10 2016 09:11:33.583:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/AppData/Local/Temp/a3ebde98982e7b28c9d1624786c469a4.browserify
[1] 10 10 2016 09:11:33.585:DEBUG [web-server]: serving (cached): C:/Users/Toby/AppData/Local/Temp/a3ebde98982e7b28c9d1624786c469a4.browserify
[1] 10 10 2016 09:11:33.589:DEBUG [middleware:source-files]: Requesting /base/node_modules/karma-jasmine/lib/boot.js?945a38bf4e45ad2770eb94868231905a04a0bd3e /
[1] 10 10 2016 09:11:33.589:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/karma-jasmine/lib/boot.js
[1] 10 10 2016 09:11:33.590:DEBUG [middleware:source-files]: Requesting /base/node_modules/karma-jasmine/lib/adapter.js?1e4f995124c2f01998fd4f3e16ace577bf155ba9 /
[1] 10 10 2016 09:11:33.590:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/karma-jasmine/lib/adapter.js
[1] 10 10 2016 09:11:33.592:DEBUG [middleware:source-files]: Requesting /base/node_modules/systemjs/dist/system.src.js?ce47c157d0451bc324d5039dfc7b04fa1cf0925d /
[1] 10 10 2016 09:11:33.593:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/systemjs/dist/system.src.js
[1] 10 10 2016 09:11:33.595:DEBUG [middleware:source-files]: Requesting /base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?391e45351df9ee35392d2e5cb623221a969fc009 /
[1] 10 10 2016 09:11:33.595:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/jasmine-core/lib/jasmine-core/jasmine.js
[1] 10 10 2016 09:11:33.595:DEBUG [middleware:source-files]: Requesting /base/node_modules/core-js/client/shim.js?23bcf04b0fcefe4c6fe3d641e6c1c6fd2a525332 /
[1] 10 10 2016 09:11:33.595:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/core-js/client/shim.js
[1] 10 10 2016 09:11:33.596:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/karma-jasmine/lib/boot.js
[1] 10 10 2016 09:11:33.597:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/karma-jasmine/lib/adapter.js
[1] 10 10 2016 09:11:33.598:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/systemjs/dist/system.src.js
[1] 10 10 2016 09:11:33.601:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/jasmine-core/lib/jasmine-core/jasmine.js
[1] 10 10 2016 09:11:33.603:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/core-js/client/shim.js
[1] 10 10 2016 09:11:33.607:DEBUG [middleware:source-files]: Requesting /base/node_modules/reflect-metadata/Reflect.js?dda56e9eda58525388f2f12f0e03222eea4db7ec /
[1] 10 10 2016 09:11:33.608:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/reflect-metadata/Reflect.js
[1] 10 10 2016 09:11:33.608:DEBUG [middleware:source-files]: Requesting /base/node_modules/zone.js/dist/zone.js?c35727d0e64913b5669320b167e496fc94fc6928 /
[1] 10 10 2016 09:11:33.609:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/zone.js
[1] 10 10 2016 09:11:33.609:DEBUG [middleware:source-files]: Requesting /base/node_modules/zone.js/dist/long-stack-trace-zone.js?190d11155f82a27dfb07231dd5d843be81752df0 /
[1] 10 10 2016 09:11:33.609:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/long-stack-trace-zone.js
[1] 10 10 2016 09:11:33.611:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/reflect-metadata/Reflect.js
[1] 10 10 2016 09:11:33.612:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/zone.js
[1] 10 10 2016 09:11:33.614:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/long-stack-trace-zone.js
[1] 10 10 2016 09:11:33.615:DEBUG [middleware:source-files]: Requesting /base/node_modules/zone.js/dist/proxy.js?13037d720197b33695136adbb068be1826fe1bda /
[1] 10 10 2016 09:11:33.615:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/proxy.js
[1] 10 10 2016 09:11:33.616:DEBUG [middleware:source-files]: Requesting /base/node_modules/zone.js/dist/sync-test.js?e9499c7853b5f42755015c38ee71b41d2b3a4c2a /
[1] 10 10 2016 09:11:33.616:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/sync-test.js
[1] 10 10 2016 09:11:33.619:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/proxy.js
[1] 10 10 2016 09:11:33.626:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/sync-test.js
[1] 10 10 2016 09:11:33.629:DEBUG [middleware:source-files]: Requesting /base/node_modules/zone.js/dist/jasmine-patch.js?18f8bcddbcafc03a52e8f190726a85581b4a3c10 /
[1] 10 10 2016 09:11:33.629:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/jasmine-patch.js
[1] 10 10 2016 09:11:33.631:DEBUG [middleware:source-files]: Requesting /base/node_modules/zone.js/dist/async-test.js?dfbb53d215a0f5fe064360706cf52ba5c0f40c30 /
[1] 10 10 2016 09:11:33.632:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/async-test.js
[1] 10 10 2016 09:11:33.632:DEBUG [middleware:source-files]: Requesting /base/node_modules/zone.js/dist/fake-async-test.js?0337d6818a2aefcefb40ab4e513943f5ff3e9fb0 /
[1] 10 10 2016 09:11:33.632:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/fake-async-test.js
[1] 10 10 2016 09:11:33.632:DEBUG [middleware:source-files]: Requesting /base/karma-test-shim.js?a8b46428653c0dfd7ef5d35dfe6b8633a9821984 /
[1] 10 10 2016 09:11:33.633:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/karma-test-shim.js
[1] 10 10 2016 09:11:33.635:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/jasmine-patch.js
[1] 10 10 2016 09:11:33.638:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/async-test.js
[1] 10 10 2016 09:11:33.639:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/node_modules/zone.js/dist/fake-async-test.js
[1] 10 10 2016 09:11:33.646:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/karma-test-shim.js
[1] 10 10 2016 09:11:33.647:DEBUG [middleware:source-files]: Requesting /base/dist/test/backand/backand-rest.service.spec.js?0d2f3c79f250240de04a539f2d50e1d95d102562 /
[1] 10 10 2016 09:11:33.647:DEBUG [middleware:source-files]: Fetching C:/Users/Toby/WebstormProjects/timesheetCrusher/dist/test/backand/backand-rest.service.spec.js
[1] 10 10 2016 09:11:33.649:DEBUG [web-server]: serving (cached): C:/Users/Toby/WebstormProjects/timesheetCrusher/dist/test/backand/backand-rest.service.spec.js
[1] Chrome 53.0.2785 (Windows 10 0.0.0) ERROR
[1] Uncaught Error: bundle error (see logs)
[1] at C:/Users/Toby/AppData/Local/Temp/a3ebde98982e7b28c9d1624786c469a4.browserify:1
[1]
[1]
[1] 10 10 2016 09:11:33.683:DEBUG [karma]: Run complete, exiting.
[1] 10 10 2016 09:11:33.720:DEBUG [launcher]: Disconnecting all browsers
[1] 10 10 2016 09:11:33.721:DEBUG [framework.browserify]: cleaning up
[1] 10 10 2016 09:11:33.789:ERROR [karma]: [TypeError: Cannot read property 'end' of undefined]
[1] TypeError: Cannot read property 'end' of undefined
[1] at C:\Users\Toby\WebstormProjects\timesheetCrusher\node_modules\karma-htmlfile-reporter\index.js:121:44
[1] at C:\Users\Toby\WebstormProjects\timesheetCrusher\node_modules\karma\lib\helper.js:144:7
[1] at FSReqWrap.oncomplete (fs.js:82:15)
[1] 10 10 2016 09:11:33.838:DEBUG [launcher]: Disconnecting all browsers
[1] 10 10 2016 09:11:33.838:DEBUG [framework.browserify]: cleaning up
[1] 10 10 2016 09:11:33.933:DEBUG [launcher]: Process Chrome exited with code 0
[1] 10 10 2016 09:11:33.934:DEBUG [temp-dir]: Cleaning temp dir C:\Users\Toby\AppData\Local\Temp\karma-98045299
[1] 10 10 2016 09:11:34.039:DEBUG [launcher]: Finished all browsers
Here is the test:
import {BaseRequestOptions, Http, Response, BaseResponseOptions, Headers} from '@angular/http';
import {ReflectiveInjector} from '@angular/core';
import {MockBackend} from '@angular/http/testing';
import {inject} from '@angular/core/testing';
import {AsyncTestCompleter} from '@angular/core/testing/async_test_completer';
it('should get some data', inject([AsyncTestCompleter], (async) => {
var connection;
var injector = ReflectiveInjector.resolveAndCreate([
MockBackend,
{provide: Http, useFactory: (backend, options) => {
return new Http(backend, options);
}, deps: [MockBackend, BaseRequestOptions]}]);
var http = injector.get(Http);
var backend = injector.get(MockBackend);
//Assign any newly-created connection to local variable
backend.connections.subscribe(c => connection = c);
http.request('data.json').subscribe((res) => {
expect(res.text()).toBe('awesome');
async.done();
});
var options = new BaseResponseOptions();
var res = new Response(options.merge({
body: 'awesome',
headers: new Headers({framework: 'angular'})
}));
connection.mockRespond(res);
}));
The problem seems to be:
[1] 10 10 2016 09:11:31.762:ERROR [framework.browserify]: bundle error
[1] 10 10 2016 09:11:31.762:ERROR [framework.browserify]:
[1] C:\Users\Toby\WebstormProjects\timesheetCrusher\node_modules\@angular\core\testing\async_test_completer.js:11
[1] export var AsyncTestCompleter = (function () {
[1] ^
[1] ParseError: 'import' and 'export' may appear only with 'sourceType: module
'
Here is my package.json:
{
"name": "TimesheetCrusher",
"version": "0.0.5",
"description": "TimesheetCrusher",
"scripts": {
"typings-install": "typings install",
"postinstall": "npm run typings-install",
"build": "webpack --inline --colors --progress --display-error-details --display-cached",
"watch": "npm run build -- --watch",
"server:dev": "webpack-dev-server --progress --profile --colors --display-error-details --display-cached --content-base src/",
"server": "webpack-dev-server --inline --colors --progress --display-error-details --display-cached --port 3000 --content-base src",
"start": "npm run server",
"test": "tsc && concurrently \"tsc -w\" \"karma start karma.conf.js\"",
"tsc": "tsc",
"tsc:w": "tsc -w",
"report": "lite-server -c bs-config.report.json",
"clean": "rimraf public/* ",
"cleanNodeModules" : "rimraf node_modules/*"
},
"contributors": [
"Rob Wormald <robwormald@gmail.com>",
"PatrickJS <github@gdi2290.com>"
],
"license": "MIT",
"devDependencies": {
"compression-webpack-plugin": "0.3.0",
"copy-webpack-plugin": "1.1.1",
"browserify" : "13.1.0",
"html-webpack-plugin": "2.8.1",
"awesome-typescript-loader": "1.1.1",
"webpack-merge": "^0.14.0",
"css-loader": "0.23.1",
"es6-promise-loader": "1.0.1",
"exports-loader": "0.6.2",
"expose-loader": "0.7.1",
"file-loader": "0.8.5",
"http-server": "0.8.5",
"imports-loader": "0.6.5",
"json-loader": "0.5.4",
"postcss-loader" : "0.10.1",
"karma-browserify" : "5.1.0",
"ncp": "2.0.0",
"node-sass": "3.7.0",
"phantomjs-polyfill": "0.0.1",
"phantomjs-prebuilt": "2.1.4",
"raw-loader": "0.5.1",
"reflect-metadata": "0.1.2",
"resolve-url-loader": "1.4.3",
"rimraf": "2.5.1",
"sass-loader": "3.1.2",
"source-map-loader": "0.1.5",
"style-loader": "0.13.0",
"ts-helper": "0.0.1",
"ts-loader": "0.8.0",
"ts-node": "0.5.5",
"tsconfig-lint": "0.5.0",
"typedoc": "0.3.12",
"typings": "1.0.4",
"url-loader": "0.5.7",
"webpack": "1.12.13",
"webpack-dev-server": "1.14.1",
"webpack-md5-hash": "0.0.4",
"jasmine-core": "~2.4.1",
"karma": "^1.2.0",
"karma-chrome-launcher": "^0.2.3",
"karma-cli": "^0.1.2",
"karma-htmlfile-reporter": "^0.2.2",
"karma-jasmine": "^0.3.8",
"protractor": "^3.3.0",
"rimraf": "^2.5.2",
"concurrently": "^2.2.0",
"systemjs": "0.19.27"
},
"dependencies": {
"@angular/common": "2.0.0",
"@angular/compiler": "2.0.0",
"@angular/core": "2.0.0",
"@angular/http": "2.0.0",
"@angular/compiler-cli": "0.5.0",
"@angular/platform-server": "2.0.0",
"@angular/forms": "2.0.0",
"@angular/platform-browser": "2.0.0",
"typescript": "^1.9.0-dev",
"@angular/platform-browser-dynamic": "2.0.0",
"@angular/router": "3.0.0",
"bootstrap": "4.0.0-alpha.2",
"bootstrap-loader": "1.0.9",
"autoprefixer": "6.3.1",
"ng2-bootstrap": "1.0.16",
"ng2-page-scroll": "3.1.0",
"font-awesome": "4.5.0",
"angular2-template-loader": "^0.4.0",
"simple-line-icons": "2.3.2",
"glyphicons-halflings": "1.9.0",
"core-js": "^2.4.1",
"ie-shim": "^0.1.0",
"rxjs": "5.0.0-beta.12",
"zone.js": "^0.6.23",
"jquery": "2.2.0",
"tether": "1.1.1"
},
"keywords": [
"Angular2",
"angular2-seed",
"official angular 2 seed",
"official angular2 seed"
]
}
Here is the karma.conf.js:
// #docregion
module.exports = function (config) {
var appBase = 'dist/src/'; // transpiled app JS and map files
var appSrcBase = 'src/'; // app source TS files
var appAssets = '/base/app/'; // component assets fetched by Angular's compiler
var testBase = 'dist/test/'; // transpiled test JS and map files
var testSrcBase = 'test/'; // test source TS files
config.set({
basePath: '',
frameworks: ['jasmine', 'browserify'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-htmlfile-reporter'),
require('karma-browserify')
],
customLaunchers: {
// From the CLI. Not used here but interesting
// chrome setup for travis CI using chromium
Chrome_travis_ci: {
base: 'Chrome',
flags: ['--no-sandbox']
}
},
files: [
// System.js for module loading
'node_modules/systemjs/dist/system.src.js',
// Polyfills
'node_modules/core-js/client/shim.js',
'node_modules/reflect-metadata/Reflect.js',
// zone.js
'node_modules/zone.js/dist/zone.js',
'node_modules/zone.js/dist/long-stack-trace-zone.js',
'node_modules/zone.js/dist/proxy.js',
'node_modules/zone.js/dist/sync-test.js',
'node_modules/zone.js/dist/jasmine-patch.js',
'node_modules/zone.js/dist/async-test.js',
'node_modules/zone.js/dist/fake-async-test.js',
// RxJs
{pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false},
{pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false},
// Paths loaded via module imports:
// Angular itself
{pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
{pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false},
{pattern: 'systemjs.config.js', included: false, watched: false},
{pattern: 'systemjs.config.extras.js', included: false, watched: false},
'karma-test-shim.js',
// transpiled application & spec code paths loaded via module imports
{pattern: appBase + '**/*.js', included: false, watched: true},
{pattern: testBase + '**/*.js', included: true, watched: true},
// Asset (HTML & CSS) paths loaded via Angular's component compiler
// (these paths need to be rewritten, see proxies section)
{pattern: appBase + '**/*.html', included: false, watched: true},
{pattern: appBase + '**/*.css', included: false, watched: true},
// Paths for debugging with source maps in dev tools
{pattern: appSrcBase + '**/*.ts', included: false, watched: false},
{pattern: appBase + '**/*.js.map', included: false, watched: false},
{pattern: testSrcBase + '**/*.ts', included: false, watched: true},
{pattern: testBase + '**/*.js.map', included: false, watched: false}
],
// Proxied base paths for loading assets
proxies: {
// required for component assets fetched by Angular's compiler
"/app/": appAssets
},
exclude: [],
preprocessors: {
'dist/test/**/*.spec.js': ['browserify']
},
reporters: ['progress', 'html'],
// HtmlReporter configuration
htmlReporter: {
// Open this file to see results in browser
outputFile: 'test-output/tests.html',
// Optional
pageTitle: 'Unit Tests',
subPageTitle: __dirname
},
// Browserify configuration
browserify: {
debug: true
},
port: 9876,
colors: true,
logLevel: config.LOG_DEBUG,
autoWatch: false,
browsers: ['Chrome'],
singleRun: true
})
}
So it seems browserify is having trouble with the Async test package.
The tooling around Angular 2 is massive and hard to get right at the beginning. Can anyone point me in the right direction?
Thank you very much.
1 answers
solution1
0 2016-10-10 03:20:08
I've never used the AsyncTestCompleter , and I've never seen it used anywhere, except in the Angular source tests. I don't know if it's something that's just meant to be used internally or not, but when I tested I got a different error, saying there is no provider for AsyncTestCompleter .
For your test though, you don't need to use it. There are other ways to handle async tests. One options is to just use async
import { async } from '@angular/core/testing'
it('...', async(inject([Http], (http) => {
http.request('data.json').subscribe((res) => {
expect(res.text()).toBe('awesome');
});
})));
Here, we don't need to call done anywhere. The test gets wrapped in Zone, and the Zone is aware of all asynchronous tasks, and waits for them to complete before ending the test.
Anther option is fakeAsync where we can force the to wait the ending of tasks synchronously by calling tick
import { fakeAsync, tick } from '@angular/core';
it('...', fakeAsync(inject([Http], (http) => {
let data;
http.request('data.json').subscribe((res) => {
data = res.text();
});
tick();
expect(res.text()).toBe('awesome');
})));
The other option is to just use the native Jasmine done . I am not sure how to get it to work with inject though, so you can just get the Http just like you are currently doing from the test bed.
it('...', fakeAsync((done) => {
http.request('data.json').subscribe((res) => {
expect(res.text()).toBe('awesome');
done();
});
}));
This is all explained in the docs you linked to, in the section Test a component with an async service
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.
Related Question
mock testing http - angular2
How can a mock a http observable in Angular2 for when no api is written
How to do a unit test for Http get MockBackend in Angular2?
Mock a $http.put result of an angular model - unit test
Angular2 test async Http.MockBackend.connections promise not yielding
Getting ReadableStream as body mocking http backend in angular2 unit test
Angular2 Http Request
Angular2 parsing HTTP response
Angular2 asynchronous http request
Angular2 Http Call not firing
Related Tags