KarmaJS, Jasmine, RequireJS и т. д.: Как использовать Require для тестирования модулей
запуск тестов Karma + Jasmine с RequireJS -- отрываясь от Земли
помогите! . . . _ _ _ . . . SOS!
вот мой структура:
root
|-/lib
|-/[dependencies] (/angular, /angular-mocks, /bootstrap, /etc) # from bower
|-/src
|-/[unreferenced directories] (/js, /css, /views) # not referenced anywhere
|-app.js # sets up angular.module('app', ...)
|-globals.js # may be referenced in RequireJS main file; not used.
|-index.html # loads bootstrap.css and RequireJS main file
|-main.js # .config + require(['app', 'etc'])
|-routeMap.js # sets up a single route
|-test-file.js # *** simple define(function(){ return {...}; })
|-/test
|-/spec
|-test-test-file.js # *** require || define(['test-file'])
|-.bowerrc # { "directory": "lib" }
|-bower.json # standard format
|-karma.conf.js # *** HELP!
|-test-main.js # *** Save Our Souls!!!
карма.conf.js
// Karma configuration
// Generated on Wed Nov 19 2014 15:16:56 GMT-0700 (Mountain Standard Time)
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine', 'requirejs'],
// list of files / patterns to load in the browser
files: [
//'test/spec/test-test-file.js',
//'lib/**/*.js',
//'src/**/*.js',
//'test/spec/**/*.js',
'test-main.js',
{pattern: 'lib/**/*.js', included: false},
{pattern: 'src/**/*.js', included: false},
{pattern: 'test/spec/*.js', included: true}
],
// list of files to exclude
exclude: [
'lib/**/!(angular|angular-mocks|angular-resource|angular-route|require|text).js',
'lib/**/**/!(jquery|bootstrap).js',
'src/app.js'
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['Chrome'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false
});
};
test-main.js
var allTestFiles = [];
var TEST_REGEXP = /(spec|test).js$/i;
var pathToModule = function(path) {
return path.replace(/^/base//, '').replace(/.js$/, '');
};
Object.keys(window.__karma__.files).forEach(function(file) {
if (TEST_REGEXP.test(file)) {
// Normalize paths to RequireJS module names.
allTestFiles.push(pathToModule(file));
}
});
require.config({
// Karma serves files under /base, which is the basePath from your config file
baseUrl: '/base/src',
paths: {
angular: '../lib/angular/angular',
ngRoute: '../lib/angular-route/angular-route',
jquery: '../lib/jQuery/dist/jquery',
bootstrap: '../lib/bootstrap/dist/js/bootstrap',
models: 'models',
controllers: 'controllers',
globals: 'globals',
routeMap: 'routeMap'
},
shim: {
angular: {
exports: 'angular'
},
ngRoute: {
deps: ['angular']
},
jquery: {
exports: '$'
},
bootstrap: {
deps: ['jquery']
}
},
// dynamically load all test files
deps: allTestFiles,
// we have to kickoff jasmine, as it is asynchronous
callback: window.__karma__.start
});
1 ответов
хорошо, я постараюсь ответить на каждый вопрос за раз:
Вопрос 1
- что делает { pattern:'...', включено: true / false } делать?
поведение кармы по умолчанию:
- найти все файлы с
pattern
(обязательный собственность) - следите за их изменениями (
watched
опция) для перезапуска модульные тесты, чтобы дать вам живой результат при редактировании кода (работает, если только вы оставите значение по умолчаниюautoWatch
значение по умолчаниюtrue
). - обслуживать их с помощью собственного веб-сервера (
served
) - включить их в браузере с помощью
<script>
(included
)
так, в files
массив конфигурации karma вы можете использовать поведение по умолчанию, добавив только строку шаблоны:
files: [
// this will match all your JS files
// in the src/ directory and subdirectories
'src/**/*.js'
]
или используйте полный синтаксис объекта для настройки каждого параметра:
files: [
{pattern: 'src/**/*.js', watched: true, served: true, included: false}
]
используя requireJS, вы не хотите, чтобы они были включены, потому что это будет противоречить поведению requireJS!
включено. Описание: должны ли файлы быть включены в браузер с помощью
<script>
тег? Используйте false, если вы хотите загрузить их вручную, например. используя требуют.js.
от karma / config / files docs
NB: обратите внимание на порядок, в котором вы добавляете файлы/шаблоны в массив. Это важно! Для большего понимания установите logLevel: config.LOG_DEBUG
в вашей конфигурации кармы.
Вопрос 2
- какие файлы мне нужно включить в карму.conf.файл js?
по крайней мере все необходимые файлы для правильного функционирования компоненты для модульное тестирование.
в основном, все файлы, перечисленные в define([])
и require()
блоки.
Вопрос 3
- лучший способ исключить все лишние вещи внутри каталогов bower.
что именно вы пытаетесь сделать?
основываясь на том, что я написал Раньше, вы можете видеть, что вы можете добавлять выборочно файлы, которые вам понадобятся в ваших тестах.
я использую, чтобы добавить узор '/bower_components/**/*.js'
и даже '/bower_components/**/*.html'
когда мои пакеты bower используют шаблоны. Я никогда не замечал каких-либо значительных проблем с производительностью, если это то, о чем вы беспокоитесь... До вас, чтобы определить шаблоны файлов, которые вам понадобятся.
Вопрос 4 & 5
что делает test-main.js действительно делает; для чего это?
какие файлы мне нужно включить в test-main.файл js?
цель test-main.js
файл должен найти и загрузить тестовые файлы перед запуском Karma. Он соединяет точки между кармой и requireJS
вы должны выбрать соглашение, чтобы назвать тестовые файлы, а затем определить TEST_REGEXP
чтобы соответствовать всем из них.
"официальной" руководство по угловому стилю и лучшие практики для структуры приложения рекомендует использовать суффикс *_test.js
.
EDIT: ваш regexp не работает, потому что он определен для catch "spec.js" || "test.js"
в конце или ваше имя файла спецификации заканчивается на "file.js"
;) пожалуйста, смотрите http://regex101.com/r/bE9tV9/1
еще одна вещь
я надеюсь, я был достаточно ясен. Вы можете взглянуть на нашу структуру стартового приложения для наших проектов с помощью Angular + Require:угловой-requirejs-готов. Он уже настроен и протестирован как с кармой, так и с транспортиром.