lundi 25 avril 2016

How to test my RouteConfig and other decorators in an Angular 2 Component

I am trying to write unit tests for my Angular 2 component before I go any further but I have no idea how to write a test which checks whether my RouteConfig's path is set to '/documents'. I also would like to have a test which verifies that my template contains '<router-outlet></router-outlet>' inside.

This is my component:

import { Component } from 'angular2/core';
import { CanActivate, RouteConfig, ROUTER_DIRECTIVES } from angular2/router';
import DocumentsComponent from './documents/documents.component';

@Component({
    template: `
        dashboard
        <router-outlet></router-outlet>
    `,
    directives: [
        ROUTER_DIRECTIVES,
    ]
})
@CanActivate((next, prev) => {
    // check if user have access
    return true;
})
@RouteConfig([
    {
        path: '/documents',
        name: 'Documents',
        component: DocumentsComponent,
        useAsDefault: true,
    }
])
export default class DashboardComponent {
    public name: string = 'John';
    sayHello(): string {
        return `Hello ${this.name}`;
    }
}

And this is my test (I'm using Jasmine):

import DashboardComponent from './../app/dashboard/dashboard.component';
import {describe, it, beforeEach, expect} from 'angular2/testing';

describe('My DashboardComponent', () => {

  var dashboard: DashboardComponent = null;

  beforeEach(function() {
    dashboard = new DashboardComponent();
  });

  it('should have its path set to "/documents"', function() {
      // ???
  });

  it('should have "<router-outlet></router-outlet>" in its template', function() {
      // ???
  });

  it('should have name property', function() {
    expect(dashboard.name).toBe('John');
  });

  it('should say hello with name property', function() {
    expect(dashboard.sayHello()).toBe('Hello John');
  });

});

Aucun commentaire:

Enregistrer un commentaire