4.2.1. Kiểm thử đơn vị, kiểm thử chấp thuận tự động

• Kiểm thử ứng dụng: sử dụng công nghệ Karma - Jasmine cùng với một số Angular testing utilities để tiến hành kiểm thử cho dự án sử dụng framework Angular 2 của nhóm.
• Đường dẫn tới các kịch bản kiểm thử: https://github.com/ChuThom610/Panda-Online/tree/master/features
• Sử dụng lệnh npm test để chạy kiểm thử và kết quả như sau:

Một số mã nguồn chạy kiểm thử:

• Kiểm thử chức năng phần "Kỹ năng sống":

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { KnsComponent } from 'app/kynangsong/kns.component';
import { DebugElement } from "@angular/core";

describe('KnsComponent (templateUrl)', () => {
    beforeEach(() => {
        jasmine.DEFAULT_TIMEOUT_INTERVAL = 10000;
        TestBed.configureTestingModule( {
            declarations: [KnsComponent],
        });
        TestBed.compileComponents();
    });

    it ('should open the page "Kỹ năng sống"', async(() => {
        const fixture = TestBed.createComponent(KnsComponent);
        const app = fixture.debugElement.componentInstance;
        expect(app).toBeTruthy();
    }));

    it('should have as titles "TRUYỆN NGẮN" and "QUÀ TẶNG CUỘC SỐNG"', async(() => {
        const fixture = TestBed.createComponent(KnsComponent);
        const app = fixture.debugElement.componentInstance;
        expect(app.titles[0]).toEqual("TRUYỆN NGẮN");
        expect(app.titles[1]).toEqual("QUÀ TẶNG CUỘC SỐNG");
    }));

    it ('should render "TRUYỆN NGẮN" in h2 tag', async(() => {
        const fixture = TestBed.createComponent(KnsComponent);
        const comp = fixture.debugElement.nativeElement;
        const app = fixture.debugElement.componentInstance;
        fixture.detectChanges();
        expect(comp.querySelector('h2').textContent).toContain('TRUYỆN NGẮN');
    }));

    it ('should have as "Hưng Đạo Đại Vương" story', async(() => {
        const fixture = TestBed.createComponent(KnsComponent);
        const app = fixture.debugElement.componentInstance;
        expect(app.stories[0]).toEqual("Hưng Đạo Đại Vương");
    }));

    it ('should render "Hưng Đạo Đại Vương" in list-group-item class', async(() => {
        const fixture = TestBed.createComponent(KnsComponent);
        const comp = fixture.debugElement.nativeElement;
        const app = fixture.debugElement.componentInstance;
        fixture.detectChanges();
        expect(comp.querySelector('.list-group-item').textContent).toContain('Hưng Đạo Đại Vương');
    }));

    it ('should click link to read "Hưng Đạo Đại Vương" story or watch "Gánh Xôi Của Bà" video', async(() => {
        const fixture = TestBed.createComponent(KnsComponent);
        const a = fixture.debugElement.query(By.css('a'));
        a.triggerEventHandler('click', null);
        fixture.detectChanges();
        expect(a).toBeTruthy();
    }));

});

• Kiểm thử "Trang chủ":

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from "@angular/core";

import { HomeComponent } from 'app/home.component';

describe('HomeComponent (templateUrl)', () => {
    beforeEach(() => {
        jasmine.DEFAULT_TIMEOUT_INTERVAL = 10000;
        TestBed.configureTestingModule( {
            declarations: [HomeComponent],
        });
        TestBed.compileComponents();
    });

    it ('should open the homepage', async(() => {
        const fixture = TestBed.createComponent(HomeComponent);
        const app = fixture.debugElement.componentInstance;
        expect(app).toBeTruthy();
    }));

    it('should have as titles "Luyện tập", "Kiểm tra" and "Kỹ năng sống"', async(() => {
        const fixture = TestBed.createComponent(HomeComponent);
        const app = fixture.debugElement.componentInstance;
        expect(app.titles[0]).toEqual("Luyện tập");
        expect(app.titles[1]).toEqual("Kiểm tra");
        expect(app.titles[2]).toEqual("Kỹ năng sống");
    }));

    it ('should render "Luyện tập" in h3 tag', async(() => {
        const fixture = TestBed.createComponent(HomeComponent);
        const comp = fixture.debugElement.nativeElement;
        const app = fixture.debugElement.componentInstance;
        fixture.detectChanges();
        expect(comp.querySelector('h3').textContent).toContain('Luyện tập');
    }));

});

