ExtJs Test Framework for Mocha
npm install mocha-extjs
!status
ExtJs applications testing framework which simulates user actions.
!Demo
Component search by _title_, _fieldLabel_, _reference_, _boxLabel_, _xtype_, _text_ properties:
``javascript
// click on "Save" button
eTT().button('Save').click(done);
// select first item in the combobox with "Country" fieldLabel.
eTT().combobox('Country').select(1, done);
`
Update _index.html_:
`html
...
`
Done. Run your application!
It works now, but some hack is needed.
First of all you will need _PhantonJs_ version 2 and mocha-phantomjs library.mocha-phantomjs
After installation, upgrade one of its dependency to the latest version:
`bash
$ npm install mocha-phantomjs@4.0.2 mocha-phantomjs-core@2.0.1 phantomjs-prebuilt@2.1.7
$ rm -rf ./node_modules/mocha-phantomjs/node_modules/mocha-phantomjs-core
Run tests in console:
bash
http://localhost:3000 - application address
$ ./node_modules/.bin/mocha-phantomjs --timeout 15000 --path ./node_modules/.bin/phantomjs --setting disk-cache=false --view 1024x768 http://localhost:3000
`Library's self test with _PhantonJs_:
bash
$ npm test
`Usage
$3
javascript
var eTT = new MochaExtJs(); // init testing framework
`$3
javascript
// tests/suites/020-buttons.js
describe('Buttons', function () {
this.bail(true); // exit when first test fails
this.timeout(20 * 1000); // necessary timeout for ui operations it('Switch to "Buttons" tab', function (done) { // done - async tests callback
eTT().tab('Buttons').click(done);
});
it('Click "Simple button" button', function (done) {
eTT().button('Simple button').isEnabled().click(done);
});
});
`$3
var eTT = new MochaExtJs();eTT() -->--->|------->--->|- button ---> (|- '%title%' )----.
| | | |- window |- '%fieldLabel%' |
| |- no --' |- numberfield |- '%reference%' |
| | |- textfield |- '%boxLabel%' |
| | |- checkbox |- '%xtype%' |
| | |- combobox
- tab | |
| | |-->|- click -------> (...) ------------------v
| | | |- isEnabled |
| |- waitLoadMask() ------. | |- isDisabled |
| | | | |- isHidden |
| - waitText('%text%')---v | |- isVisible |- fill |
| | | |
| | --> cellEditor() --->|- select ---> (...) ---v- fill |
| | |
x----------------------------<-------------------------------------------------'
|
|
--> done.Examples:
javascript
eTT().button('Simple button').isEnabled().click(done);
eTT().button('Hide me').click().isHidden(done);
eTT().tab('Windows').click(done);
eTT().window('Confirm').button('Yes').isEnabled().click(done);
eTT().no.window('Confirm', done);
eTT().textfield('Name').fill('my text', done);
eTT().numberfield('Count').fill(13, done);
eTT().checkbox('include').click(done);
eTT().radio('check B').click(done);
eTT().combobox('Select in list').select(1, done);
eTT().grid('Names').select(1, 1, done);
eTT().grid('Names').checkRowsCount(2, done);
eTT().grid('Names').clickAction(0, 2, 1, done); // row, coll, action index
eTT().grid('Cell editing').cellEditor(1, 0).select(0, done);
eTT().grid('Cell editing').cellEditor(0, 2).fill('test1', done);
eTT().grid('Cell editing').cellEditor(0, 3).click(done);
eTT().grid('customDataviewReference').select(1, done);
eTT().waitLoadMask(done);
eTT().waitText('Result is here!', done);
`$3
javascript
MochaExtJs.screenshot();
MochaExtJs.screenshot('./mypath/');
`Installation
-
- use files from folder.Development
- install _NodeJs v5.10.1_ or newer
- clone repository
$ git clone https://github.com/antonfisher/node-mocha-extjs.git
- copy _ExtJs v5_ or _v6_ framework to folder
- build _Sandbox_ application
`bash
$ cd ./node-mocha-extjs/test/sandbox
$ sencha app build
`
- install dependencies
- run _lint_:
- run _gulp_: .Contributing
Please take care to maintain the existing coding style, tests for any changed functionality.
npm test and npm run lint your code.
Push your changes without ./dist/mocha-extjs.*` files, to keep commits cleaner between library releases.* 0.2.0 New grid method - clickAction
* 0.1.7 Move to _PhantomJs v2_, _ExtJs v6_, add _DataView_ support (thanks @vadimpopa)
* 0.1.6 _CellEditing_ plugin support in _PhantomJs_
* 0.1.5 Update click method, minor fixes
* 0.1.4 New grid cell editor methods
* 0.1.3 Fix previous release trouble
* 0.1.2 Update documentation
* ES2015
* standardjs
* grid select rows and cells
* 0.1.1 Update documentation
* 0.1.0 Initial Alpha release
- [x] update Mocha UI style
- [x] Self tests
- [ ] Migrate to WebPack
- [ ] Use Sencha test env
- [ ] New components
- [ ] Documentation
Copyright (c) 2016 Anton Fisher
MIT License. Free use and change.