Вот мое решение, хотя и не слишком простое.Я использовал Travis, Karma и очень простой код Jasmine.
Во-первых, вам нужно иметь файл package.json в корне приложения с таким содержанием:
{
"name": "CITapp",
"description": "Concealed Information Test app",
"version": "1.0.2",
"scripts": {
"test": "karma start test/karma.conf.js --single-run"
},
"devDependencies": {
"jasmine-core": "*",
"karma": "*",
"karma-chrome-launcher": "^2.2.0",
"karma-cli": "*",
"karma-fixture": "^0.2.6",
"karma-html2js-preprocessor": "*",
"karma-jasmine": "*",
"karma-phantomjs-launcher": "*",
"phantomjs-prebuilt": "*"
}
}
Еслитеперь вы запускаете npm install
в терминале по пути приложения, каждый необходимый модуль будет добавлен в приложение (в папке node_modules).(Для этого Node.js должен быть сначала установлен на ПК.) Это необходимо только для локального тестирования (на вашем собственном ПК), но Travis выполняет эту установку автоматически на своем сервере на каждом git push
(увидеть ниже).(Эти модули занимают довольно много места, поэтому их лучше не включать в приложение, например, в частности, в хранилище.)
Для Travis вам просто необходим файл .travis.yml с:
language: node_js
node_js:
- "stable"
Теперь в файле package.json появилась эта строка "test": "karma start test/karma.conf.js --single-run"
.Это направляет команду «test» в файл karma.conf.js в каталоге test в приложении.Этот файл должен содержать что-то вроде этого:
module.exports = function(config) {
config.set({
basePath: '',
frameworks: ['jasmine'],
files: [
'../js/jquery-2.1.3.min.js', // JQuery from the root's js folder
'../js/my_scripts.js', // personal scripts from the root's js folder
'add_html.js', // from same folder as the karma.conf.js
'test.js' // from the same folder as the karma.conf.js
],
exclude: [
],
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: false,
browsers: ['ChromeHeadlessNoSandbox'],
customLaunchers: {
ChromeHeadlessNoSandbox: {
base: 'ChromeHeadless',
flags: [
'--no-sandbox',
'--disable-gpu',
'--enable-logging',
'--no-default-browser-check',
'--no-first-run',
'--disable-default-apps',
'--disable-popup-blocking',
'--disable-translate',
'--disable-background-timer-throttling',
'--disable-renderer-backgrounding',
'--disable-device-discovery-notifications',
'--remote-debugging-port=9222',
'--disable-web-security'
]
}
},
singleRun: true,
concurrency: Infinity
})
}
Самое главное, я использовал фреймворк jasmine
, инициировал ChromeHeadless
(с некоторыми специальными flags
, потому что в противном случае он дает ошибки), и загрузил мои файлыв списке files : [...]
.
Файл add_html.js добавляет HTML-код на страницу с помощью кода JS, например, как (следуя примеру в вопросе):
var fixture = "<div id='my_div'><p>paragraph1</p><p>paragraph2</p></div>";
document.body.insertAdjacentHTML('afterbegin', fixture);
(по какой-то причине, когда я пытаюсь загрузитьHTML напрямую через список файлов Karma, он не работает - но его вставка так, как я, тоже подходит.)
Наконец, тест с Jasmine в test.js
так же прост:
describe("suite", function() {
it("check if my_test() returns true", function() {
expect( my_test() ).toBe(true);
});
});
Обратите внимание, что функция my_test()
взята из (гипотетического) файла my_scripts.js - возможно, идентичного тому, что был в примере вопроса - так что она определена как простая чистая (ну, только JQuery добавлен) JS скрипт.Всякий раз, когда скрипт возвращает true, тест Жасмин будет пройден.Если он не вернет true (включая любые несвязанные ошибки, которые останавливают выполнение тестового кода), тест не пройден.
Все это можно проверить локально, используя команду npm test
от терминала на путиприложения (опять же, для этого сначала должны быть установлены все необходимые пакеты Node.js).
Теперь последнее, что нужно сделать, это подключить Travis CI к репозиторию, что очень просто.шаги;см. их учебник по GitHub .Это создаст специальный сайт Travis, подключенный к данному репозиторию GitHub.
Тогда все готово.При каждом нажатии Travis будет создавать страницу в безголовом («невидимом») браузере Chrome и запускать функцию my_test()
, отправляя необязательные уведомления в случае сбоя.Каждое сообщение через console.log()
в этой функции (или в любой другой функции приложения, выполняемой во время тестирования) отображается на сайте Travis.Еще одна приятная вещь: если вы хотите, чтобы тестирование прекратилось в определенной точке (например, если некоторые условия не выполняются), вы можете просто написать throw "this and this condition was not met"
, что также останавливает тест Тревиса в этой точке, показывая это сообщение об ошибке.
Для моей реальной реализации см .: https://github.com/gasparl/citapp_pc (Конечно, есть некоторые дополнения, но логика та же.)