尝试使用Mocha测试框架在angular中测试Typescript时解决导入问题

时间:2019-04-10 11:19:22

标签: angular typescript unit-testing mocha

我正在尝试将摩卡测试框架集成到我现有的Angular应用程序中。我已经按预期完成了设置,但是由于我要测试组件,服务等,因此我尝试使用Angular Test Bed配置,因此我想用 typescript 编写测试文件 ,这会为我带来错误。

我尝试了不同的方法,这给了我不同的错误。首先,我安装了 mocha @ types / mocha ,然后还更新了 package.json 。然后,当我运行 npm测试 时,它产生了错误。我尝试安装 ts-node 并在测试配置中要求它并运行测试,但是并不能解决此问题。然后,我尝试更改编译器模块,然后产生另一个错误。我尝试搜索SO以及其他许多网站,但是解决方案对我没有帮助。

这是第一次尝试。我的 test.ts 文件

import { TestBed, ComponentFixture } from "@angular/core/testing";
import { LoginComponent } from 'src/app/login/login.component';

let assert = require('assert');

describe('LoginComponent', () => {

    let fixture: ComponentFixture<LoginComponent>;
    let component: LoginComponent;

    beforeEach(function() {
        TestBed.configureTestingModule({
            declarations: [LoginComponent]
        })
        fixture = TestBed.createComponent(LoginComponent);
        component = fixture.componentInstance;
        fixture.detectChanges();
    });

    it('create Login component', () => {
        assert.notNull(component);
    });
});

并产生以下错误堆栈跟踪。

D:\Testing\cenium-web\test\login.component.test.ts:1
(function (exports, require, module, __filename, __dirname) { import { TestBed } from "@angular/core/testing";
SyntaxError: Unexpected token {
    at new Script (vm.js:80:7)
    at createScript (vm.js:274:10)
    at Object.runInThisContext (vm.js:326:10)
    at Module._compile (internal/modules/cjs/loader.js:664:28)
    at Module.m._compile (D:\Testing\cenium-web\node_modules\ts-node\src\index.ts:439:23)
    at Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Object.require.extensions.(anonymous function) [as .ts] (D:\Testing\cenium-web\node_modules\ts-node\src\index.ts:442:12)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at D:\Testing\cenium-web\node_modules\mocha\lib\mocha.js:330:36
    at Array.forEach (<anonymous>)
    at Mocha.loadFiles (D:\Testing\cenium-web\node_modules\mocha\lib\mocha.js:327:14)
    at Mocha.run (D:\Testing\cenium-web\node_modules\mocha\lib\mocha.js:804:10)
    at Object.exports.singleRun (D:\Testing\cenium-web\node_modules\mocha\lib\cli\run-helpers.js:207:16)
    at exports.runMocha (D:\Testing\cenium-web\node_modules\mocha\lib\cli\run-helpers.js:300:13)
    at Object.exports.handler.argv [as handler] (D:\Testing\cenium-web\node_modules\mocha\lib\cli\run.js:296:3)
    at Object.runCommand (D:\Testing\cenium-web\node_modules\mocha\node_modules\yargs\lib\command.js:242:26)
    at Object.parseArgs [as _parseArgs] (D:\Testing\cenium-web\node_modules\mocha\node_modules\yargs\yargs.js:1087:28)
    at Object.parse (D:\Testing\cenium-web\node_modules\mocha\node_modules\yargs\yargs.js:566:25)
    at Object.exports.main (D:\Testing\cenium-web\node_modules\mocha\lib\cli\cli.js:63:6)
    at Object.<anonymous> (D:\Testing\cenium-web\node_modules\mocha\bin\_mocha:10:23)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:754:12)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)
npm ERR! Test failed.  See above for more details.

这是我的 tsconfig.json 文件。

{
    "compileOnSave": false,
    "compilerOptions": {
        "baseUrl": "./",
        "outDir": "./dist/out-tsc",
        "sourceMap": true,
        "declaration": false,
        "module": "es2015",
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "importHelpers": true,
        "target": "es5",
        "types": ["node", "mocha"],
        "typeRoots": ["node_modules/@types"],
        "lib": ["es2018", "dom"],
        "paths": {
            "cComponents": ["dist/cComponents"],
            "cComponents/*": ["dist/cComponents/*"]
        }
    }
}

然后我尝试将编译器模块从 es2015 更改为 commonjs

这导致了我认为路径中的另一个错误

Error: Cannot find module 'src/app/login/login.component'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:582:15)
    at Function.Module._load (internal/modules/cjs/loader.js:508:25)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.<anonymous> (D:\Testing\cenium-web\test\login.component.test.ts:2:1)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Module.m._compile (D:\Testing\cenium-web\node_modules\ts-node\src\index.ts:439:23)
    at Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Object.require.extensions.(anonymous function) [as .ts] (D:\Testing\cenium-web\node_modules\ts-node\src\index.ts:442:12)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at D:\Testing\cenium-web\node_modules\mocha\lib\mocha.js:330:36
    at Array.forEach (<anonymous>)
    at Mocha.loadFiles (D:\Testing\cenium-web\node_modules\mocha\lib\mocha.js:327:14)
    at Mocha.run (D:\Testing\cenium-web\node_modules\mocha\lib\mocha.js:804:10)
    at Object.exports.singleRun (D:\Testing\cenium-web\node_modules\mocha\lib\cli\run-helpers.js:207:16)
    at exports.runMocha (D:\Testing\cenium-web\node_modules\mocha\lib\cli\run-helpers.js:300:13)
    at Object.exports.handler.argv [as handler] (D:\Testing\cenium-web\node_modules\mocha\lib\cli\run.js:296:3)
    at Object.runCommand (D:\Testing\cenium-web\node_modules\mocha\node_modules\yargs\lib\command.js:242:26)
    at Object.parseArgs [as _parseArgs] (D:\Testing\cenium-web\node_modules\mocha\node_modules\yargs\yargs.js:1087:28)
    at Object.parse (D:\Testing\cenium-web\node_modules\mocha\node_modules\yargs\yargs.js:566:25)
    at Object.exports.main (D:\Testing\cenium-web\node_modules\mocha\lib\cli\cli.js:63:6)
    at Object.<anonymous> (D:\Testing\cenium-web\node_modules\mocha\bin\_mocha:10:23)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:754:12)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)
npm ERR! Test failed.  See above for more details.

我明确指出我必须使用 webpack 之类的东西来解析这些模块。它是否正确?如有可能,有人可以指导我解决问题吗?

我想在现有测试文件中使用 TestBed 配置来测试我的组件。非常感谢任何人都可以帮助我,因为我是测试的新手。提前致谢。希望信息足够。

0 个答案:

没有答案