Eppur Si Muove

 
 
I've been fussing a bit today to get YUI 3.x and JsTestDriver-1.3.1 working together. Here are just some notes on what worked for me.
First we need a config file:
server: http://localhost:4224
load:
  - lib/yui/yui/yui-debug.js
  - lib/yui/oop/oop-debug.js
  - lib/yui/event-custom/event-custom-debug.js
  - lib/yui/attribute/attribute-base-debug.js
  - lib/yui/pluginhost/pluginhost-debug.js
  - lib/yui/base/base-debug.js
  - lib/yui/dom/dom-base-debug.js
  - lib/yui/dom/selector-native-debug.js
  - lib/yui/dom/selector-css2-debug.js
  - lib/yui/event/event-base-debug.js
  - lib/yui/dom/dom-style-debug.js
  - lib/yui/dom/dom-style-ie-debug.js
  - lib/yui/dom/dom-screen-debug.js
  - lib/yui/node/node-debug.js
  - lib/yui/event/event-base-ie-debug.js
  - lib/yui/dump/dump-debug.js
  - lib/yui/event/event-delegate-debug.js
  - src/*.js
  - test/*.js

I found that I had to manually add the dependencies for my classes in to the config file as I couldn't rely on dependencies being pulled in by the YUI framework / JsTestDriver combo. The dependencies are easy enough to get as the YUI team has a tool for figuring out the dependencies manually.  Just a copy and paste and find/replace.

Next I need a class to test. This is what I used:
YUI.add("myclass", function(Y) {

    function MyClass(config){
        MyClass.superclass.constructor.apply(this, arguments);
    }
   
    MyClass.NAME = "myClass";   
    MyClass.ATTRS = {
        id: {},
        gender : {},
        age : {}
    };
   
    Y.extend(MyClass, Y.Base, {
        bark: function() {
            return "woof";
        },
       
        initializer: function(config) {
            var id = this.get("id");
            var loc = document.getElementById(id);
            if (loc) {
                var wdgt = Y.Node.create("<div 'wdgt'>widget stuff here</div>");
                Y.one(loc).appendChild(wdgt);
            }
        }
       
    });
   
    Y.namespace("test").MyClass = MyClass;
   
}, "3.3.0", {requires:["base", "node"]});

And lastly there is a test class which I had to play with a bit:
YUI().use("myclass", function(Y){

    TestCase("MyClassTest", {
   
        testMyClassInitialization: function(){
            var my = new Y.test.MyClass({});
            assertNotNull(my);
            assertEquals("woof", my.bark());
        },
       
        testMyClassAttributesInitialization: function(){
            var my = new Y.test.MyClass({
                id: "1f33a2b987",
                gender: "Male",
                age: 23
            });
            assertEquals("Male", my.get("gender"));
            assertEquals(23, my.get("age"));
        },
       
        "test_the widget should add to the page": function(){
       
            /*:DOC += <div id="1f33a2b987">you be the man</div> */
            var div = document.getElementById("1f33a2b987");
            var parent = Y.one(div);
            assertNotNull(parent);
           
            var test = Y.one('.fine');  //this can find the div but selecting with #1f33a2b987 doesnt work
           
            var my = new Y.test.MyClass({
                id: "1f33a2b987",
                gender: "Male",
                age: 23
            });
           
            div = document.getElementById("1f33a2b987");
            parent = Y.one(div);
            cs = parent.get('children')
            assertNotNull(cs);
            assertEquals(1, cs.size());
        }
       
    });
   
});
Things to be aware of here are to be sure to add the 'myclass' dependency. I also had no success getting Y.one("#1f33a2b987") to find the node that I created in the 3rd test case. Although Y.one did not have any trouble finding by class. (I have run into this cant find by id problem before.)  From here everything worked fine although I did run the tests with the --reset option. There was one time where I didn't use --reset and I missed tests.  But it may very well have been unrelated to the --reset flag.

do your best, Marco



Leave a Reply.