I'm facing a challenge in writing unit tests for my Angular 2 component. Specifically, I need to write a test that checks if the RouteConfig's path is set to '/documents'. Additionally, I want to verify if the template contains
<router-outlet></router-outlet>Here is the code snippet for 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 has 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 here is the test setup 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');
});
});