• Kiểm thử "Luyện tập":

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from "@angular/core";
import { RouterTestingModule } from '@angular/router/testing';
import { luyentapComponent } from './luyentap.component';


describe('luyentapComponent (template)', () => {
    beforeEach(() => {
        jasmine.DEFAULT_TIMEOUT_INTERVAL = 10000;
        TestBed.configureTestingModule( {
            declarations: [luyentapComponent],
            imports: [ RouterTestingModule ]
        });
        TestBed.compileComponents();
    });

    it ('should open the page "Luyện tập"', async(() => {
        const fixture = TestBed.createComponent(luyentapComponent);
        const app = fixture.debugElement.componentInstance;
        expect(app).toBeTruthy();
    }));

    it ('should click link to practice', async(() => {
        const fixture = TestBed.createComponent(luyentapComponent);
        const a = fixture.debugElement.query(By.css('a'));
        a.triggerEventHandler('click', null);
        fixture.detectChanges();
        expect(a).toBeTruthy();
    }));
});

• Kiểm thử "Kiểm tra":

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from "@angular/core";
import { RouterTestingModule } from '@angular/router/testing';
import { KiemTraComponent } from './kiemtra.component';

describe('KiemTraComponent (templateUrl)', () => {
    beforeEach(() => {
        jasmine.DEFAULT_TIMEOUT_INTERVAL = 10000;
        TestBed.configureTestingModule( {
            declarations: [KiemTraComponent],
            imports: [ RouterTestingModule ]
        });
        TestBed.compileComponents();
    });

    it ('should open the page "Kiểm tra"', async(() => {
        const fixture = TestBed.createComponent(KiemTraComponent);
        const app = fixture.debugElement.componentInstance;
        expect(app).toBeTruthy();
    }));

    it('should have as title "Đề kiểm tra môn Toán 1"', async(() => {
        const fixture = TestBed.createComponent(KiemTraComponent);
        const app = fixture.debugElement.componentInstance;
        expect(app.title).toEqual("Đề kiểm tra môn Toán 1");
    }));

    it ('should render title in h1 tag', async(() => {
        const fixture = TestBed.createComponent(KiemTraComponent);
        const comp = fixture.debugElement.nativeElement;
        const app = fixture.debugElement.componentInstance;
        fixture.detectChanges();
        expect(comp.querySelector('h1').textContent).toContain('');
    }));
});

• Kiểm thử "AppComponent":

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from "@angular/core";

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

import { AppComponent } from './app.component';

describe('AppComponent (templateUrl)', () => {
    beforeEach(() => {
        jasmine.DEFAULT_TIMEOUT_INTERVAL = 10000;
        TestBed.configureTestingModule( {
            declarations: [AppComponent],
            imports: [ RouterTestingModule ]
        });
        TestBed.compileComponents();
    });

    it ('should exist AppComponent', async(() => {
        const fixture = TestBed.createComponent(AppComponent);
        const app = fixture.debugElement.componentInstance;
        expect(app).toBeTruthy();
    }));

    it ('should support clicking a button', async(() => {
        const fixture = TestBed.createComponent(AppComponent);
        const btn = fixture.debugElement.query(By.css('button'));
        const app = fixture.debugElement.componentInstance;
        btn.triggerEventHandler('click', app.notice());
        fixture.detectChanges();
        expect(app.notice()).toBeUndefined();
    }));
});