Angular - testowanie klas

Stronę tą wyświetlono już: 413 razy

W przypadku obiektów klas, które nie dziedziczą testowanie jest bardzo proste. Ważne jest aby zrozumieć, że testować należy jedynie metody publiczne (public) klasy, jeżeli istnieje konieczność testowania metod prywatnych (private) czy chronionych (protected) należy wydzielić je do oddzielnej klasy i z poziomu takiej klasy testować (tak przynajmniej jest w teorii).

Oto przykładowa prosta klasa przeznaczona do przetestowania:

Listing 1
  1. export class Student {
  2. birthday: Date;
  3. name: string;
  4. surname: string;
  5. constructor(
  6. name: string,
  7. surname: string,
  8. birthday: Date
  9. ) {
  10. this.name = name;
  11. this.surname = surname;
  12. this.birthday = birthday;
  13. }
  14. get age(): number {
  15. return Math.floor(
  16. (
  17. (
  18. (new Date()).getTime()
  19. -
  20. this.birthday.getTime()
  21. )
  22. /
  23. (
  24. 3600
  25. *
  26. 24
  27. *
  28. 356
  29. *
  30. 1000
  31. )
  32. )
  33. );
  34. }
  35. }

Jak widać nie ma tu zbyt wiele do przetestowania, to co można przetestować to:

  • czy utworzenie instancji zakończy się sukcesem;
  • czy utworzenie instancji inicjalizacje klasę poprawnymi danymi;
  • czy getter zwróci poprawny wiek studenta

Czas zacząć zabawę w testowanie:

Listing 2
  1. import { Student } from './student';
  2. describe('Student', () => {
  3. const nowDate: Date = new Date();
  4. const birthday: Date = new Date(
  5. nowDate.getFullYear() - 27,
  6. nowDate.getMonth(),
  7. nowDate.getDay()
  8. );
  9. const name = 'Grzegorz';
  10. const surname = 'Brzęczyszczykiewicz';
  11. const student: Student = new Student(
  12. name,
  13. surname,
  14. birthday
  15. );
  16. it('should create an instance', () => {
  17. expect(student).toBeTruthy();
  18. });
  19. it(
  20. 'Should be initialized with data',
  21. () => {
  22. expect(
  23. student.birthday
  24. ).toEqual(
  25. birthday
  26. );
  27. expect(
  28. student.surname
  29. ).toEqual(
  30. surname
  31. );
  32. expect(
  33. student.name
  34. ).toEqual(
  35. name
  36. );
  37. }
  38. );
  39. describe(
  40. 'method age',
  41. () => {
  42. it(
  43. 'should return correct age',
  44. () => {
  45. expect(student.age).toEqual(27);
  46. }
  47. );
  48. }
  49. );
  50. });

Funkcja describe przyjmuje jako pierwszy argument opis testu, zaś jako drugi argument funkcję, w której można umieścić wywołania funkcji związanych z inicjalizacją środowiska testowego oraz wywołaniem funkcji it opisującej konkretny przypadek testu i wykonującej test za pomocą funkcji expect.

Wynikiem testu będzie wyświetlenie w oknie przeglądarki mniej więcej takich danych:

Widok wyniku końcowego testowania całej aplikacji
Rys. 1
Widok testów jednostkowych całej aplikacji w skład których wchodzą testy utworzonej klasy Student

Można jeszcze się pokusić o uruchomienie testu z parametrem --code-coverage, co spowoduje utworzenie katalogu coverage zawierającego plik index.html, po którego wyświetleniu w przeglądarce można zobaczyć stopień pokrycia kodu testami (co pokazane zostało na poniższym rysunku).

Angular - testy jednostkowe widok pliku index.html wyświetlającego zestawienie pokrycia kodu testami
Rys. 2
Angular - testy jednostkowe widok pliku index.html wyświetlającego zestawienie pokrycia kodu testam

Po kliknięciu na dany link można oczywiście wyświetlić dalsze szczegóły dotyczące testowanego kodu. Są tam informacje o tym ile razy dany kod został wywołany, które instrukcje warunkowe nie zostały wykonane ani razu, które funkcje nie zostały wywołane ani razu. Ogólnie zalecam pobawienie się tym samemu.

Komentarze