README
karma-extjs
Test Ext JS applications with Karma and any of the available frameworks and plugins. This package provides a Karma plugin for Ext JS applications, versions three to the latest, that starts test execution when the application is launched or as configured. It also pre-configures files and proxies for resource types and directories common in the Ext JS framework.
Prerequisites
Install Karma and any required dependencies in Ext JS application directory. See the Karma installation documentation.
npm install karma --save-dev
Installation
Due to a conflict, the npm package name is karma-extjs-6.
npm install karma-extjs-6 --save-dev
Configuration
See the test application in the test directory for an example.
Integration Testing
See the Karma configuration documentation to create a configuration for Karma, and include extjs-6 as a framework. By default, test execution will automatically start when the application launches.
Ext JS 4 - Latest
When using the Microloader, the manifest and scripts should not be embedded in the index.html file.
- If the application defines an Ext.app.Application.launch method, ensure it calls its parent.
- Copy the before load manifest configuration into a script file (e.g. app/extras/manifest.js).
- The manifest is not embedded by default. If the manifest is embedded, set the embed configuration to false in the app.json file.
- Set the microloader embed configuration to false in the app.json file.
"output": {
"microloader": {
"embed": false
}
}
- When testing a production build, set production to true.
- Configure file patterns for all of the application, build, and package resources.
- Configure a proxy for the toolkit manifest.
- Configure proxies for the application source directories.
- Configure browserNoActivityTimeout to account for the amount of time the application takes to load. Larger applications and development builds require more time.
module.exports = function (config) {
config.set({
...
frameworks: ['jasmine', 'extjs-6'],
...
files: [
...
'app/extras/manifest.js',
'{build,classic,packages}/**/*.css'
],
...
extJs: {
production: true
},
...
proxies: {
'/classic/', '/base/classic/',
'/classic.json': '/base/classic.json'
},
...
browserNoActivityTimeout: 20000
});
};
Ext JS 3
Test Ext JS 3 applications with the onReady option. Test execution will start when the document and framework are ready.
module.exports = function (config) {
config.set({
...
frameworks: ['jasmine', 'extjs-6'],
...
extJs: {
onReady: true
}
});
};
Custom
To start test execution at a distinct time disable autoStart, and call karma.loaded.
module.exports = function (config) {
config.set({
...
frameworks: ['jasmine', 'extjs-6'],
...
extJs: {
autoStart: false
}
...
});
};
...
afterRenderHandler: function (viewport, eOpts) {
if (window.karma) {
window.karma.loaded();
}
},
...
Unit Testing
Microloader
The Microloader can be also be used for unit testing. The application can be disabled to prevent conflicts between instances of a class. Classes can be loaded using Ext.require.
- Follow the steps for configuring Karma for integration testing.
- Set autoLaunch to false.
- Set onReady to true.
extJs: {
autoLaunch: false,
onReady: true
}
describe('Fiddle.mixin.Test', {
beforeAll(function (done) {
Ext.require('Fiddle.mixin.Test', function () {
done();
});
});
it('is defined', function () {
expect(Fiddle.mixin.Test).toBeDefined();
});
...
Usage
Start Karma as normal.
Options
autoStart
Type: Boolean Default: True
Specify true to start test execution automatically.
autoLaunch
Type: Boolean Default: True
Specify true to allow the application to launch automatically.
microloader
Type: Boolean/Object Default: True
Specify true or an object to use the Microloader (microloader.js).
microloader.embedded
Type: Boolean Default: False
Specify true if the microloader is embedded. Embedding the microloader is not recommended.
microloader.split
Type: Boolean Default: False
Specify true if the framework is split from the application (framework.js).
onReady
Type: Boolean Default: False
Specify true to start test execution when the document and framework are ready. See the documentation for Ext.onReady.
production
Type: Boolean Default: False
Specify true when testing the production environment.
License
This project is license under the ISC License (ISC). See the LICENSE file.
Authors
- Trevor Karjanis