Extjs 3.2.X Unit Testing and Ext.test.session implementation

[yhwh]

Hi,

Since 3.2 Beta the extjs zip package contains a new folder named test, with a lots of unit testing examples.
All this unit test works with Ext.test.session class.
But there is no testing harness with the 3.2.X release (see why http://www.extjs.com/forum/showthrea...a-Unit-Testing)

This is not the official Ext.test.session class!
It is based on YUI 3 Test.

GitHub Repo: http://github.com/yhwh/Ext.test

Demos :
All Widgets
Simple Console

Screenshots :
All Widget
Simple Console

Sources :
http://github.com/downloads/yhwh/Ext.test/Ext.test-1.1.zip

API Documentation:
http://ext-test.sylogix.org/docs/

Tutorials :
http://wiki.github.com/yhwh/Ext.test/

[hello2008]

Nice, thanks for sharing

[yhwh]

Hi,

Code updated:
* Comments
* Y.ObjectAssert.hasKeys and Y.ObjectAssert.areEqual
* Interface enhancements
See First Post


Then,
Y.ObjectAssert.hasKeys and Y.ObjectAssert.areEqual implementation proposition.

/** 
 * Asserts that all properties in the object exist in another object.
 * Note: ObjectAssert.hasKeys is not implemented in YUI 2.8
 * I'am not sure this implementation is correct, because in Direct.js 
 * (Ext 3.2.1) unit test this method seems to have 4 arguments.
 * @param {Object} actual An object with the actual properties.
 * @param {Mixed} keys An Array or an Object which contains expected key.
 * @param {String} message (Optional) The message to display if the assertion fails.
 */
Y.ObjectAssert.hasKeys = function (actual, keys, message){
   if (!Ext.isArray(keys)){
    var properties = [];
    for (var key in keys){
       properties.push(key);
    }  
    keys = properties;
   } 
   var len = keys.length;
   for (var i = 0; i < len; i++){
      key = keys[i];
      Y.ObjectAssert.hasProperty(key,actual,message); 
   }  
};
/** 
 * Asserts that all properties in the object exist and are the same (===) in another object.
 * Note: ObjectAssert.areEqual is not implemented in YUI 2.8
 * I'am not sure this implementation is correct.
 * @param {Object} expected An object with the expected properties.
 * @param {Object} actual An object with the actual properties.
 * @param {String} message (Optional) The message to display if the assertion fails.
 */
Y.ObjectAssert.areEqual = function(expected, actual, message){
  for (var property in expected){
    Y.Assert.areSame(expected[property], actual[property],message); 
  }
};

For Y.ObjectAssert.hasKeys, I'am not sure because in test of Ext.Direct there is 4 arguments in hasKeys methods.
Direct.js at line 62.

   Y.ObjectAssert.hasKeys(p.actions, p, Ext.Direct.providers, "Test providers cache");

Why ? ? ?

Any idea or comments appreciated

[edspencer]

Impressed that you have been able to reverse-engineer this We do plan to release our testing harness before too long, though work on the framework itself is obviously a priority.

[yhwh]

Hi,
Code updated:
- Grouping bug fix
- getTestSuite fix
- All 3.2.1 unit test added

[eugs51]

Wow, I really want that unit testing capability. I worked in something like this using extjs and QUnit then automatic testing to different browsers using JsUnit, QUnit and QUnit to JsUnit converter to realize this. If this existed before, I would have used it. Keep it up.

[yhwh]

Hi again,

I have remarks about current unit test implementation on Extended Classes.

Here an example:

Class2 extend Class1.

Class2 = Ext.extend(Class1,{
  /* foo */
});

Then we write 2 Unit test , one for Class1 and one for Class2, with the current unit test style.
Class1 Unit Test:

Ext.test.session.addTest( 'Core', {

    name: 'Class1',

    planned: X,

    setUp: function() {
       /* foo */
    },

    tearDown: function() {
     /* foo */
    }, 
    test_1: function() {
        /* foo */
    }
});

Class2 Unit Test:

Ext.test.session.addTest( 'Extension', {

    name: 'Class2',

    planned: X,

    setUp: function() {
       /* foo */
    },

    tearDown: function() {
     /* foo */
    }, 
    test_2: function() {
        /* foo */
    }
});

Then we run both with testing harness. But setUp and tearDown may be duplicated
and the only way to test regression in Class 2, is to duplicate code of test_1 method from Class1.

Ext.test.session.addTest( 'Extension', {

    name: 'Class2',

    planned: X,

    setUp: function() {
       /* foo */
    },

    tearDown: function() {
     /* foo */
    }, 
    test_1: function() {
        /* foo */
    }
    test_2: function() {
        /* foo */
    }
});

So I think it's useful to create a testCase Class that we can extend so we will write Class1 and Class2 Unit Test like this

 Ext.test.currentTestCases['Class1'] = Ext.extend(Ext.test.testCase,{
    name: 'Class1',
    testSuite: 'Core'
    planned: X,

    setUp: function() {
       /* foo */
    },

    tearDown: function() {
     /* foo */
    }, 
    test_1: function() {
        /* foo */
    }
});
Ext.test.currentTestCases['Class1'].register();

Write Test of Class2 by extending Test of Class1, and we could check now if there is regression between Class1 and Class2, without code duplication.

 Ext.test.currentTestCases['Class2'] = Ext.extend( Ext.test.currentTestCases['Class1'],{
    name: 'Class2',
    testSuite: 'Extension'
    planned: X,

    setUp: function() {
     Ext.test.currentTestCases['Class2'].superclass.setUp.apply(this,arguments);
       /* foo */
    },

    tearDown: function() {
      Ext.test.currentTestCases['Class2'].superclass.tearDown.apply(this,arguments);
     /* foo */
    }, 
    test_2: function() {
        /* foo */
    }
});
Ext.test.currentTestCases['Class2'].register();

Any comments ?
Because I'am not an expert in js unit testing, i only started this week

PS: I hope this post is comprehensible, because my english is very bad

[yhwh]

Code update in first post progress bar added.

[yhwh]

Code update and fixes + Very Basic Tutorial

[hello2008]

well done, Nicolas
this tutorial and codes are really helpful for me.