【发布时间】：2017-01-31 07:17:23
【问题描述】：
总结
我无法在 Angular2 项目上运行我的 jasmine 测试，同时查看我的文件是否有更改。我发现了一个看似有效但希望“官方”方法正常工作的 hack。
问题
我正在阅读 Angular2（2.0.0 版）文档示例，目前正在阅读测试部分。我希望有自己的工作代码可以在本地使用，而不仅仅是在他们提供的 Plunker 上工作。因此，我已经下载并合并了 Angular2 网站提供的 Plunker 代码（它没有，例如 package.json，因此需要一些合并）与 Angular2 Quickstart github 代码中的“标准”文件。我可以使用npm start 让应用程序工作（所以我知道我的代码不是，比如说，根本上格式错误或缺少部分）。但是，我无法进行测试。
问题似乎在于让观看的打字稿编译与业力正确协调。测试使用单个运行，即 npm run test-once，根据 package.json，调用 tsc && karma start karma.conf.js --single-run。但是，对监视文件使用 karma 不起作用，即 npm run test 或只是调用 tsc && concurrently \"tsc -w\" \"karma start karma.conf.js\" 的 npm test。
一些相关代码（我认为）和输出/错误
我将尝试在此处提供一些似乎相关的代码，但请理解，据我所知，我只是使用直接的官方 Angular2 文档代码。
package.json:
{
...
"scripts": {
"start": "tsc && concurrently \"tsc -w\" \"lite-server\" ",
...
"test": "tsc && concurrently \"tsc -w\" \"karma start karma.conf.js\"",
"test-once": "tsc && karma start karma.conf.js --single-run",
...
},
...
"dependencies": {
"@angular/common": "2.0.0",
"@angular/compiler": "2.0.0",
"@angular/core": "2.0.0",
"@angular/forms": "2.0.0",
"@angular/http": "2.0.0",
"@angular/platform-browser": "2.0.0",
"@angular/platform-browser-dynamic": "2.0.0",
"@angular/router": "3.0.0",
"@angular/upgrade": "2.0.0",
"systemjs": "0.19.27",
"core-js": "^2.4.1",
"reflect-metadata": "^0.1.3",
"rxjs": "5.0.0-beta.12",
"zone.js": "^0.6.23",
"angular2-in-memory-web-api": "0.0.20",
"bootstrap": "^3.3.6"
},
"devDependencies": {
"concurrently": "^2.2.0",
"lite-server": "^2.2.0",
"typescript": "^2.0.2",
"typings": "^1.0.4",
"canonical-path": "0.0.2",
"http-server": "^0.9.0",
"tslint": "^3.7.4",
"lodash": "^4.11.1",
"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"
},
...
}
tsconfig.json:
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": true,
"suppressImplicitAnyIndexErrors": true
}
}
当我使用npm run test（或者，等效地，npm test）时输出错误：
| ==> npm test
> angular2-quickstart@1.0.0 test /path/to/proj
> tsc && concurrently "tsc -w" "karma start karma.conf.js"
[1] 22 09 2016 11:19:09.622:WARN [watcher]: Pattern "/path/to/proj/testing/**/*.js" does not match any file.
[1] 22 09 2016 11:19:09.655:WARN [watcher]: Pattern "/path/to/proj/testing/**/*.ts" does not match any file.
[1] 22 09 2016 11:19:09.656:WARN [watcher]: Pattern "/path/to/proj/testing/**/*.js.map" does not match any file.
[1] 22 09 2016 11:19:10.040:WARN [karma]: No captured browser, open http://localhost:9876/
[1] 22 09 2016 11:19:10.063:WARN [karma]: Port 9876 in use
[1] 22 09 2016 11:19:10.063:WARN [karma]: Port 9877 in use
[1] 22 09 2016 11:19:10.063:WARN [karma]: Port 9878 in use
[1] 22 09 2016 11:19:10.063:WARN [karma]: Port 9879 in use
[1] 22 09 2016 11:19:10.064:INFO [karma]: Karma v1.3.0 server started at http://localhost:9880/
[1] 22 09 2016 11:19:10.064:INFO [launcher]: Launching browser Chrome with unlimited concurrency
[1] 22 09 2016 11:19:10.100:INFO [launcher]: Starting browser Chrome
[1] 22 09 2016 11:19:11.030:INFO [Chrome 53.0.2785 (Mac OS X 10.11.6)]: Connected on socket /#Qadj2c9N0RBUEQHYAAAA with id 20369349
Chrome 53.0.2785 (Mac OS X 10.11.6): Executed 6 of 6 SUCCESS (0.272 secs / 0.257 secs)
[1] 22 09 2016 11:19:12.187:INFO [watcher]: Changed file "/path/to/proj/app/model/hero.service.js".
[1] 22 09 2016 11:19:12.205:INFO [watcher]: Changed file "/path/to/proj/app/model/hero.js".
[1] 22 09 2016 11:19:12.231:INFO [watcher]: Changed file "/path/to/proj/app/model/http-hero.service.js".
[1] 22 09 2016 11:19:12.251:INFO [watcher]: Changed file "/path/to/proj/app/model/test-heroes.js".
[1] 22 09 2016 11:19:12.269:INFO [watcher]: Changed file "/path/to/proj/app/shared/twain.service.js".
[0] 11:19:12 AM - Compilation complete. Watching for file changes.
[1] 22 09 2016 11:19:12.337:INFO [watcher]: Changed file "/path/to/proj/app/1st.spec.js".
[1] 22 09 2016 11:19:12.351:INFO [watcher]: Changed file "/path/to/proj/app/about.component.js".
...many more similar lines for seemingly all project files...
[1] 22 09 2016 11:19:12.670:INFO [watcher]: Changed file "/path/to/proj/app/shared/highlight.directive.js".
[1] 22 09 2016 11:19:12.683:INFO [watcher]: Changed file "/path/to/proj/app/shared/title-case.pipe.js".
[1] 22 09 2016 11:19:12.744:INFO [karma]: Delaying execution, these browsers are not ready: Chrome 53.0.2785 (Mac OS X 10.11.6)
Chrome 53.0.2785 (Mac OS X 10.11.6): Executed 6 of 6 SUCCESS (0.211 secs / 0.2 secs)
[1] Chrome 53.0.2785 (Mac OS X 10.11.6): Executed 0 of 6 SUCCESS (0 secs / 0 secs)
[1] Missing error handler on `socket`.
[1] TypeError: Cannot set property '20369349' of null
[1] at createHtmlResults (/path/to/proj/node_modules/karma-htmlfile-reporter/index.js:57:32)
[1] at initializeHtmlForBrowser (/path/to/proj/node_modules/karma-htmlfile-reporter/index.js:78:5)
[1] at onBrowserStart (/path/to/proj/node_modules/karma-htmlfile-reporter/index.js:91:5)
[1] at null.<anonymous> (/path/to/proj/node_modules/karma/lib/events.js:13:22)
[1] at emitTwo (events.js:105:20)
[1] at emit (events.js:185:7)
[1] at onStart (/path/to/proj/node_modules/karma/lib/browser.js:126:13)
[1] at Socket.<anonymous> (/path/to/proj/node_modules/karma/lib/events.js:13:22)
[1] at emitOne (events.js:95:20)
[1] at Socket.emit (events.js:182:7)
[1] at Socket.onevent (/path/to/proj/node_modules/socket.io/lib/socket.js:335:8)
[1] at Socket.onpacket (/path/to/proj/node_modules/socket.io/lib/socket.js:295:12)
[1] at Client.ondecoded (/path/to/proj/node_modules/socket.io/lib/client.js:193:14)
[1] at Decoder.Emitter.emit (/path/to/proj/node_modules/component-emitter/index.js:134:20)
[1] at Decoder.add (/path/to/proj/node_modules/socket.io-parser/index.js:247:12)
[1] at Client.ondata (/path/to/proj/node_modules/socket.io/lib/client.js:175:18)
Chrome 53.0.2785 (Mac OS X 10.11.6) ERROR
[1] Disconnectedundefined
Chrome 53.0.2785 (Mac OS X 10.11.6): Executed 0 of 6 DISCONNECTED (2.008 secs / 0 secs)
[1] 22 09 2016 11:19:15.628:ERROR [karma]: [TypeError: Cannot read property '20369349' of null]
[1] TypeError: Cannot read property '20369349' of null
[1] at onBrowserComplete (/path/to/proj/node_modules/karma-htmlfile-reporter/index.js:95:23)
[1] at null.<anonymous> (/path/to/proj/node_modules/karma/lib/events.js:13:22)
[1] at emitOne (events.js:95:20)
[1] at emit (events.js:182:7)
[1] at null._onTimeout (/path/to/proj/node_modules/karma/lib/browser.js:166:17)
[1] at Timer.listOnTimeout (timers.js:92:15)
[1] karma start karma.conf.js exited with code 1
输出，没有错误，使用npm run test-once:
| ==> npm run test-once
> angular2-quickstart@1.0.0 test-once /Users/AndrewWillems/Documents/Computer/Programming/js/la-learning-angular/ang-web-site/sec04-advd-docmntn/v03/sec14g-testing-starting-w-quickstart
> tsc && karma start karma.conf.js --single-run
22 09 2016 11:24:36.021:WARN [watcher]: Pattern "/Users/AndrewWillems/Documents/Computer/Programming/js/la-learning-angular/ang-web-site/sec04-advd-docmntn/v03/sec14g-testing-starting-w-quickstart/testing/**/*.js" does not match any file.
22 09 2016 11:24:36.052:WARN [watcher]: Pattern "/Users/AndrewWillems/Documents/Computer/Programming/js/la-learning-angular/ang-web-site/sec04-advd-docmntn/v03/sec14g-testing-starting-w-quickstart/testing/**/*.ts" does not match any file.
22 09 2016 11:24:36.053:WARN [watcher]: Pattern "/Users/AndrewWillems/Documents/Computer/Programming/js/la-learning-angular/ang-web-site/sec04-advd-docmntn/v03/sec14g-testing-starting-w-quickstart/testing/**/*.js.map" does not match any file.
22 09 2016 11:24:36.422:WARN [karma]: Port 9876 in use
22 09 2016 11:24:36.423:WARN [karma]: Port 9877 in use
22 09 2016 11:24:36.423:WARN [karma]: Port 9878 in use
22 09 2016 11:24:36.423:WARN [karma]: Port 9879 in use
22 09 2016 11:24:36.424:INFO [karma]: Karma v1.3.0 server started at http://localhost:9880/
22 09 2016 11:24:36.424:INFO [launcher]: Launching browser Chrome with unlimited concurrency
22 09 2016 11:24:36.430:INFO [launcher]: Starting browser Chrome
22 09 2016 11:24:37.272:INFO [Chrome 53.0.2785 (Mac OS X 10.11.6)]: Connected on socket /#7TxMaq43YrbuDQr-AAAA with id 4862877
Chrome 53.0.2785 (Mac OS X 10.11.6): Executed 6 of 6 SUCCESS (0.248 secs / 0.231 secs)
一些补充说明
- 它必须搜索多个端口才能找到未使用的端口这一事实似乎无关紧要，因为我可以在
tsconfig.json中更改所需的端口，结果是相同的。 - 请注意，输出到一半时出现错误，我得到两行：
Chrome 53.0.2785 (Mac OS X 10.11.6): Executed 6 of 6 SUCCESS (0.211 secs / 0.2 secs)，紧随其后的是[1] Chrome 53.0.2785 (Mac OS X 10.11.6): Executed 0 of 6 SUCCESS (0 secs / 0 secs)。我不知道这有什么意义，但似乎很奇怪。 - 我已经对一些错误消息进行了 Google 搜索（包括通过 StackOverflow/StackExchange），包括
Delaying execution, these browsers are not ready、TypeError: Cannot read property ... of null。我遇到了一些讨论（包括一些很长的讨论），但没有明显的解决方案。 - 大多数单独的工具似乎都可以单独运行。即
tsc、tsc -w、./node_modules/concurrently/src/main.js "echo hello" "echo world"、karma start（如前所述）
一个似乎对我有用的技巧
我找到了一种适合我的解决方案。我将在这里展示它，以便如果其他人遇到同样的问题，至少有一种方法可以（某种程度上）解决它。不过，如果有人能给我提供一个真正的解决方案，那就更好了。
我的解决方案是让计算机观看文件，但在应用程序运行时这样做，而不是以专门用于测试的方式。因此，在一个终端窗口（我在 Mac 上工作）中，我将运行 npm start，它运行应用程序并继续观看文件。然后，在另一个终端窗口中，我将运行karma start（或karma start karma.conf.js）。每次我进行文件更改时，该应用程序都会重新启动，这反过来又会产生重新运行我的测试的业力。
不过，这个 hack 并不能解释为什么 npm run test 不起作用。此外，上述黑客似乎确实失败了，例如，每十个文件更改就有一次。也许这对于 TDD 来说是正常的，我不确定，但不必重新启动所有东西会很好。
那么，我怎样才能让npm test 工作？
【问题讨论】：
标签： javascript angular npm jasmine karma-runner