Как полюбить Unit тесты (Javascript Edition)

Юнит-тестирование (англ. unit testing) — процесс в программировании, позволяющий проверить на корректность отдельные модули исходного кода программы. Идея состоит в том, чтобы писать тесты для каждой нетривиальной функции или метода. Это позволяет достаточно быстро проверить, не привело ли очередное изменение кода к регрессии, то есть к появлению ошибок в уже оттестированных местах программы, а также облегчает обнаружение и устранение таких ошибок.

Utility Class

Class 1

Class 2

Зачем его проводить?

Увереность в коде
Возможность проверять код на разных устройствах, платформах и браузерах
Сообщает об ошибках в связаном коде
Проблема в коде всплывает мгновенно (пока программист помнит что там происходит)

Как его делать?

Скачиваем NodeJs

Устанавливаем Karma

npm install karma --save-dev

npm install karma-jasmine karma-chrome-launcher --save-dev

Пишем первый тест

Исходный код

'use strict';
describe("Reverse array", function () {
	it("It shoud equal", function () {
		expect(multiplication(5,2)).toBe(10);
	});

	it("it shoud equal", function () {
		expect(multiplication(0.5,2)+5).toBe(6);
	});
});

Тест

'use strict';
function multiplication(first,second){
    return (first * second).toFixed(1);
}

Запускаем тест

Исправляем

return parseFloat(
        (first * second).toFixed()
       );

Как сделать тестирование проще?

Пишем код правильно

var tmplCache = {};

function loadTemplate (name) {
  if (!tmplCache[name]) {
    tmplCache[name] = $.get('/templates/' + name);
  }
  return tmplCache[name];
}
$(function () {
  var resultsList = $('#results');
  var liked = $('#liked');
  $('#searchForm').on('submit', function (e) {
    e.preventDefault();
    if (pending) { return; }
    var form = $(this);
    var query = $.trim( form.find('input[name="q"]').val() );
    pending = true;
    $.ajax('/data/search.json', {
      data : { q: query },
      dataType : 'json',
      success : function (data) {
        loadTemplate('people-detailed.tmpl').then(function (t) {
          var tmpl = _.template(t);
          resultsList.html( tmpl({ people : data.results }) );
          pending = false;
        });
      }
    });

    $('<li>', {
      'class' : 'pending',
      html : 'Идёт поиск…'
    }).appendTo( resultsList.empty() );
  });
});

Интегрируем

Автоматизируем

yo angular:controller user