在使用grunt的静态服务器上运行Qunit测试时遇到问题 [英] Trouble running Qunit tests with static server using grunt
本文介绍了在使用grunt的静态服务器上运行Qunit测试时遇到问题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
grunt tests 失败， $ grunt tests
运行 jsonlint：sample（jsonlint）任务
>> 4档无绒。
运行jshint：all（jshint）任务
>> 4档无绒。
运行connect：server（连接）任务
开始连接http：// localhost：5000
上的web服务器运行qunit：all（qunit ）任务
测试http：// localhost：5000 / tests / tests.html F
>> Settings.json测试 - 获取设置文件
>>消息：InvalidStateError：DOM异常11：尝试使用不可用或不再可用的对象。
>> Actual：null
>>预计：undefined
>> http：// localhost：5000 / tests / tests.js：7
>> Settings.json测试 - 获取设置文件
>>消息：检查设置JSON文件
>> http：// localhost：5000 / tests / tests.js：25：24
>> onreadystatechange @ http：// localhost：5000 / tests / tests.js：8：25
>> Settings.json测试 - 获取设置文件
>>消息：在最终的`assert.async`解决之后的断言
>> Actual：null
>>预计：undefined
>> notEqual @ http：// localhost：5000 / tests / qunit / qunit-1.22.0.js：1512：18
>> http：// localhost：5000 / tests / tests.js：25：24
>> onreadystatechange @ http：// localhost：5000 / tests / tests.js：8：25
>> Settings.json测试 - 获取设置文件
>>消息：检查设置JSON文件
>> http：// localhost：5000 / tests / tests.js：25：24
>> onreadystatechange @ http：// localhost：5000 / tests / tests.js：8：25
>> Settings.json测试 - 获取设置文件
>>消息：对`assert.async`回调的调用太多
>> Actual：null
>>预计：undefined
>> http：// localhost：5000 / tests / tests.js：26：13
>> onreadystatechange @ http：// localhost：5000 / tests / tests.js：8：25
>> Settings.json测试 - 获取设置文件
>>消息：在最终的`assert.async`解决之后的断言
>> Actual：null
>>预计：undefined
>> notEqual @ http：// localhost：5000 / tests / qunit / qunit-1.22.0.js：1512：18
>> http：// localhost：5000 / tests / tests.js：25：24
>> onreadystatechange @ http：// localhost：5000 / tests / tests.js：8：25
>> Settings.json测试 - 获取设置文件
>>消息：检查设置JSON文件
>> http：// localhost：5000 / tests / tests.js：25：24
>> onreadystatechange @ http：// localhost：5000 / tests / tests.js：8：25
>> Settings.json测试 - 获取设置
>>消息：对`assert.async`回调的调用太多
>> Actual：null
>>预计：undefined
>> http：// localhost：5000 / tests / tests.js：26：13
>> onreadystatechange @ http：// localhost：5000 / tests / tests.js：8：25
警告：8/8断言失败（54ms）使用--force继续。
由于警告而中止。
Gruntfile.js
module.exports = function（grunt）{
grunt.initConfig（{
jsonlint：{
sample：{
src：['json / *。 json'，'api_files / *。json']，
选项：{
格式：'散文'
}
}
}，
jshint： {
all：['* .js'，'tests / *。js'，'server / *。js']
}，
connect：{
server：{
选项：{
port：5000，
base：'。'
}
}
}，
qunit：{
全部：{
选项：{
网址：[
'http：// localhost：5000 / tests / tests.html'
]
}
}
}
}）;
grunt.loadNpmTasks（'grunt-jsonlint'）;
grunt.loadNpmTasks（'grunt-contrib-jshint'）;
grunt.loadNpmTasks（'grunt-contrib-connect'）;
grunt.loadNpmTasks（'grunt-contrib-qunit'）;
grunt.registerTask（'tests'，['jsonlint'，'jshint'，'connect'，'qunit']）;
};
tests.html
<！DOCTYPE html>
< html>
< head>
< meta charset =utf-8>
< meta name =viewportcontent =width = device-width>
< title>后端测试< / title>
< link rel =stylesheethref =qunit / qunit-1.22.0.css>
< script src =qunit / qunit-1.22.0.js>< / script>
< / head>
< body>
< div id =qunit>< / div>
< div id =qunit-fixture>< / div>
< script src =tests.js>< / script>
< / body>
< / html>
tests.js
var HttpClient = function（）{
this.get = function（requestUrl，callback）{
var anHttpRequest = new XMLHttpRequest（）;
anHttpRequest.onreadystatechange = function（）{
if（anHttpRequest.readyState == 4&& anHttpRequest.status == 200）{
callback（anHttpRequest.responseText）;
} else if（anHttpRequest.status == 404）{
callback（null）;
}
};
anHttpRequest.open（GET，requestUrl，true）;
anHttpRequest.send（null）;
};
};
var rootUrl =http：// localhost：5000;
var client = new HttpClient（）;
QUnit.module（Fetching settings.json）;
$ b QUnit.test（'Fetching settings file'，function（assert）{
var done = assert.async（）;
client.get（rootUrl +'/ api /设置'，函数（响应）{
assert.notEqual（response，null，'Check settings JSON file'）;
done（）;
}）;
}）;
main.js
函数serveStaticFiles（router）{
var app = express（）;
app.use（'/ api'，router）; //我们所有的路线都会以/ api
作为前缀app.use（'/'，express.static（__ dirname +'/'））; //使html文件可以从img
app.use（express.static（'./ html'））获取图像。 //文件夹'html'现在被认为是公共和可访问的
app.use（express.static（'./ xml'））; //文件夹'xml'现在被认为是公共和可访问的
app.use（express.static（'./ img'））; //文件夹'img'现在被认为是公共和可访问的
app.use（express.static（'./ json'））; //文件夹'json'现在被认为是公共和可访问的
app.use（express.static（'./ tests'））; //文件夹'tests'现在被认为是公共的并且可访问
return app;
}
var bugsnag = require（bugsnag）;
bugsnag.register（process.env.BUGSNAG_API_KEY）;
bugsnag.releaseStage = process.env.BUGSNAG_RELEASE_STAGE;
bugsnag.notifyReleaseStages = [stage，production];
var express = require（'express'）;
var router = express.Router（）;
var app = serveStaticFiles（router）;
var port = process.env.PORT || 5000;
var server = app.listen（port）;
var apiHandler = require（./ server / ApiHandler）;
console.log（创建的应用程序，它监听端口+端口）;
apiHandler.initRestApi（router）;
解决方案
您需要将Node服务器作为另一个运行步入你的咕噜声过程。特别要运行Express服务器，我建议从那里开始。这是grunt配置的样子：
grunt.initConfig（{
// ...
表示：{//这是新的任务...
dev：{
options：{
script：'path / to / main.js'
}
}，
connect：{
服务器：{
options：{
port：3000，//我改变了它，所以它不会发生冲突您的快递应用程序
base：'。'
}
}
}，
qunit：{
全部：{
options：{
url：[
'http：// localhost：3000 / tests / tests.html'//改变了这个以及
]
}
}
}
}）;
然后，您需要将所有三项任务作为测试运行。您可以创建一个别名，如下所示：
grunt.registerTask（'tests'，['jsonlint'，'jshint'，'express'， 'connect'，'qunit']）;
Running the tests via a web browser works fine, but using grunt gives me errors. I struggle to understand what I'm doing wrong here. grunt tests fails with
$ grunt tests
Running "jsonlint:sample" (jsonlint) task
>> 4 files lint free.
Running "jshint:all" (jshint) task
>> 4 files lint free.
Running "connect:server" (connect) task
Started connect web server on http://localhost:5000
Running "qunit:all" (qunit) task
Testing http://localhost:5000/tests/tests.html F
>> Settings.json tests - Fetching settings file
>> Message: InvalidStateError: DOM Exception 11: An attempt was made to use an object that is not, or is no longer, usable.
>> Actual: null
>> Expected: undefined
>> http://localhost:5000/tests/tests.js:7
>> Settings.json tests - Fetching settings file
>> Message: Check settings JSON file
>> http://localhost:5000/tests/tests.js:25:24
>> onreadystatechange@http://localhost:5000/tests/tests.js:8:25
>> Settings.json tests - Fetching settings file
>> Message: Assertion after the final `assert.async` was resolved
>> Actual: null
>> Expected: undefined
>> notEqual@http://localhost:5000/tests/qunit/qunit-1.22.0.js:1512:18
>> http://localhost:5000/tests/tests.js:25:24
>> onreadystatechange@http://localhost:5000/tests/tests.js:8:25
>> Settings.json tests - Fetching settings file
>> Message: Check settings JSON file
>> http://localhost:5000/tests/tests.js:25:24
>> onreadystatechange@http://localhost:5000/tests/tests.js:8:25
>> Settings.json tests - Fetching settings file
>> Message: Too many calls to the `assert.async` callback
>> Actual: null
>> Expected: undefined
>> http://localhost:5000/tests/tests.js:26:13
>> onreadystatechange@http://localhost:5000/tests/tests.js:8:25
>> Settings.json tests - Fetching settings file
>> Message: Assertion after the final `assert.async` was resolved
>> Actual: null
>> Expected: undefined
>> notEqual@http://localhost:5000/tests/qunit/qunit-1.22.0.js:1512:18
>> http://localhost:5000/tests/tests.js:25:24
>> onreadystatechange@http://localhost:5000/tests/tests.js:8:25
>> Settings.json tests - Fetching settings file
>> Message: Check settings JSON file
>> http://localhost:5000/tests/tests.js:25:24
>> onreadystatechange@http://localhost:5000/tests/tests.js:8:25
>> Settings.json tests - Fetching settings
>> Message: Too many calls to the `assert.async` callback
>> Actual: null
>> Expected: undefined
>> http://localhost:5000/tests/tests.js:26:13
>> onreadystatechange@http://localhost:5000/tests/tests.js:8:25
Warning: 8/8 assertions failed (54ms) Use --force to continue.
Aborted due to warnings.
Gruntfile.js
module.exports = function(grunt) {
grunt.initConfig({
jsonlint: {
sample: {
src: ['json/*.json', 'api_files/*.json'],
options: {
formatter: 'prose'
}
}
},
jshint: {
all: ['*.js', 'tests/*.js', 'server/*.js']
},
connect: {
server: {
options: {
port: 5000,
base: '.'
}
}
},
qunit: {
all: {
options: {
urls: [
'http://localhost:5000/tests/tests.html'
]
}
}
}
});
grunt.loadNpmTasks('grunt-jsonlint');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-connect');
grunt.loadNpmTasks('grunt-contrib-qunit');
grunt.registerTask('tests', ['jsonlint', 'jshint', 'connect', 'qunit']);
};
tests.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Backend Tests</title>
<link rel="stylesheet" href="qunit/qunit-1.22.0.css">
<script src="qunit/qunit-1.22.0.js"></script>
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<script src="tests.js"></script>
</body>
</html>
tests.js
var HttpClient = function () {
this.get = function (requestUrl, callback) {
var anHttpRequest = new XMLHttpRequest();
anHttpRequest.onreadystatechange = function () {
if (anHttpRequest.readyState == 4 && anHttpRequest.status == 200) {
callback(anHttpRequest.responseText);
} else if (anHttpRequest.status == 404) {
callback(null);
}
};
anHttpRequest.open("GET", requestUrl, true);
anHttpRequest.send(null);
};
};
var rootUrl = "http://localhost:5000";
var client = new HttpClient();
QUnit.module("Fetching settings.json");
QUnit.test('Fetching settings file', function (assert) {
var done = assert.async();
client.get(rootUrl + '/api/settings', function (response) {
assert.notEqual(response, null, 'Check settings JSON file');
done();
});
});
main.js
function serveStaticFiles(router) {
var app = express();
app.use('/api', router); // all of our routes will be prefixed with /api
app.use('/', express.static(__dirname + '/')); // Makes it possible for html files to fetch images from img
app.use(express.static('./html')); // folder 'html' is now considered public and accessible
app.use(express.static('./xml')); // folder 'xml' is now considered public and accessible
app.use(express.static('./img')); // folder 'img' is now considered public and accessible
app.use(express.static('./json')); // folder 'json' is now considered public and accessible
app.use(express.static('./tests')); // folder 'tests' is now considered public and accessible
return app;
}
var bugsnag = require("bugsnag");
bugsnag.register(process.env.BUGSNAG_API_KEY);
bugsnag.releaseStage = process.env.BUGSNAG_RELEASE_STAGE;
bugsnag.notifyReleaseStages = ["stage", "production"];
var express = require('express');
var router = express.Router();
var app = serveStaticFiles(router);
var port = process.env.PORT || 5000;
var server = app.listen(port);
var apiHandler = require("./server/ApiHandler");
console.log("Application created and it listens on port " + port);
apiHandler.initRestApi(router);
解决方案
You'll need to run your Node server as another step in your grunt process. There is a grunt task for specifically running Express servers, I'd recommend starting there. Here's what the grunt config might look like:
grunt.initConfig({
// ...
express: { // this is the new task...
dev: {
options: {
script: 'path/to/main.js'
}
}
},
connect: {
server: {
options: {
port: 3000, // I changed this so it doesn't conflict with your express app
base: '.'
}
}
},
qunit: {
all: {
options: {
urls: [
'http://localhost:3000/tests/tests.html' // changed this as well
]
}
}
}
});
Then you'll want to run all three tasks as your "test" run. You can create an alias like so:
grunt.registerTask('tests', ['jsonlint', 'jshint', 'express', 'connect', 'qunit']);
这篇关于在使用grunt的静态服务器上运行Qunit测试时遇到问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
