问题描述
我正在尝试设置我的角度测试,但该测试试图在我尝试测试的组件之外加载一个组件:
组件是一个简单的语言选择器:
language.component.ts:
import { Component,OnInit } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
@Component({
selector: 'app-language',templateUrl: './language.component.html',styleUrls: ['./language.component.scss'],})
export class LanguageComponent implements OnInit {
current: string;
langs: string[];
constructor(public translate: TranslateService) {}
ngOnInit(): void {
this.langs = this.translate.getLangs();
this.current = this.translate.currentLang;
}
setLang(lang: string) {
this.translate.use(lang);
this.current = lang;
localStorage.setItem('translation.language',lang);
}
}
language.component.spec.ts:
import { ComponentFixture,Testbed } from '@angular/core/testing';
import { MatMenuModule } from '@angular/material/menu';
import { TranslateModule } from '@ngx-translate/core';
import { LanguageComponent } from './language.component';
fdescribe('LanguageComponent',() => {
let component: LanguageComponent;
let fixture: ComponentFixture<LanguageComponent>;
beforeEach(() => {
Testbed.configureTestingModule({
declarations: [LanguageComponent],imports: [TranslateModule.forRoot(),MatMenuModule],}).compileComponents();
});
beforeEach(() => {
fixture = Testbed.createComponent(LanguageComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create',() => {
expect(component).toBeTruthy();
});
afterEach(() => {
fixture.destroy();
});
});
language.component.html:
<button mat-icon-button [matMenuTriggerFor]="Lang">{{ this.current }}</button>
<mat-menu #Lang="matMenu">
<button
mat-menu-item
*ngFor="let lang of langs"
[value]="lang"
(click)="setLang(lang)"
>
{{ 'languages.' + lang | translate }}
</button>
</mat-menu>
如您所见,我使用的是 fdescribe
,因此它仅测试该特定组件。但是会抛出以下错误:
An error was thrown in afterall
Uncaught ReferenceError: Cannot access 'ShellComponent' before initialization
ReferenceError: Cannot access 'ShellComponent' before initialization
at Module.ShellComponent (http://localhost:9876/_karma_webpack_/main.js:39178:113)
at Module.ShellComponent (http://localhost:9876/_karma_webpack_/main.js:27719:172)
at Module.ShellComponent (http://localhost:9876/_karma_webpack_/main.js:37580:162)
at Module.i2L+ (http://localhost:9876/_karma_webpack_/src/app/_shared/shared.module.ts:36:5)
at __webpack_require__ (http://localhost:9876/_karma_webpack_/webpack/bootstrap:84:1)
at Module.LEUy (http://localhost:9876/_karma_webpack_/main.js:17430:72)
at __webpack_require__ (http://localhost:9876/_karma_webpack_/webpack/bootstrap:84:1)
at Module.oPWF (http://localhost:9876/_karma_webpack_/main.js:34920:68)
at __webpack_require__ (http://localhost:9876/_karma_webpack_/webpack/bootstrap:84:1)
at Module.05o4 (http://localhost:9876/_karma_webpack_/main.js:1768:72)
ShellComponent
是导入 LanguageComponent
的那个,但我不知道它为什么要尝试访问它以进行此测试。
Google 说要将 emitDecoratorMetadata
设为 false,但这没有任何改变。
除此之外,我还没有找到任何解决此问题的方法
问候
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)