2016-09-22 4 views
3

概要Angular2プロジェクトで「npmテスト」が動作しないのはなぜですか?私は、変更のための私のファイルを見ながらAngular2プロジェクトに私のジャスミン・テストを実行するためのカルマを得ることができない

。私は動作するようだが、 "公式"の方法を正しく動作させたいと思うハックを見つけた。

問題

私はAngular2(バージョン2.0.0)のドキュメントの例を挙げて取り組んでいますし、現在試験に関するセクションを通過しています。彼らが提供しているPlunkerに取り組むのではなく、ローカルで遊ぶための自分のコードを作っていきたいです。したがって、Angular2 Quickstart githubコードの "標準"ファイルとAngular2のWebサイト(package.jsonなどがないため、一部のマージが必要)にあるPlunkerコードをダウンロードしてマージしました。私はnpm startを使ってアプリケーションを動作させることができます(私のコードは、基本的にフォーマットが悪い、または欠落しているとは限りません)。しかし、私はテストを動作させることはできません。

問題はカルチャと適切にコーディネートするために見られたタイスクリプトのコンパイルを得ることにあるようです。テストは単一のランスルーで実行されます。つまり、npm run test-onceは、package.jsonに従って、tsc && karma start karma.conf.js --single-runを呼び出します。しかし、監視されたファイルでカルマを使用すると、npm run test、またはnpm testだけがtsc && concurrently \"tsc -w\" \"karma start karma.conf.js\"を呼び出します。

いくつかの関連するコード(と思う)と出力/エラー

私はここでは関係と思われるコードの一部を提供しようとするが、ちょうど、私の知る限り、私はことを理解しましょうまっすぐに公式の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 
    } 
} 

出力、Iはnpm run test(または、等価的に、npm test)を使用:なしと

| ==> npm test 

> [email protected] 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 

出力、エラー:を使用3210:

| ==> npm run test-once 

> [email protected] 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)という2つの行があり、その後にすぐに[1] Chrome 53.0.2785 (Mac OS X 10.11.6): Executed 0 of 6 SUCCESS (0 secs/0 secs)が続きます。私はこれの意義を知らないが、それは奇妙に思える。
  • Delaying execution, these browsers are not ready,TypeError: Cannot read property ... of nullなどのエラーメッセージの一部について、Google検索(StackOverflow/StackExchangeを含む)を行っています。私はいくつかの議論(いくつかの長いものを含む)が発生しましたが、明らかな解決策はありません。
  • 個々のツールのほとんどは、単独で問題なく動作しているようです。すなわちtsc、私は私の作品解決策の一つハックを発見した私

    のために動作するようには思えないtsc -w./node_modules/concurrently/src/main.js "echo hello" "echo world"karma start(前述のように)

一つハック。他の人が同じ問題に遭遇した場合、少なくともそれを回避する方法があります。しかし、誰かが私に実際の解決策を提供できる場合、それはずっと良いでしょう。

私の解決方法は、ファイルを見るようにコンピュータを設定することですが、テスト専用の方法ではなく、アプリケーションの実行中に実行してください。だから、1つの端末ウィンドウ(私はMacで作業している)で、私はnpm startを実行し、アプリケーションを実行してファイルを見続ける。次に、別の端末ウィンドウで、私はちょうどkarma start(またはkarma start karma.conf.js)を実行します。私がファイルを変更するたびにアプリケーションが再起動し、これが順番にカルマを取得してテストを再実行します。

なぜ、npm run testが動作しないのか説明しません。さらに、上記のハックは、例えば10回のファイル変更のうち1回、失敗するように見えます。たぶんTDDの場合は正常ですが、わかりませんが、すべてを再起動する必要はありません。

したがって、どうすればnpm testを動作させることができますか?

答えて

2

私はこの問題を抱えていましたが、それはkarma-htmlfile-reporterから来ていると考えていました。なぜこのエラーが発生したのかをどこからでも調べましたが、理由は分かりませんでした。

reportersから'html'を削除してのエントリを削除して、karma.conf.jsファイルからhtmlリポジトリを無効にします。

すべて正常に動作するはずです。

しかし、htmlファイルレポートが必要な場合は、このモジュールを有効にしてこの問題を解決する方法がわかりません。 testの入力の末尾に| test-result.logを追加してpackage.jsonに報告すると、レポートを受け取ることができます。

+0

ブリリアント!それがそれでした。私はあなたが示唆するようにtest-result.logを使用してレポートを再度有効にしようとはしていませんが、私の記者からhtmlを取り除き、karma.conf.jsからhtmlReporterを削除すると 'npm test'作業が行われました。どうもありがとう。 –

+0

私はあなたのソリューションで少し時間をかけて作業していましたが、それは一種のように見えます。つまり、いくつかのファイルの変更によって動作することがありますが、時にはエラーが「切断」として報告されます。 ?)。私はカルマを実行しているブラウザウィンドウをリフレッシュし、 'npm test'を再実行しなければなりません。 (これは非同期テストに固有の問題かもしれませんが、私は確信していません)質問で報告したハックは、一貫して動作するようです。つまり、ある端末では 'npm start'、別の端末では' karma start' 。 –

+0

Disconnectの問題は私の解法のせいではなく、カルマ問題のように思えますが、それは 'concurrently'に関連していると思います – Supamiu

関連する問題