我一直在使用NodeJS和Mocha生成一些测试,我想找到一种方法将结果放入浏览器中。我知道Mocha使用'html'记者和mocha init <dir>
对此有所支持,但似乎两者似乎都不适合我(记者实际上在没有进行测试的情况下抛出错误)。
有人能给我一个通过Mocha运行测试并生成HTML报告的好例子吗?我想模仿的一个例子是visionmedia站点。此外,为了示例,我们会说我正在使用名为example.js
的测试文件。
预先感谢您提供任何帮助,令人惊讶的是,周围的例子很少。
答案 0 :(得分:14)
您尝试使用html
报告器,当您尝试在Node中使用它时会抛出:
$ mocha --reporter html > report.html
/usr/local/lib/node_modules/mocha/lib/reporters/html.js:194
, div = document.createElement('div')
^
ReferenceError: document is not defined
根据Mocha documentation(和relevant issue in Github),html
记者只能在浏览器中使用,即。在浏览器中测试客户端代码。
如果要为Node.js测试脚本输出HTML,请使用doc
reporter,这将生成HTML。
答案 1 :(得分:7)
要让Mocha在浏览器和终端中运行测试,请按照以下小教程进行操作:
我假设一个普通的node.js mocha测试套件有以下插件。
以下树形结构:
/root
/test
my_something_spec.js
/javascript
index.html
免责声明:我公然放弃了各种最佳做法,只是为了指出正确的方向。
<html>
<head>
<meta charset="utf-8">
<title>Mocha Tests</title>
<link rel="stylesheet" href="node_modules/mocha/mocha.css" />
</head>
<body>
<div id="mocha"></div>
<script src="node_modules/mocha/mocha.js"></script>
<script>mocha.setup('bdd')</script>
<script src="test/my_something_spec.js"></script>
<script>
mocha.checkLeaks();
mocha.run();
</script>
</body>
</html>
describe("my function", function() {
it("is a function", function() {
expect(true).to.be(true);
});
});
使用来自root的简单python服务器python -m SimpleHTTPServer 8080
提供服务并访问localhost:8080
将为您提供一个很好的失败测试。
从终端运行mocha将为您提供相同的输出,expect
未定义。
答案 2 :(得分:1)
我喜欢在浏览器中通过Node.js 和测试相同的代码,具体取决于具体情况。我知道你要求将结果放到浏览器中#34; (来自Node.js?),但我希望这就足够了。
此示例是在Windows机器上创建的,但它也适用于Mac和Linux。
你不需要网络服务器(Node.js或其他)来实现这一点。
要在浏览器中运行测试,请打开./test/index.html文件。
要在命令行中运行测试,只需执行&#34; mocha&#34;。
从无到有:
C:\TEMP>mkdir mocha_node_browser
C:\TEMP>cd mocha_node_browser
C:\TEMP\mocha_node_browser>dir
Volume in drive C is MessedUp
Volume Serial Number is CAB2-E609
Directory of C:\TEMP\mocha_node_browser
2014-08-09 12:17 <DIR> .
2014-08-09 12:17 <DIR> ..
0 File(s) 0 bytes
2 Dir(s) 287,218,769,920 bytes free
初始化将保存所有测试的目录。总是把它叫做&#34;测试&#34;:
C:\TEMP\mocha_node_browser>mocha init test
编辑和/或创建一些文件:
C:\TEMP\mocha_node_browser>gvim -p test_me.js test\index.html test\tests.js
我用柴。两个测试中将使用相同的chai.js文件。
C:\TEMP\mocha_node_browser>cd test
C:\TEMP\mocha_node_browser\test>curl -O http://chaijs.com/chai.js
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 117k 100 117k 0 0 99902 0 0:00:01 0:00:01 --:--:-- 99902
C:\TEMP\mocha_node_browser\test>cd ..
创建/编辑文件后,通过命令行运行测试:
C:\TEMP\mocha_node_browser>mocha
.
1 passing (15ms)
...或将您的浏览器指向./test/index.html。
passes: 1
failures: 0
duration: 0.03s
whatever
should return "it worked!"
文件内容:
C:\TEMP\mocha_node_browser>type test_me.js
// the function to be tested
function whatever() {
return 'it worked!';
}
// only kicks in when running in Node.js via "mocha"
if (typeof module !== 'undefined') {
module.exports = whatever;
}
将Chai和您要测试的源添加到test / index.html:
C:\TEMP\mocha_node_browser>type test\index.html
<!DOCTYPE html>
<html>
<head>
<title>Mocha</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="mocha.css" />
</head>
<body>
<div id="mocha"></div>
<script src="mocha.js"></script>
<script>mocha.setup('bdd')</script>
<!-- added to index.html: -->
<script src="./chai.js"></script>
<script src="../test_me.js"></script>
<script src="tests.js"></script>
<script>
mocha.run();
</script>
</body>
</html>
使您的测试与命令行和浏览器兼容
C:\TEMP\mocha_node_browser>type test\tests.js
if (typeof require !== 'undefined') {
// testing in command-line
var chai = require('./chai');
var whatever = require('../test_me');
}
var expect = chai.expect;
describe('whatever', function() {
it('should return "it worked!"', function() {
expect(whatever()).to.equal("it worked!");
});
});