Sur*_*mma 12 javascript extjs jasmine extjs4 extjs5
我正在尝试在我的应用程序(Ext js 5)中实现jasmine进行单元测试.为此我创建了app-test文件.
Ext.require('Ext.app.Application');Ext.Loader.setConfig({enabled:true});
Ext.onReady(function() {
var Application = Ext.create('Ext.app.Application', {
name: 'epmct',
appFolder:'app',
launch: function() {
Ext.create('epmct.view.vpp.dashboard.VppDashboardMainPage');
}
});
});
当我通过specrunner.html(文件开始单元测试)运行应用程序时,我收到错误
Uncaught Error: [Ext.Loader] Some requested files failed to load.
我尝试使用Ext.Loader.setPath('epmct','app')设置路径; 仍然没有用.
请找到我的specrunner.html文件代码
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<title>Jasmine Spec Runner v2.3.2</title>
<link rel="shortcut icon" type="image/png" href="test/jasmine/jasmine_favicon.png">
<link rel="stylesheet" type="text/css" href="test/jasmine/jasmine.css">
<script type="text/javascript" src="test/jasmine/jasmine.js"></script>
<script type="text/javascript" src="test/jasmine/jasmine-html.js"></script>
<script type="text/javascript" src="test/jasmine/boot.js"></script>
<!-- include Ext Js files and Css... -->
<script src="ext/ext-all.js"></script>
<!-- include spec files here... -->
<script type="text/javascript" src="app-test.js"></script>
<script type="text/javascript" src="test/spec/DashboardSpec.js"></script>
</head>
<body>
</body>
</html>
我将使用Sencha Cmd 5. ,ExtJs 5指导您完成使用Sencha Cmd 5的工作测试的快速设置,并期望您只需8个步骤即可使用Sencha工作区.
首先使用创建一个新工作区Sencha Cmd.如果您已有工作区,则可以跳过此步骤.
sencha generate workspace \path\to\the\folder
使用创建新的ExtJs应用程序Sencha Cmd.
cd \path\to\the\workspace
sencha -sdk \path\to\the\sdk generate app Jasmine jasmine
然后app-test在app文件夹中创建一个新文件夹.
lib文件夹复制到app-test之前创建的文件夹中.index-test.html并将其放在您的app文件夹中:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Jasmine Test</title>
<link rel="shortcut icon" type="image/png" href="app-test/lib/jasmine-2.3.4/jasmine_favicon.png">
<link rel="stylesheet" href="app-test/lib/jasmine-2.3.4/jasmine.css">
<script src="app-test/lib/jasmine-2.3.4/jasmine.js"></script>
<script src="app-test/lib/jasmine-2.3.4/jasmine-html.js"></script>
<script src="app-test/lib/jasmine-2.3.4/boot.js"></script>
<!-- include source files here... -->
<script src="../ext/build/ext-all-debug.js"></script>
<!-- include spec files here... -->
<script src="app-test.js"></script>
</head>
<body>
<div id="test"></div>
</body>
</html>app-test.js并将其放在您的app文件夹中:Ext.Loader.setConfig({
enabled: true
});
Ext.application({
name: 'Jasmine',
extend: 'Jasmine.Application',
autoCreateViewport: false
});
describe('Jasmine.view.main.Main', function() {
//reusable scoped variable
var mainView = null;
// setup / teardown
beforeEach(function() {
// create a fresh main view for every test to avoid test pollution
mainView = Ext.create('Jasmine.view.main.Main'/*, {
renderTo : 'test' //see index-test.html to see where this is defined
}*/);
});
afterEach(function() {
// destroy the main view after every test so we don't pollute the environment
mainView.destroy();
});
it('should inherit from Ext.container.Container', function() {
expect(mainView.isXType('container')).toEqual(true);
});
it('should be configured as a border layout', function() {
expect(mainView.getLayout().type).toEqual('border');
});
});额外资源:
http ://www.ladysign-apps.com/developer/setup-jasmine-tdd-with-for-ext-js/
https://www.sencha.com/blog/automating-unit-tests/
https ://github.com/SenchaProSvcs/UnitTestDemo
http://docs.sencha.com/extjs/4.2.0/#!/guide/testing
http://docs.sencha.com/extjs/4.2.0/#!/guide/testing_controllers
https://jasmine.github.io/2.3/introduction.html
| 归档时间： |
|
| 查看次数： |
1153 次 |
| 最近记录： |