JSPM 和测试台以及无法解释的 "testing.js" 输出
JSPM and testbench and unexplainable "testing.js" output
几天来我们一直在纠结,似乎无法真正解决实际问题。我们想创建一个测试平台,以增加我们的代码覆盖率,但事实证明这并不像预期的那么容易。
包含正确的区域文件后,我们通过查看来自 angular 的快速入门发现我们需要调用 TestBed.initTestEnvironment。其中需要参数,我们导入:
import * as browserTesting from '@angular/platform-browser-dynamic/testing';
TestBed.initTestEnvironment(
browserTesting.BrowserDynamicTestingModule,
browserTesting.platformBrowserDynamicTesting()
);
但是,一旦我们尝试 运行 通过 Karma(使用茉莉花),我们 运行 进入 404:
Running "karma:single" (karma) task
Verifying property karma.single exists in config...OK
File: [no files]
Options: background=false, client={}
20 12 2016 13:22:25.757:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
20 12 2016 13:22:25.764:INFO [launcher]: Starting browser Chrome
20 12 2016 13:22:26.439:INFO [Chrome 54.0.2840 (Linux 0.0.0)]: Connected on socket cuixl-0soveFUA_PAAAA with id 58970475
20 12 2016 13:22:26.711:WARN [web-server]: 404: /base/jspm_packages/npm/@angular/compiler@2.3.0/bundles/compiler-testing.umd.js/index.js
20 12 2016 13:22:26.713:WARN [web-server]: 404: /base/jspm_packages/npm/@angular/core@2.3.0/bundles/core-testing.umd.js/index.js
20 12 2016 13:22:26.714:WARN [web-server]: 404: /base/jspm_packages/npm/@angular/platform-browser@2.3.0/bundles/platform-browser-testing.umd.js/index.js
Chrome 54.0.2840 (Linux 0.0.0) ERROR
Error: (SystemJS) XHR error (404 Not Found) loading /home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/@angular/compiler@2.3.0/bundles/compiler-testing.umd.js/index.js
Error: XHR error (404 Not Found) loading /home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/@angular/compiler@2.3.0/bundles/compiler-testing.umd.js/index.js
at XMLHttpRequest.wrapFn [as _onreadystatechange] (/home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/zone.js@0.7.2/dist/zone.js:729:25) [<root>]
at Zone.runTask (/home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/zone.js@0.7.2/dist/zone.js:135:41) [<root> => <root>]
at XMLHttpRequest.ZoneTask.invoke (/home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/zone.js@0.7.2/dist/zone.js:285:27) [<root>]
Error loading /home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/@angular/compiler@2.3.0/bundles/compiler-testing.umd.js/index.js as "./bundles/compiler-testing.umd.js/index" from /home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/@angular/compiler@2.3.0/testing.js
查看 "jspm_packages/npm/@angular/compiler@2.3.0/testing.js",我们很快发现它保存了错误的信息:
module.exports = require('./bundles/compiler-testing.umd.js/index');
而不是预期的:
module.exports = require('./bundles/compiler-testing.umd');
如果我手动更正它,一切都会完美无缺。所以我的问题:
我们如何防止 JSPM 或任何人生成错误的 testing.js 文件?
我们的想法是,出于某种原因,jspm 认为 compiler-testing.umd.js 文件是一个文件夹,因此将 /index 附加到它
*我们通过 config.js 包含了 angular 文件:*
System.config({
defaultJSExtensions: true,
transpiler: "typescript",
paths: {
"github:*": "jspm_packages/github/*",
"npm:*": "jspm_packages/npm/*"
},
map: {
"@angular/common": "npm:@angular/common@2.3.0",
"@angular/compiler": "npm:@angular/compiler@2.3.0",
"@angular/core": "npm:@angular/core@2.3.0",
"@angular/core/testing": "npm:@angular/core@2.3.0/bundles/core-testing.umd.js",
"@angular/forms": "npm:@angular/forms@2.3.0",
"@angular/http": "npm:@angular/http@2.3.0",
"@angular/http/testing": "npm:@angular/http@2.3.0/bundles/http-testing.umd.js",
"@angular/platform-browser": "npm:@angular/platform-browser@2.3.0",
"@angular/platform-browser-dynamic": "npm:@angular/platform-browser-dynamic@2.3.0",
"@angular/platform-browser-dynamic/testing": "npm:@angular/platform-browser-dynamic@2.3.0/bundles/platform-browser-dynamic-testing.umd.js",
"@angular/router": "npm:@angular/router@3.3.0",
经过漫长而广泛的搜索和数小时的比较,我实际上找到了问题和解决所有这些问题的方法:
- 问题:angular2 示例都使用 npm_modules,因此他们调整了 systemjs 文件以使用 npm 文件夹,但是,我们选择使用 JSPM,因为这使我们的 backend/infrastructure 和我们的前端。让我们无需更改配置即可 add/remove/upgrade 包。因为 angular2 模块实际上是 2 个模块合二为一,它导致 JSPM 对此产生了一些有趣的事情,因此最终总是试图加载错误的文件:例如"core-testing.umd.js/index" 而不仅仅是 "core-testing.umd".
- 解决方案:终于我找到了金子:更新到 jspm 0.17(在撰写本文时仍处于测试阶段)
新的 JSPM 也能正确检测到测试模块,现在加载已正确完成!
几天来我们一直在纠结,似乎无法真正解决实际问题。我们想创建一个测试平台,以增加我们的代码覆盖率,但事实证明这并不像预期的那么容易。
包含正确的区域文件后,我们通过查看来自 angular 的快速入门发现我们需要调用 TestBed.initTestEnvironment。其中需要参数,我们导入:
import * as browserTesting from '@angular/platform-browser-dynamic/testing';
TestBed.initTestEnvironment(
browserTesting.BrowserDynamicTestingModule,
browserTesting.platformBrowserDynamicTesting()
);
但是,一旦我们尝试 运行 通过 Karma(使用茉莉花),我们 运行 进入 404:
Running "karma:single" (karma) task
Verifying property karma.single exists in config...OK
File: [no files]
Options: background=false, client={}
20 12 2016 13:22:25.757:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
20 12 2016 13:22:25.764:INFO [launcher]: Starting browser Chrome
20 12 2016 13:22:26.439:INFO [Chrome 54.0.2840 (Linux 0.0.0)]: Connected on socket cuixl-0soveFUA_PAAAA with id 58970475
20 12 2016 13:22:26.711:WARN [web-server]: 404: /base/jspm_packages/npm/@angular/compiler@2.3.0/bundles/compiler-testing.umd.js/index.js
20 12 2016 13:22:26.713:WARN [web-server]: 404: /base/jspm_packages/npm/@angular/core@2.3.0/bundles/core-testing.umd.js/index.js
20 12 2016 13:22:26.714:WARN [web-server]: 404: /base/jspm_packages/npm/@angular/platform-browser@2.3.0/bundles/platform-browser-testing.umd.js/index.js
Chrome 54.0.2840 (Linux 0.0.0) ERROR
Error: (SystemJS) XHR error (404 Not Found) loading /home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/@angular/compiler@2.3.0/bundles/compiler-testing.umd.js/index.js
Error: XHR error (404 Not Found) loading /home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/@angular/compiler@2.3.0/bundles/compiler-testing.umd.js/index.js
at XMLHttpRequest.wrapFn [as _onreadystatechange] (/home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/zone.js@0.7.2/dist/zone.js:729:25) [<root>]
at Zone.runTask (/home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/zone.js@0.7.2/dist/zone.js:135:41) [<root> => <root>]
at XMLHttpRequest.ZoneTask.invoke (/home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/zone.js@0.7.2/dist/zone.js:285:27) [<root>]
Error loading /home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/@angular/compiler@2.3.0/bundles/compiler-testing.umd.js/index.js as "./bundles/compiler-testing.umd.js/index" from /home/arend/Documents/Projects/Barco/opspace/barco-opspace/jspm_packages/npm/@angular/compiler@2.3.0/testing.js
查看 "jspm_packages/npm/@angular/compiler@2.3.0/testing.js",我们很快发现它保存了错误的信息:
module.exports = require('./bundles/compiler-testing.umd.js/index');
而不是预期的:
module.exports = require('./bundles/compiler-testing.umd');
如果我手动更正它,一切都会完美无缺。所以我的问题: 我们如何防止 JSPM 或任何人生成错误的 testing.js 文件?
我们的想法是,出于某种原因,jspm 认为 compiler-testing.umd.js 文件是一个文件夹,因此将 /index 附加到它
*我们通过 config.js 包含了 angular 文件:*
System.config({
defaultJSExtensions: true,
transpiler: "typescript",
paths: {
"github:*": "jspm_packages/github/*",
"npm:*": "jspm_packages/npm/*"
},
map: {
"@angular/common": "npm:@angular/common@2.3.0",
"@angular/compiler": "npm:@angular/compiler@2.3.0",
"@angular/core": "npm:@angular/core@2.3.0",
"@angular/core/testing": "npm:@angular/core@2.3.0/bundles/core-testing.umd.js",
"@angular/forms": "npm:@angular/forms@2.3.0",
"@angular/http": "npm:@angular/http@2.3.0",
"@angular/http/testing": "npm:@angular/http@2.3.0/bundles/http-testing.umd.js",
"@angular/platform-browser": "npm:@angular/platform-browser@2.3.0",
"@angular/platform-browser-dynamic": "npm:@angular/platform-browser-dynamic@2.3.0",
"@angular/platform-browser-dynamic/testing": "npm:@angular/platform-browser-dynamic@2.3.0/bundles/platform-browser-dynamic-testing.umd.js",
"@angular/router": "npm:@angular/router@3.3.0",
经过漫长而广泛的搜索和数小时的比较,我实际上找到了问题和解决所有这些问题的方法:
- 问题:angular2 示例都使用 npm_modules,因此他们调整了 systemjs 文件以使用 npm 文件夹,但是,我们选择使用 JSPM,因为这使我们的 backend/infrastructure 和我们的前端。让我们无需更改配置即可 add/remove/upgrade 包。因为 angular2 模块实际上是 2 个模块合二为一,它导致 JSPM 对此产生了一些有趣的事情,因此最终总是试图加载错误的文件:例如"core-testing.umd.js/index" 而不仅仅是 "core-testing.umd".
- 解决方案:终于我找到了金子:更新到 jspm 0.17(在撰写本文时仍处于测试阶段)
新的 JSPM 也能正确检测到测试模块,现在加载已正确完成!