- обробки подій на сторінці;
- формування HTML-контенту;
- роботи з AJAX.
Використовуючи разом QUnit і Sinon.JS, можна написати юніт-тести для будь-якого з цих застосувань.
Швидкий старт
Передбачається, що тестоване API зберігається в окремому файлі chat.js, код юніт-тестів писатимемо в окремому файлі chat.tests.js, а для запуску тестів створимо сторінку tests.html, в якій пропишемо посилання на тестоване API, код тестів і необхідні бібліотеки:
Для запуску тестів треба відкрити сторінку tests.html в браузері, тут ми побачимо такий результат:
Опція "Check for globals" перевіряє наявність глобальних змінних в API і тестах, що дуже корисно для запобігання конфліктам.
Якщо включена опція "No try-catch", то тести будуть виконуватися до першого exception, що не дозволить прогнати весь набір тестів, але дасть доступ до низкоуровневой інформації про виняткову ситуацію, що зручно для налагодження в старих браузерах.
Для перевірки тверджень в юніт-тестах QUnit надає кілька функцій. Зверніть увагу, що на відміну від інших xUnit-фреймворків актуального значення вказується першим аргументом, а очікуване - другим (крім функції ok (), в якій перевіряється перший аргумент). Останнім аргументом може бути рядок з поясненням, що саме перевіряється твердженням.
- ok () - очікує істинність першого аргументу
- equal () / notEqual () - для порівняння використовується оператор ==
- deepEqual () / notDeepEqual () - для порівняння використовується оператор ===
- strictEqual () / notStrictEqual () - для порівняння використовується оператор (===
- throws () - очікує, що буде згенеровано виняткова ситуація.
простий приклад
Для створення юніт-тесту QUnit надає функцію test (), першим аргументом якої є рядок з назвою тесту, другим - функція, яка містить код тесту. У цьому прикладі перевіряється, що виклик методу з тестованого API поверне об'єкт очікуваної структури.
Приклад складніше з використанням верстки
Спеціальний div # qunit-fixture зручно використовувати для тестування генерується верстки, так як QUnit очищає його після кожного тесту, що забезпечує атомарность.
Модулі, конфігурація
QUnit дозволяє об'єднувати тести в модулі, це зручно для угруповання тестів подібного функціоналу. Модуль може мати змінні, видимі в кожному тесті, а також функції setup () і teardown (), які виконуються перед і після кожного тесту відповідно, і в яких можна форматувати і очищати загальні дані. Модуль починається з функції module (), після якої може йти n-ну кількість функцій test (), всі n тестів будуть належати цьому модулю. Модуль скінчиться тоді, коли почнеться наступний модуль.
У тесті використовуємо початкові в setup () змінні:
Що дає Sinon.JS
Найпростіша обгортка, виконує стеження за викликом. Вихідний об'єкт не змінюється, і в нього віддається управління. Зручна для перевірки того, яка функція з якими параметрами була викликана. Деякі члени інтерфейсу:
- calledOnce () - повертає true, якщо функція була викликана рівно один раз
- callCount - лічильник викликів функції
- getCall (m) .args [n] - повертає n-ний аргумент m-ного виклику
- getCall (m) .calledWith (args) - перевіряє, що m-ний виклик стався з зазначеними аргументами.
Розширює інтерфейс spy, при цьому оригінальний об'єкт заміщається і не викликається. Можна налаштовувати необхідну поведінку емульованого об'єкта при виклику, наприклад значення, що повертається.
Приклад використання spy і stub:
емуляція сервера
Sinon.JS дозволяє емулювати відповідь сервера при ajax-запитах:
Моки - подальший розвиток ідеї заглушок, вони дають можливість тонко налаштувати очікувану поведінку об'єкта і потім перевірити, що робота з емульованого об'єктом проходила належним чином.
Інтеграція з ant
Запустити юніт-тести під час автоматичного складання (і зупинити складання в разі падіння тесту) можна за допомогою PhantomJS (це запускається в консолі WebKit) і спеціального Раннера. Після установки PhantomJS створіть змінну оточення PHANTOMJS_HOME, що вказує на папку PhantomJS.
Нижче наведено приклад ant-проекту, який виконує QUnit-тести під час збирання: