mocha-extjs
ExtJs applications testing framework which simulates user actions.
Component search by title, fieldLabel, reference, boxLabel, xtype, text properties:
// click on "Save" button; // select first item in the combobox with "Country" fieldLabel.;
Getting Started:
Update index.html:
... <!-- mocha ui --> <!-- mocha library --> <!-- mocha-extjs library --> <!-- setup mocha --> <!-- first test suite --> <!-- run script -->
Done. Run your application!
PhantomJs
It works now, but some hack is needed.
First of all you will need PhantonJs version 2 and mocha-phantomjs
library.
After mocha-phantomjs
installation, upgrade one of its dependency to the latest version:
$ 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 # check PhantonJs version, should be like this: $ ./node_modules/.bin/phantomjs --version2.1.1
Run tests in console:
# 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:
$ npm test
Usage
Init the library before running MochaJs
var eTT = ; // init testing framework
Add test suite:
// tests/suites/020-buttons.js;
Supported components and methods:
var eTT = new MochaExtJs();
eTT() -->--->|------->--->|- button ---> (|- '%title%' )----.
| | | |- window |- '%fieldLabel%' |
| |- no --' |- numberfield |- '%reference%' |
| | |- textfield |- '%boxLabel%' |
| | |- checkbox |- '%xtype%' |
| | |- combobox `- '%text%' |
| | |- dataview |
| | |- radio |
| | |- grid .----------------------x----------------------.
| | `- tab | |
| | |-->|- click -------> (...) ------------------v
| | | |- isEnabled |
| |- waitLoadMask() ------. | |- isDisabled |
| | | | |- isHidden |
| `- waitText('%text%')---v | |- isVisible |
| | | |- select |
| | | |- checkRowsCount |
| | | |- clickAction |
| | | |- edit |
| | | `- fill |
| | | |
| | `--> cellEditor() --->|- select ---> (...) ---v
| | |- click |
| | `- fill |
| | |
x----------------------------<-------------------------------------------------'
|
|
`--> done.
Examples:
;;;;no;;;;;;;;; // row, coll, action index;;;;;;
Taking screenshots
MochaExtJs;MochaExtJs;
Installation
$ npm install mocha-extjs
- use files from
./dist
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
./test/sandbox/ext
folder - build Sandbox application
$ cd ./node-mocha-extjs/test/sandbox$ sencha app build
- install dependencies
$ npm install
- run lint:
$ npm run lint
- run gulp:
$ npm start
.
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.
Thank you!
Releases History
- 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
ToDo
- update Mocha UI style
- Self tests
- Migrate to WebPack
- Use Sencha test env
- New components
- Documentation
License
Copyright (c) 2016 Anton Fisher a.fschr@gmail.com
MIT License. Free use and change.