我正在尝试使用 requirejs 和 grunt-contrib-qunit 设置 QUnit 环境。
这是我的。
咕噜文件:
qunit: {
all: {
options: {
urls: [
'http://localhost:8000/qunit/qunit-test-suite.html'
]
}
}
},
connect: {
server: {
options: {
port: 8000,
base: '.'
}
}
},
qunit-test-suite.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>QUnit Tests Suite: travis CI Test</title>
<link rel="stylesheet" href="../components/libs/qunit/qunit/qunit.css">
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<script src="../components/libs/qunit/qunit/qunit.js"></script>
<script>
QUnit.config.autoload = false;
QUnit.config.autostart = false;
</script>
<script data-main="qunit" src="../components/libs/requirejs/require.js"></script>
</body>
</html>
qunit.js:
require.config({
baseUrl: "../",
paths: {
'jquery': 'components/libs/jquery/dist/jquery.min',
// Test for Foo
'foo': 'components/app/foo/foo',
'test-Foo': 'components/app/foo/test-Foo'
},
shim: {
'QUnit': {
exports: 'QUnit',
init: function() {
QUnit.config.autoload = false;
QUnit.config.autostart = false;
}
}
}
});
require(['test-Foo'], function (Foo) {
QUnit.load();
QUnit.start();
});
测试-Foo.js:
define(['foo'], function(Foo) {
'use strict';
module("Foo");
test("Foo return Test", function() {
equal(Foo.foo(), "foo", "Function should return 'foo'");
equal(Foo.oof(), "oof", "Function should return 'oof'");
});
test("Bar return Test", function() {
equal(Foo.bar(), "barz", "Function should return 'bar'");
});
});
问题是当我在浏览器中打开 test-suite.html 时一切正常。发送到 PhantomJS 后,我收到以下错误:
Running "connect:server" (connect) task
Started connect web server on http://localhost:8000
Running "qunit:all" (qunit) task
Testing http://localhost:8000/qunit/qunit-test-suite.html
>> PhantomJS timed out, possibly due to a missing QUnit start() call.
Warning: 1/1 assertions failed (0ms) Use --force to continue.
Aborted due to warnings.
完整设置:https://github.com/markusfalk/test-travis
测试运行:https://travis-ci.org/markusfalk/test-travis
感谢您的帮助:)
最佳答案
在Jörn的帮助下我想出了一个工作设置。技巧是在 QUnit 加载之前设置 requireJS(将 requireJS 配置移动到 config.js 并首先加载它)。
要求:
HTML 测试套件:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>QUnit Tests Suite: asdf</title>
<link rel="stylesheet" href="../components/libs/qunit/qunit/qunit.css">
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<script src="config.js"></script>
<script data-main="unit" src="../components/libs/requirejs/require.js"></script>
</body>
</html>
配置.js
var requirejs = {
baseUrl: "../",
paths: {
//{{app}}
'foo': 'components/app/foo/foo',
'test-foo': 'components/app/foo/test-foo',
//{{libs}}
'unit': 'qunit/unit',
'qunit': 'components/libs/qunit/qunit/qunit',
'jquery.exists': 'libs/jquery.exists/jquery.exists',
'jquery': 'components/libs/jquery/dist/jquery.min'
},
'shim': {
'jquery.exists': ['jquery']
}
};
单元.js
require([
'qunit',
'test-foo'
],
function(qunit, TestFoo) {
TestFoo();
qunit.start();
});
test-foo.js:
define(['jquery', 'qunit', 'foo'], function($, qunit, Foo) {
'use strict';
return function() {
qunit.module("Foo");
qunit.test("Foo Test", function() {
equal(Foo.saySomething(), "Hello", "returns 'Hello'");
});
};
});
最后是我要测试的模块:
define(['jquery'], function($) {
'use strict';
var Foo = {
saySomething: function() {
return "Hello";
}
};
return {
saySomething: Foo.saySomething
};
});
关于javascript - 如何为 requirejs 和 qunit 设置 grunt 任务,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29435486/
AngularCLI创建vendor.js我不知道为什么以及它有什么用??对于新应用,此文件的大小约为3.2MB!!此文件是否包含Angular6Javascript源?您不认为这是在低速连接上加载到Internet上的大文件吗? 最佳答案 此文件包含您添加到项目中的所有库。如果您在生产模式下构建应用,文件大小会更小。ngbuild--prod 关于javascript-如何减小Angular2、4、6、7、8、9、10中vendor.js的大小?,我们在StackOverflow上找到
我在theofficialtutorial之后在我的NestJS应用中启用了CORS,所以我的main.ts看起来像下面这样:import{FastifyAdapter,NestFactory}from'@nestjs/core';import{AppModule}from'./app.module';asyncfunctionbootstrap(){constapp=awaitNestFactory.create(AppModule,newFastifyAdapter(),{cors:true});awaitapp.listen(3000);}boot
您好,我是JavaScript的初学者,我想问一下是否可以session我从服务器获取的数据。我想要session的数据是我在网上搜索到的“data.xhr.response”,大多数人都使用SessionStorage函数,但我不确定如何处理它,我们将不胜感激。$(function(){Dropzone.autoDiscover=false;$('#file-upload').dropzone({maxFiles:1,acceptedFiles:".pdf,.doc,.docx,.html",dataType:"json",succes
stackoverflow中有很多关于此的内容,但似乎没有一个适合我的情况。我有一个输入文本字段,我想模拟按键事件来填充文本字段。原因:我在不提供API的网络界面上自动执行大量数据输入任务。使用.value更改输入字段不会触发界面的JS端(Angular)。这就是为什么我要模拟按键事件。首先我尝试了这个:varinp=document.getElementById('rule-type');inp.dispatchEvent(newKeyboardEvent('keypress',{'key':'a'}));然后我了解到在
我正在使用SweetAlert2examplespage的确切代码:swal({title:'Areyousure?',text:"Youwon'tbeabletorevertthis!",type:'warning',showCancelButton:true,confirmButtonColor:'#3085d6',cancelButtonColor:'#d33',confirmButtonText:'Yes,deleteit!'}).then((result)=>{if(
我无法使用以下说明生成OpenCV.js:https://docs.opencv.org/master/d4/da1/tutorial_js_setup.html我有这个错误:CMakeError:CMakewasunabletofindabuildprogramcorrespondingto"UnixMakefiles".CMAKE_MAKE_PROGRAMisnotset.Youprobablyneedtoselectadifferentbuildtool.当我尝试执行时:python./platforms/js/build_js.pybuild_js好的,伙计们!
我是Vue新手。我正在尝试开发一个聊天应用程序,其中好友列表将显示在左侧菜单上,聊天框将显示在正文中。我正在使用ajax调用加载好友列表,并根据好友ID路由到聊天框。这是代码示例。<divclass="chat-containerclearfix"id="chat"><divclass="people-list"id="people-list"><chatlist-component></chatlist-component></div><divclass=
我使用的是angular5.1.0,路由系统有问题,让我解释一下:在我的应用程序路由模块中,我有一个url/api那个延迟加载另一个模块,在那个延迟加载的模块中我有下一个路由实现:api-routing.module.tsconstroutes:Routes=[{path:'',component:ApisComponent,data:{breadcrumbs:'APIs',},children:[{path:'',component:ApiListComponent,},{path:':id',component:Api
我们正在使用VisualStudio2017并且有两个独立的Web项目,它们应该共享一些用TypeScript编写的React组件。还可以共享JavaScript文件和CSS文件。为此,我们在VisualStudio中创建了一个共享项目。WhatisthedifferencebetweenaSharedProjectandaClassLibraryinVisualStudio2015?目前该项目只有一个包含此信息的文件。exportconstTypes={Type1:'1',Type2:'2',Type3:'3'}为了测试,我可以像这样引
点击spanclass="before-click"时,我想隐藏它,而是显示inputclass="after-click"。并且出现的输入标签必须是焦点!问题是当我尝试使用$refs.afterClick访问那个DOM并给它.focus()时,一个意外错误显示.focus()不是一个函数。如何解决这个问题?谢谢。varmyApp=newVue({el:'#app',data:{onEdit:false,msg:'Somethinginhere',},methods:{switchAndFocus(){if(!this.onEdit){this.onEd
AngularCLI创建vendor.js我不知道为什么以及它有什么用??对于新应用,此文件的大小约为3.2MB!!此文件是否包含Angular6Javascript源?您不认为这是在低速连接上加载到Internet上的大文件吗? 最佳答案 此文件包含您添加到项目中的所有库。如果您在生产模式下构建应用,文件大小会更小。ngbuild--prod 关于javascript-如何减小Angular2、4、6、7、8、9、10中vendor.js的大小?,我们在StackOverflow上找到
我在theofficialtutorial之后在我的NestJS应用中启用了CORS,所以我的main.ts看起来像下面这样:import{FastifyAdapter,NestFactory}from'@nestjs/core';import{AppModule}from'./app.module';asyncfunctionbootstrap(){constapp=awaitNestFactory.create(AppModule,newFastifyAdapter(),{cors:true});awaitapp.listen(3000);}boot
您好,我是JavaScript的初学者,我想问一下是否可以session我从服务器获取的数据。我想要session的数据是我在网上搜索到的“data.xhr.response”,大多数人都使用SessionStorage函数,但我不确定如何处理它,我们将不胜感激。$(function(){Dropzone.autoDiscover=false;$('#file-upload').dropzone({maxFiles:1,acceptedFiles:".pdf,.doc,.docx,.html",dataType:"json",succes
stackoverflow中有很多关于此的内容,但似乎没有一个适合我的情况。我有一个输入文本字段,我想模拟按键事件来填充文本字段。原因:我在不提供API的网络界面上自动执行大量数据输入任务。使用.value更改输入字段不会触发界面的JS端(Angular)。这就是为什么我要模拟按键事件。首先我尝试了这个:varinp=document.getElementById('rule-type');inp.dispatchEvent(newKeyboardEvent('keypress',{'key':'a'}));然后我了解到在
我正在使用SweetAlert2examplespage的确切代码:swal({title:'Areyousure?',text:"Youwon'tbeabletorevertthis!",type:'warning',showCancelButton:true,confirmButtonColor:'#3085d6',cancelButtonColor:'#d33',confirmButtonText:'Yes,deleteit!'}).then((result)=>{if(
我无法使用以下说明生成OpenCV.js:https://docs.opencv.org/master/d4/da1/tutorial_js_setup.html我有这个错误:CMakeError:CMakewasunabletofindabuildprogramcorrespondingto"UnixMakefiles".CMAKE_MAKE_PROGRAMisnotset.Youprobablyneedtoselectadifferentbuildtool.当我尝试执行时:python./platforms/js/build_js.pybuild_js好的,伙计们!
我是Vue新手。我正在尝试开发一个聊天应用程序,其中好友列表将显示在左侧菜单上,聊天框将显示在正文中。我正在使用ajax调用加载好友列表,并根据好友ID路由到聊天框。这是代码示例。<divclass="chat-containerclearfix"id="chat"><divclass="people-list"id="people-list"><chatlist-component></chatlist-component></div><divclass=
我使用的是angular5.1.0,路由系统有问题,让我解释一下:在我的应用程序路由模块中,我有一个url/api那个延迟加载另一个模块,在那个延迟加载的模块中我有下一个路由实现:api-routing.module.tsconstroutes:Routes=[{path:'',component:ApisComponent,data:{breadcrumbs:'APIs',},children:[{path:'',component:ApiListComponent,},{path:':id',component:Api
我们正在使用VisualStudio2017并且有两个独立的Web项目,它们应该共享一些用TypeScript编写的React组件。还可以共享JavaScript文件和CSS文件。为此,我们在VisualStudio中创建了一个共享项目。WhatisthedifferencebetweenaSharedProjectandaClassLibraryinVisualStudio2015?目前该项目只有一个包含此信息的文件。exportconstTypes={Type1:'1',Type2:'2',Type3:'3'}为了测试,我可以像这样引
点击spanclass="before-click"时,我想隐藏它,而是显示inputclass="after-click"。并且出现的输入标签必须是焦点!问题是当我尝试使用$refs.afterClick访问那个DOM并给它.focus()时,一个意外错误显示.focus()不是一个函数。如何解决这个问题?谢谢。varmyApp=newVue({el:'#app',data:{onEdit:false,msg:'Somethinginhere',},methods:{switchAndFocus(){if(!this.onEdit){this.onEd