Question

我在Angular2中进行了测试，其中包含ROUTER_PROVIDERS，我收到此错误消息：

“原始例外：平台必须通过createPlatform创建！”

首先我得到了“No Router for Router”错误，之后我在beforeEachProvider调用中包含了ROUTER_PROVIDERS。这带来了这个问题，我不知道如何找出它与之相关的内容。

我的测试目前看起来像这样：

import {TestComponentBuilder, ComponentFixture} from '@angular/compiler/testing';
import {async, it, describe, expect, beforeEach, beforeEachProviders, inject} from '@angular/core/testing';
import {Component} from '@angular/core';
import {By} from '@angular/platform-browser';
import {HeaderComponent} from './header.component';

import {LocationStrategy, HashLocationStrategy} from '@angular/common';
import {ROUTER_PROVIDERS} from '@angular/router-deprecated';

describe('Header component', () => {

    // Setup the dependencies for this test
    beforeEachProviders(() => [
        ROUTER_PROVIDERS
    ]);

    @Component({
        selector: 'test-header',
        template: `<et-header [username]="username" [user_image_url]="user_image_url"></et-header>`,
        directives: [HeaderComponent]
    })
    class TestHeader {
        username: string = "Header test";
        user_image_url: string = "https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150";
    }

    it('should sent font-size to x-large', async(inject([TestComponentBuilder], (tcb) => {
        return tcb.overrideTemplate(TestHeader, '<et-header [username]="username" [user_image_url]="user_image_url"></et-header>')
            .createAsync(TestHeader).then((fixture: any) => {
                fixture.detectChanges();
                let headerDebugElement = fixture.debugElement.query(By.css('header'));
                //expect(headerDebugElement.nativeElement.classList.contains('header')).toBe(true);
                expect(true).toBe(true);
            });
    })));
});

提前谢谢你。 Joao Garin

Answer 1

FOR ROUTER RELEASE＆lt; RC3

最后，找到了解决这个问题的方法。

运行单元测试时，您需要使用

import {ROUTER_FAKE_PROVIDERS} from '@angular/router/testing';

为路由器提供提供程序。

FOR ROUTER RELEASE 3.0.0-alpha.7（RC3）

import {ActivatedRoute, Router} from '@angular/router'; class MockRouter { createUrlTree() {} } class MockActivatedRoute { } beforeEachProviders(() => [ provide(Router, { useClass: MockRouter }), provide(ActivatedRoute, { useClass: MockActivatedRoute }) ]);

这将为您的测试提供路由器

注意：Angular 2路由器现在有自己的发布周期，与Angular 2包的其余部分分开，因此版本编号不同

Answer 2

这是RC4在测试组件时模拟[routerLink]指令的一种解决方法。

考虑到主分支中的更改，这将在下一个版本中中断。

init()

Answer 3

我因为......

而收到此错误我的HTML中的

[routerLink]。

RC4上最新路由器的正确修复是......

beforeEach(() => addProviders([
  APP_ROUTER_PROVIDERS, // must be first
  {provide: APP_BASE_HREF, useValue: '/'}, // must be second
  {provide: ActivatedRoute, useClass: Mock},
  {provide: Router, useClass: Mock}
]));

采用这种方法的github项目是......

https://github.com/danday74/angular2-coverage

请注意，这允许您使用...

<a [routerLink]="['/route1']">Route 1</a>

但是会失败......

<a [routerLink]="['/route1']" [routerLinkActive]="'active'">Route 1</a>

Angular2 - 平台必须通过`createPlatform`

3 个答案: