关键词:
【中文标题】如何使用 karma 在我的 Aurelia 应用程序中获得代码覆盖率结果?【英文标题】:How can I get code coverage results in my Aurelia app using karma? 【发布时间】:2017-03-02 23:39:48 【问题描述】:我使用 Aurelia CLI (au new
) 创建了一个 Aurelia 应用程序,并希望设置代码覆盖率(最好使用 karma-coverage,但如果这不可能,我将使用任何方法) .
我首先npm install karma-coverage --save-dev
然后将test.js
任务复制到cover.js
(这样我就可以运行au cover
)。
cover.js
import Server as Karma from 'karma';
import CLIOptions from 'aurelia-cli';
// import project from "../aurelia.json";
export function cover(done)
new Karma(
// This is the same as what's in karma.conf.js after running
// Except I added the 'src\\**\\*.js' part
files: [
'scripts\\vendor-bundle.js',
pattern: 'test\\unit\\**\\*.js', included: false,
'test/aurelia-karma.js',
'scripts\\app-bundle.js',
'scripts\\materialize-bundle.js',
pattern: 'src\\**\\*.js', included: false
],
configFile: __dirname + '/../../karma.conf.js',
singleRun: !CLIOptions.hasFlag('watch'),
reporters: ['progress', 'coverage'],
//logLevel: 'debug',
preprocessors:
// [project.unitTestRunner.source]: [project.transpiler.id], // Is this actually needed? Nothing changes if I add or remove this...
'src/**/*.js': ['babel', 'coverage']
,
coverageReporter:
includeAllSources: true,
reporters: [
type: 'html', dir: 'coverage',
type: 'text'
]
, done).start();
export default cover;
这...把我带到某个地方?
但我不认为测试链接到单个 src 文件(而是链接到 app-bundle.js
)。
有没有办法在 src 文件级别(即不是捆绑级别)获得 Aurelia 应用程序的代码覆盖率?
其他感兴趣的文件
app.js
export class App
constructor()
this.message = 'Hello World!';
karma.conf.js
"use strict";
const path = require('path');
const project = require('./aurelia_project/aurelia.json');
let testSrc = [
pattern: project.unitTestRunner.source, included: false ,
'test/aurelia-karma.js'
];
let output = project.platform.output;
let appSrc = project.build.bundles.map(x => path.join(output, x.name));
let entryIndex = appSrc.indexOf(path.join(output, project.build.loader.configTarget));
let entryBundle = appSrc.splice(entryIndex, 1)[0];
let files = [entryBundle].concat(testSrc).concat(appSrc); console.log(files);
module.exports = function(config)
config.set(
basePath: '',
frameworks: [project.testFramework.id],
files: files,
exclude: [],
preprocessors:
[project.unitTestRunner.source]: [project.transpiler.id]
,
'babelPreprocessor': options: project.transpiler.options ,
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false,
// client.args must be a array of string.
// Leave 'aurelia-root', project.paths.root in this order so we can find
// the root of the aurelia project.
client:
args: ['aurelia-root', project.paths.root]
);
;
【问题讨论】:
【参考方案1】:@lebolo 这些是我必须做的调整才能让事情在这里工作:
aurelia_project/tasks/cover.js
在封面函数的开头包含一个供应商路径常量:
const VENDORS_PATH = __dirname + '/../../node_modules/';
使用 VENDORS_PATH 将我依赖的库包含在文件中:
files: [
pattern: VENDORS_PATH + 'moment/min/moment.min.js', included: false,
pattern: 'src/**/*.js', included: false,
pattern: 'test/unit/**/*.js', included: false,
'test/aurelia-karma-cover.js'
]
预处理器中包含的测试文件:
preprocessors:
'src/**/*.js': ['babel'],
'test/unit/**/*.js': ['babel']
test/unit/aurelia-karma-cover.js
在requirejs.load
函数中改变url的构建方式:
url = '/base/' + url;
=> url = ['/base', root, url].join('/');
增加了一个函数来配置 requirejs 路径并在 patchRequireJS()
调用之后调用它:
function configRequire()
var VENDORS_PATH = '../node_modules/';
requirejs.config(
paths:
'moment': VENDORS_PATH + 'moment/min/moment.min'
);
【讨论】:
【参考方案2】:我终于让它工作了,但它需要进行大量的底层修改 =\
首先我必须安装以下软件包
npm install karma-coverage --save-dev
npm install karma-requirejs --save-dev
npm install babel-plugin-istanbul --save-dev
aurelia_project/tasks/cover.js
这是基于test.js
。
requirejs
添加到frameworks
列表中(来自karma-requirejs 包)
添加单独的 src/test 文件(使用 included: false
)以及 test/aurelia-karma-cover.js
,它执行实际的 require
ing 测试文件。
将 aurelia-karma.js
修改为 aurelia-karma-cover.js
以不包含 /test/unit/setup.js
(这给我带来了 aurelia-browser-pal 依赖项的麻烦)
从 src 文件预处理中移除 "coverage"
(babel-plugin-istanbul 现在将处理代码检测 - 详情请参见末尾的语句)。
import Server as Karma from 'karma';
import CLIOptions from 'aurelia-cli';
import project from "../aurelia.json";
export function cover(done)
new Karma(
configFile: __dirname + '/../../karma.conf.js',
frameworks: [project.testFramework.id, 'requirejs'],
files: [
pattern: 'src\\**\\*.js', included: false,
pattern: 'test\\unit\\**\\*.js', included: false,
// This file actually loads the spec files via require - it's based on aurelia-karma.js
// but removes setup.js and its dependencies
'test/aurelia-karma-cover.js'
],
exclude: [
'src/environment.js',
'src/main.js',
'src/resources/index.js'
],
preprocessors:
'src/**/*.js': ['babel'],
,
reporters: ['progress', 'coverage'],
singleRun: !CLIOptions.hasFlag('watch'),
coverageReporter:
includeAllSources: true,
reporters: [
type: 'html', dir: 'coverage',
type: 'text'
]
, done).start();
export default cover;
test/unit/aurelia-karma-cover.js
只需将var allTestFiles = ['/base/test/unit/setup.js'];
更改为var allTestFiles = [];
即可避免aurelia-pal-browser 依赖错误。
aurelia_project/aurelia.json
如果使用 babel-plugin-istanbul,则将 "istanbul"
添加到 transpiler.options.plugins
列表中。
* 如果没有babel-plugin-istanbul
,代码覆盖率将作用于后转译代码,这会增加无法真正测试的样板。这使您可以达到 100% 的代码覆盖率;)
【讨论】:
你能得到更多的细节吗?我的测试根本没有执行。而且,你现在还用“au test”吗? @Sergiu,这就是所有细节。我现在使用au cover
。
您能否分享所有文件更改,我想我遗漏了一些东西,它没有按预期工作【参考方案3】:
从您的终端屏幕截图中,除了捆绑文件之外,您似乎还获得了个人文件 src/app.js
(12.5%)、src/environment.js
(0%) 和 src/main.js
(12.5%) 的覆盖率。它与您添加的额外行有关,包括src/
中的文件。
我怀疑如果你去你的覆盖目录并在浏览器中查看它,你会看到更详细的结果。
我不确定 Aurelia 应用程序的具体情况,但要获得单个文件覆盖率,您希望针对原始文件而不是捆绑版本运行测试,并且您希望原始文件的相同路径也是在预处理器中。
files: [
...
'src/**/*.js',
'path/to/tests/*.spec.js'
...
],
preprocessors:
'src/**/*.js': ['coverage']
这种模式(您已经完成)告诉 Karma 加载各个文件,并将它们包含在覆盖范围中。在这一点上,我不会费心加载捆绑的应用程序代码,因为您已经加载了所有原始内容。
还要确保按照它们可能捆绑的顺序加载它们,这样您就可以确保 Karma 可以首先初始化应用程序。
files: [
'src/app.js',
'src/environment.js',
'src/main.js'
]
如果您将名为 myTest.spec.js
的规范放在他们测试的文件旁边,您可以使用 src/!(*.spec).js
来确保您包含没有测试的应用程序代码。
【讨论】:
这让我开始朝着正确的方向前进,但是转译、requirejs 和 aurelia 通常使它比这复杂得多 =\ 不过我找到了一种方法,我会更新答案。如何在 Aurelia-Dragula 中设置容器特定选项?
】如何在Aurelia-Dragula中设置容器特定选项?【英文标题】:HowtosetcontainerspecificoptionsinAurelia-Dragula?【发布时间】:2019-07-0114:25:04【问题描述】:我在我的应用程序中使用Aurelia-Dragula(https://github.com/michaelmalonenz/aurelia-dragula),我想像... 查看详情
Aurelia 试图从 Select2 加载 HTML?
】Aurelia试图从Select2加载HTML?【英文标题】:AureliatryingtoloadHTMLfromSelect2?【发布时间】:2016-01-3120:39:45【问题描述】:所以我尝试在我的Aurelia应用程序中使用Select2。我使用jspminstallselect2安装了Select2,在我的app.html文件中我需要... 查看详情
在我的 JSPM 包上使用 JSPM 404 进行 Karma/Jasmine 单元测试
】在我的JSPM包上使用JSPM404进行Karma/Jasmine单元测试【英文标题】:Karma/JasmineunittestwithJSPM404onmyJSPMpackages【发布时间】:2016-08-0800:49:42【问题描述】:我试图让JSPM/Karma/Babel/Jasmine一起工作。但是运行karmastart时出现错误1504201617:34:02.... 查看详情
karma-remap-istanbul 正在源旁边生成覆盖 html
...时间】:2017-07-0621:03:07【问题描述】:我正在尝试为我的Aurelia(+webpack+TypeScript)网站设置单元测试。我的karma.conf.js看起来如下(类似于aurelia-navigation 查看详情
在 Aurelia/Typescript 应用程序中使用 noty
】在Aurelia/Typescript应用程序中使用noty【英文标题】:UsingnotyinAurelia/Typescriptapplication【发布时间】:2019-07-0116:05:42【问题描述】:我一直在尝试将NOTY与Aurelia/Typescript应用程序一起使用。使用NPM安装包并使用requireJS将其拉入应用程... 查看详情
aurelia插件路径错误(代码片段)
我使用jspm安装了aurelia-breadcrumbs。config.js文件有一个映射条目:"heruan/aurelia-breadcrumbs":"github:heruan/aurelia-breadcrumbs@0.2.6"config.js还有一个路径条目:"github:*":"jspm_packages/github/*"在我的项目jspm_packages/github/heruan目录下,有与aurelia-breadcru... 查看详情
是否可以在非水疗应用程序中使用 Aurelia?
】是否可以在非水疗应用程序中使用Aurelia?【英文标题】:IsitpossibletouseAureliainanon-spaapplication?【发布时间】:2017-04-2301:59:22【问题描述】:最近我一直在玩不同的框架和库,寻找真正适合我需要的东西。你看,我的工作主要涉... 查看详情
使用 Karma 测试 Angular 时选择性地模拟服务
】使用Karma测试Angular时选择性地模拟服务【英文标题】:SelectivelyMockServiceswhenTestingAngularwithKarma【发布时间】:2017-08-1506:10:32【问题描述】:虽然有很多关于在Karma中模拟单个Angular服务的问题,但我遇到了一个问题,即在测试我... 查看详情
捆绑我的 aurelia 应用程序后,我得到:没有 PLATFORM.Loader 错误
】捆绑我的aurelia应用程序后,我得到:没有PLATFORM.Loader错误【英文标题】:AfterbundlingmyaureliaappIgeta:NoPLATFORM.Loadererror【发布时间】:2017-06-0812:14:50【问题描述】:将一个简单的aurelia应用程序与jspmbundle-sfx捆绑后,我收到以下错误... 查看详情
Aurelia:使用 es6 导入电子 + 打字稿
】Aurelia:使用es6导入电子+打字稿【英文标题】:Aurelia:usinges6importforelectron+typescript【发布时间】:2016-09-1716:40:10【问题描述】:我有一个在电子中运行的aurelia应用程序。我的源文件是打字稿,我有环境typings用于电子和节点。因... 查看详情
如何使用 Karma (testacular) 测试 nodejs 后端代码
】如何使用Karma(testacular)测试nodejs后端代码【英文标题】:HowtotestnodejsbackendcodewithKarma(testacular)【发布时间】:2013-05-1516:03:45【问题描述】:如何设置Karma来运行我的后端单元测试(用Mocha编写)?如果我将我的后端测试脚本添加... 查看详情
Karma Istanbul 修复程序可与新版本的 Chrome 一起使用
】KarmaIstanbul修复程序可与新版本的Chrome一起使用【英文标题】:KarmaIstanbulfixtoworkwithnewversionofChrome【发布时间】:2019-07-1504:37:36【问题描述】:在我的AngularJs应用程序中,我使用Jasmine和Karma进行单元测试。最近,在chrome更新后(... 查看详情
使用 karma 和 jamis 进行 Angular 单元测试
】使用karma和jamis进行Angular单元测试【英文标题】:AngularUnitTestingwithkarmaandjamis【发布时间】:2019-07-0106:26:46【问题描述】:我已经设置了我的Angularjs应用程序,用于使用Karma和Jasmin进行单元测试。但是当我尝试使用karmastart运行... 查看详情
Aurelia 的 Oauth2 托管在 asp .net 核心中
】Aurelia的Oauth2托管在asp.net核心中【英文标题】:Oauth2forAureliahostedinasp.netcore【发布时间】:2018-04-0212:58:03【问题描述】:我的设置是:托管Aurelia应用程序的aspnet核心站点aspnet核心api我可以轻松配置托管asp核心站点以使用oauth2进... 查看详情
SPA (Aurelia) + ASP.NET Core WebAPI + Google 身份验证
】SPA(Aurelia)+ASP.NETCoreWebAPI+Google身份验证【英文标题】:SPA(Aurelia)+ASP.NETCoreWebAPI+GoogleAuthentication【发布时间】:2018-05-3015:52:58【问题描述】:我的SPA应用程序(使用Aurelia)调用我的ASP.NETCore2WebAPI。我需要使用GoogleOIDC提供商对用户... 查看详情
使用 karma 持续编译和运行我的咖啡脚本测试
...的咖啡文件更改时,我都希望运行测试。问题是我不知道如何使两者都发生。到目前为止,我发现了watc 查看详情
如何在 Angular 7 中使用 Karma/Jasmine 为 App_Initializer 编写单元测试用例
】如何在Angular7中使用Karma/Jasmine为App_Initializer编写单元测试用例【英文标题】:howtowriteunittestcasesforApp_InitializerusingKarma/Jasmineinangular7【发布时间】:2019-06-3002:41:22【问题描述】:我已经在我的app.module.ts文件中导入了APP_INITIALIZER... 查看详情
Karma 测试运行器 - 无法捕获 chrome
...chrome【发布时间】:2014-01-0422:40:56【问题描述】:我正在使用Yeoman生成一个AngularJS应用程序。运行gruntserve来预览我的应用程序工作正常,但是当我尝试使用grunttest运行测试时,我的控制台上出现以下错误:Running"karma:unit"(karma)tas... 查看详情