SenchaCmd Apps are gaining much popularity among Ext JS development specialist. More Ext JS applications are being written with SenchaCmd libraries, generated with SenchaCmd (ExtJS and Sencha Touch). This combination is indeed proving to be very useful for web application development.
It is a cross platform command line tool by Sencha Touch. SenchaCmd avails with a feature that automates tasks for full life cycle development of web applications. It works for developing a new project or deploying web apps.
It is a tool that offers features which are robust, rich and time saving which work in tandem with Sencha Ext JS and Ext JS Sencha Touch frameworks.
As we understand this set of functions are new for the Ext JS developers and we have been getting queries on testing Ext JS applications with Sencha Cmd. So we thought of preparing a step by step guide to conduct testing of applications generated with Sencha Cmd.
See Also : 5 Best ExtJS Development Practices For Single Page Applications
Get started by installing the latest SenchaCmd version. Click here to download the latest version. https://www.sencha.com/products/extjs/cmd-download/ . You can also take the getting started guide by following this link: https://docs.sencha.com/extjs/6.2.0/guides/getting_started/getting_started.html
sencha -sdk /path/to/extjs/framework generate app NewAppNewApp
cd NewApp
sencha app watch
This will generate the files in the New App Folder in an organized fashion. You will see model, store and view folders along with app.js, this will bootstrap the application for further development process. Now, navigate the folder to the local host in your browser and then you will able to view the application in tabs with grid panel.
This step will finally commence the testing for you. Firstly, we will create a testing folder for the testing operations. Since the app is running now, you need to create the test folder in the root of the ‘NewApp’ Folder. Now, you need to inject the harness for testing. So include your harness HTML pages that contains the Ext JS applications files and a Harness JS file. This file shall contain the details of the testing process.
!DOCTYPE html> <html> <head> <link rel=”stylesheet” type=”text/css” href=”localhost/siesta/resources/css/siesta-all.css”> <script type=”text/javascript” src=”localhost/siesta/siesta-all.js”></script> <!—The test harness --> <script type=”text/javascript” src=”index.js”></script> </head> <body> </body> </html>
varHarness = Siesta.Harness.Browser.ExtJS;
Harness.configure({
Title :’Testing’
});
Harness.start(
{
Group :’Unit Tests’,
pageUrl : ‘../index.html?unittest’,
items :[
‘unite-tests/unite1.t.js’
]
},
{
Group ; ‘App Test’,
Items : [
]
},
{
); In order to conduct a unit test using Siesta, the testing team needs to ensure that the JS classes are injected into every test of the application. The good part is that instead of using ‘preload’, Ext JS 6 will use ‘pageUrl’ and then set it to root index.html page. Once you run the above mentioned test, the application will start but you don’t need it to start while the unit tests are running. So all you need to do is modify the app.js folder by adding an inline check for ‘unittest’ string the in query string.
Ext.define('NewApp.store.Personnel', {
extend: 'Ext.data.Store',
alias: 'store.personnel',
fields: [
'name', 'email', 'phone'
],
data: { items: [
{ name: 'Jo Anders', email: "jo.anders@helios.com", phone: "236-333-1111" },
{ name: 'YouceIkni', email: "youcef.ikni@helios.com", phone: "666-222-2222" },
{ name: 'Hanne', email: "jj.hanne@helios.com", phone: "678-333-3333" },
{ name: 'Nathelie', email: "s.nathelie@helios.com", phone: "555-890-1111" }
]},
proxy: {
type: 'memory',
reader: {
type: 'json',
rootProperty: 'items'
}
}
}); Use the Suite
You can use the runnable test suite online if you wish to run these tests yourself and inspect the sources of each test. Click here to see the testing suite: http://bryntum.com/temp/testing-cmd/tests/
Summing Up
It is very easy to test applications built with SenchaCmd and you can start with the unit testing as suggested above. You can also use the vendor instead of the local host when youare building your testing control/ harness. If you face any issues while using these steps, you can always get in touch with our Ext JS development experts and we will get back to you immediately. We hope this read was hopeful in making your Ext JS apps more authentic.
The AI research landscape is currently one of the most dynamic and vibrant fields, showing no signs of slowing down…
In the dynamic landscape of technology, cloud computing emerges as the linchpin of innovation. Did you know the cloud computing…
Did you know thе sеcrеt bеhind Ubеr's ability to connеct drivеrs and ridеrs quickly and еfficiеntly? The answer is Michaеlangеlo!…
DevOps, the buzzword of yesteryears, is a concrete reality in forward-moving enterprises today. Organizations are actively adopting DevOps practices to…
Cloud computing and Artificial Intelligence (AI) are two fundamental pillars that are driving businesses forward in numerous ways beyond the…
Cloud computing has revolutionized the way businesses operate by providing a highly scalable, flexible, and cost-effective way to manage IT…