用于TypeScript应用程序测试的Angular 2 – 规格在茉莉花中多次
发布时间:2020-12-17 17:35:11 所属栏目:安全 来源:网络整理
导读:我已经按照本教程测试Angular 2应用程序: https://angular.io/docs/ts/latest/guide/testing.html 完成第一个应用程序测试部分并转到unit-tests.html后,我看到我的规范报告多次出现: 虽然我没有对教程代码进行任何更改,但是为了快速参考,我的unit-tests.ht
我已经按照本教程测试Angular 2应用程序:
https://angular.io/docs/ts/latest/guide/testing.html
完成第一个应用程序测试部分并转到unit-tests.html后,我看到我的规范报告多次出现: 虽然我没有对教程代码进行任何更改,但是为了快速参考,我的unit-tests.html是: <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <title>Ng App Unit Tests</title> <link rel="stylesheet" href="node_modules/jasmine-core/lib/jasmine-core/jasmine.css"> <script src="node_modules/jasmine-core/lib/jasmine-core/jasmine.js"></script> <script src="node_modules/jasmine-core/lib/jasmine-core/jasmine-html.js"></script> <script src="node_modules/jasmine-core/lib/jasmine-core/boot.js"></script> </head> <body> <!-- #1. add the system.js library --> <script src="node_modules/systemjs/dist/system-polyfills.js"></script> <script src="node_modules/systemjs/dist/system.src.js"></script> <script> // #2. Configure systemjs to use the .js extension // for imports from the app folder System.config({ packages: { 'app': {defaultExtension: 'js'} } }); // #3. Import the spec file explicitly System.import('app/hero.spec') // #4. wait for all imports to load ... // then re-execute `window.onload` which // triggers the Jasmine test-runner start // or explain what went wrong. .then(window.onload) .catch(console.error.bind(console)); </script> </body> </html> hero.spec.ts import {Hero} from './hero'; describe('Hero',() => { it('has name',() => { let hero:Hero = {id: 1,name: 'Super Cat'}; expect(hero.name).toEqual('Super Cat'); }); it('has id',name: 'Super Cat'}; expect(hero.id).toEqual(1); }); }); 什么可能出错? 解决方法
由于我之前的评论标记为已删除,我写下了我的最终解决方案以驱逐问题.这个解决方案有效,唯一的问题是它第一次显示带有“未找到规格”文本的HTML页面,但是当加载所有模块时,它会显示所有规格及其结果.
这个解决方案是由曼宁早期访问计划的“Angular 2开发与TypeScript v7 MEAP”一书所采用的: <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <title>Unit Tests</title> <link rel="stylesheet" href="node_modules/jasmine-core/lib/jasmine-core/jasmine.css"> <!-- #1. Polyfills --> <script src="node_modules/reflect-metadata/Reflect.js"></script> <!-- #2. Zone.js dependencies --> <script src="node_modules/zone.js/dist/zone.js"></script> <script src="node_modules/zone.js/dist/async-test.js"></script> <script src="node_modules/zone.js/dist/fake-async-test.js"></script> <!-- #3. Add specs dependencies --> <script src="app/treeNode.spec.ts"></script> <script src="app/template.spec.ts"></script> <script src="app/services/tree.side.service.spec.ts"></script> <script src="app/services/tree.service.spec.ts"></script> <!-- #4. Add Jasmine dependencies --> <script src="node_modules/jasmine-core/lib/jasmine-core/jasmine.js"></script> <script src="node_modules/jasmine-core/lib/jasmine-core/jasmine-html.js"></script> <script src="node_modules/jasmine-core/lib/jasmine-core/boot.js"></script> <script src="node_modules/jasmine-expect/dist/jasmine-matchers.js"></script> <!-- #5. Add the system.js library --> <script src="node_modules/systemjs/dist/system.src.js"></script> <script>System.packageWithIndex = true;</script> <script src="systemjs.config.js"></script> <script> // #6. Configure SystemJS to use the .js extension for imports from the app folder System.config({ packages: { 'app': {defaultExtension: 'js'} } }); var SPEC_MODULES = [ 'app/treeNode.spec','app/template.spec','app/services/tree.side.service.spec','app/services/tree.service.spec' ]; /** * #7. Import the spec files explicitly */ Promise.all([ System.import('@angular/core/testing'),System.import('@angular/platform-browser-dynamic/testing') ]) .then(function (modules) { var testing = modules[0]; var testingBrowser = modules[1]; testing.TestBed.initTestEnvironment(testingBrowser.BrowserDynamicTestingModule,testingBrowser.platformBrowserDynamicTesting()); return Promise.all(SPEC_MODULES.map(function (module) { return System.import(module); })); }) .then(window.onload) .catch(console.error.bind(console)); </script> </head> <body> </body> </html> 我希望你发现这个解决方案很有用. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |