相关疑难解决方法(0)

使用routerLink进行Angular 2单元测试组件

我试图用angular 2 final测试我的组件,但是我得到一个错误,因为组件使用了该routerLink指令.我收到以下错误:

无法绑定到'routerLink',因为它不是'a'的已知属性.

这是ListComponent模板的相关代码

<a 
  *ngFor="let item of data.list" 
  class="box"
  routerLink="/settings/{{collectionName}}/edit/{{item._id}}">
Run Code Online (Sandbox Code Playgroud)

这是我的考验.

import { TestBed } from '@angular/core/testing';

import { ListComponent } from './list.component';
import { defaultData, collectionName } from '../../config';
import { initialState } from '../../reducers/reducer';


const data = {
  sort: initialState.sort,
  list: [defaultData, defaultData],
};

describe(`${collectionName} ListComponent`, () => {
  let fixture;
  beforeEach(() => {
    TestBed.configureTestingModule({
      declarations: [
        ListComponent,
      ],
    }).compileComponents(); // compile template and css;
    fixture = TestBed.createComponent(ListComponent);
    fixture.componentInstance.data = data;
    fixture.detectChanges(); …
Run Code Online (Sandbox Code Playgroud)

typescript angular2-routing angular2-testing angular

55
推荐指数
3
解决办法
4万
查看次数

如何在测试angular 2应用程序时正确使用SharedModules和Router?

我正在尝试对(角度2)组件进行单元测试routerLink,routerLinkActive但是所有测试用例都会失败,并显示以下错误消息.(注意:我已经删除了路由器和其他相关的依赖项.这是我用于相同的参考.).

无法读取undefined的属性'subscribe'

我也注意到,当routerLinkrouterLinkActive从我的模板被删除,所有测试用例将没有任何错误运行.

我认为错误是由RouterTestingModuleSharedModule(包含用于显示和验证密码输入字段的组件)引起的.所以我尝试删除或添加它们以找到实际导致问题的原因.这是我观察到的.

  • 我得到' Cannot read property 'subscribe' of undefined'如果 RouterTestingModuleSharedModule现在.
  • 我没有得到任何链接到路由器的错误,只有当我删除两个RouterTestingModule,SharedModules但是组件中的元素SharedModules不会被加载到组件中,并且一些测试用例仍然因此而失败.

TestBed配置:

TestBed.configureTestingModule({

            imports: [CoreModule,SharedModule,RouterTestingModule],
            declarations: [ MyComponent,RouterLinkStubDirective,RouterOutletStubComponent ],
            providers: [
                FormBuilder,
                { provide: Router, useClass: RouterStub },
                { provide: ActivatedRoute, userClass: ActivatedRouteStub}
            ],
            schemas: [NO_ERRORS_SCHEMA]
        })
            .overrideComponent(MyComponent, {
                set: {
                    providers: [
                        {provide: AuthModel, useClass: MockAuthModel}    
                    ],
                }
            })
            .compileComponents(); …
Run Code Online (Sandbox Code Playgroud)

unit-testing typescript karma-jasmine angular

6
推荐指数
1
解决办法
1243
查看次数