extjs-rails 4.1.0.alpha1

data/app/assets/javascripts/extjs-rails/src/core/test/unit/spec/dom/CompositeElementLite.js

@@ -0,0 +1,409 @@
+describe("Ext.CompositeElementLite", function(){
+    
+    var mainRoot, ce, makeCE,
+        fooTotal = 6,
+        barTotal = 5,
+        bazTotal = 4,
+        child1Total = 5,
+        child2Total = 4,
+        child1RootedTotal = 2,
+        child2RootedTotal = 2,
+        child1MainTotal = 3,
+        child2MainTotal = 2,
+        byId = function(id) {
+            return document.getElementById(id);    
+        };
+    
+    beforeEach(function(){
+        mainRoot = Ext.getBody().createChild({
+            id: 'mainRoot'
+        });
+        
+        mainRoot.dom.innerHTML = [
+            '<div class="foo toFilter" id="a">',
+                '<div class="child1">c1</div>',
+                '<div class="child2">c2</div>',
+                '<div class="child1">c3</div>',
+                '<div class="child2">c4</div>',
+            '</div>',
+            '<div class="bar" id="b"></div>',
+            '<div class="baz" id="c"></div>',
+            '<div class="foo" id="d"></div>',
+            '<div class="bar" id="e"></div>',
+            '<div class="baz" id="f"></div>',
+            '<div class="foo toFilter" id="g"></div>',
+            '<div class="bar" id="h"></div>',
+            '<div class="baz" id="i"></div>',
+            '<div class="foo" id="j"></div>',
+            '<div class="bar" id="k"></div>',
+            '<div class="baz" id="l"></div>',
+            '<div class="foo" id="m"></div>',
+            '<div class="bar" id="n"></div>',
+            '<div class="foo" id="o"></div>',
+            '<div class="child1" id="p"></div>',
+            '<div class="child2" id="q"></div>',
+            '<div class="child1" id="r"></div>',
+            '<div class="child2" id="s"></div>',
+            '<div class="child1" id="t"></div>'
+        ];
+        
+        makeCE = function(els, root) {
+            ce = new Ext.CompositeElementLite(els, root);
+        };
+    });
+    
+    afterEach(function(){
+        mainRoot.remove();
+        makeCE = mainRoot = ce = null;
+    });
+    
+    describe("add", function(){
+        it("should accept a selector", function(){
+            makeCE();
+            ce.add('.foo');
+            expect(ce.getCount()).toBe(fooTotal);
+        });  
+        
+        it("should accept a selector with a root", function(){
+            makeCE();
+            ce.add('.child1', 'a');
+            expect(ce.getCount()).toBe(child1RootedTotal);    
+        });
+        
+        it("should accept another CompositeElement", function(){
+            var other = new Ext.CompositeElementLite();
+            other.add(byId('a'));
+            other.add(byId('b'));
+            other.add(byId('c'));
+            makeCE();
+            ce.add(other);
+            expect(ce.getCount()).toBe(3);
+        });
+        
+        it("should accept an array of elements", function(){
+            makeCE();
+            ce.add([byId('a'), byId('b')]);
+            expect(ce.getCount()).toBe(2);    
+        });
+        
+        it("should accept a NodeList", function(){
+            makeCE();
+            ce.add(byId('a').getElementsByTagName('div'));
+            expect(ce.getCount()).toBe(4);  
+        });
+        
+        it("should accept a single element", function(){
+            makeCE();
+            ce.add(byId('a'));
+            expect(ce.getCount()).toBe(1);    
+        });
+        
+        it("should accept a null argument", function(){
+            makeCE();
+            expect(ce.add(null)).toBe(ce);
+        });
+        
+        it("should return the CompositeElement", function(){
+            makeCE();
+            expect(ce.add('.foo')).toBe(ce);
+        })
+    });
+    
+    describe("item", function(){
+        it("should return null if there are no items", function(){
+            makeCE();
+            expect(ce.item(0)).toBeNull();
+        });
+        
+        it("should return null if an item at that index does not exist", function(){
+            makeCE('.foo');    
+            expect(ce.item(fooTotal)).toBeNull();
+        });
+        
+        it("should return the item at the specified index", function(){
+            makeCE('.foo');
+            expect(ce.item(2).dom.id).toBe('g');    
+        });
+        
+        describe("first", function(){
+            it("should return null when there are no items", function(){
+                makeCE();
+                expect(ce.first()).toBeNull();
+            });
+            
+            it("should return the first item", function(){
+                makeCE('.foo');
+                expect(ce.first().dom.id).toBe('a');    
+            });
+        });
+        
+        describe("last", function(){
+            it("should return null when there are no items", function(){
+                makeCE();
+                expect(ce.last()).toBeNull();
+            });
+            
+            it("should return the last item", function(){
+                makeCE('.foo');
+                expect(ce.last().dom.id).toBe('o');
+            })
+        });
+    });
+    
+    describe("each", function(){
+        it("should never iterate if there are no items", function(){
+            var cnt = 0;
+            makeCE();
+            ce.each(function(){
+                ++cnt;
+            });    
+            expect(cnt).toBe(0);
+        });  
+        
+        it("should iterate over each item", function(){
+            var cnt = 0;
+            makeCE('.baz');
+            ce.each(function(){
+                ++cnt;
+            });
+            expect(cnt).toBe(bazTotal);
+        });
+        
+        it("should default the scope to the element", function(){
+            var isEl;
+            makeCE(byId('a'));
+            ce.each(function(e){
+                isEl = (e == this);
+            });
+            expect(isEl).toBe(true);
+        });
+        
+        it("should use a specified scope", function(){
+            var o = {},
+                scope;
+                
+            makeCE('.foo');  
+            ce.each(function(){
+                scope = this;
+            }, o);  
+            expect(scope).toBe(o);
+        });
+        
+        it("should pass the element, the ce & the index", function(){
+            var info;
+            makeCE(byId('a'));
+            ce.each(function(el, theCE, index){
+                info = [el.dom.id, theCE, index];
+            });    
+            expect(info).toEqual(['a', ce, 0]);
+        });
+        
+        it("should exit upon returning false", function(){
+            var cnt = 0;
+            makeCE('.foo');
+            ce.each(function(el){
+                if (el.dom.id == 'd') {
+                    return false;
+                }
+                ++cnt;
+            });
+            expect(cnt).toBe(1);
+        });
+        
+        it("should return the CompositeElement", function(){
+            makeCE();
+            expect(ce.each(function(){})).toBe(ce);    
+        });
+    });
+    
+    describe("fill", function(){
+        it("should clear any existing elements", function(){
+            makeCE('.foo');
+            ce.fill(null);
+            expect(ce.getCount()).toBe(0);    
+        });
+        
+        it("should accept a selector", function(){
+            makeCE('.foo');
+            expect(ce.getCount()).toBe(fooTotal);
+            ce.fill('.bar');
+            expect(ce.getCount()).toBe(barTotal);    
+        });
+        
+        it("should accept an array of elements", function(){
+            makeCE();
+            ce.fill([byId('a'), byId('b')]);
+            expect(ce.getCount()).toBe(2);    
+        });
+        
+        it("should accept a NodeList", function(){
+            makeCE();
+            ce.fill(byId('a').getElementsByTagName('div'));
+            expect(ce.getCount()).toBe(4);  
+        });
+        
+        it("should accept another CompositeElement", function(){
+            var other = new Ext.CompositeElementLite();
+            other.add(byId('a'));
+            other.add(byId('b'));
+            other.add(byId('c'));
+            makeCE();
+            ce.fill(other);
+            expect(ce.getCount()).toBe(3);
+        });
+        
+        it("should return the CompositeElement", function(){
+            makeCE();
+            expect(ce.fill(null)).toBe(ce);
+        });
+    });
+    
+    describe("filter", function(){
+        
+        it("should accept a selector", function(){
+            makeCE('.foo');
+            expect(ce.getCount(fooTotal));
+            expect(ce.filter('.toFilter').getCount()).toBe(2);
+        });
+        
+        it("should return the CompositeElement", function(){
+            makeCE();
+            expect(ce.filter(function(){})).toBe(ce);    
+        });  
+        
+        it("should accept a function", function(){
+            makeCE('.foo');
+            ce.filter(function(el){
+                var id = el.dom.id;
+                return id == 'a' || id == 'd' || id == 'g';    
+            });
+            expect(ce.getCount()).toBe(3);
+        });
+        
+        it("should set the scope to the element", function(){
+            var id;
+            makeCE(byId('a'));
+            ce.filter(function(){
+                id = this.dom.id;
+            }); 
+            expect(id).toBe('a');
+        });
+        
+        it("should pass the element, the CompositeElement & the index", function(){
+            var info;
+            makeCE(byId('a'));
+            ce.filter(function(el, otherCE, index){
+                info = [el.dom.id, otherCE, index];
+            }); 
+            expect(info).toEqual(['a', ce, 0]);
+        });
+    });
+    
+    describe("indexOf", function(){
+        it("should return -1 when there are no items", function(){
+            makeCE();
+            expect(ce.indexOf('a')).toBe(-1);    
+        });
+        
+        it("should return -1 when the item doesn't exist in the collection", function(){
+            makeCE('.bar');
+            expect(ce.indexOf('a')).toBe(-1);   
+        });
+        
+        it("should accept an id", function(){
+            makeCE('.foo');
+            expect(ce.indexOf('a')).toBe(0);    
+        });
+        
+        it("should accept an HTMLElement", function(){
+            makeCE('.foo');
+            expect(ce.indexOf(byId('d'))).toBe(1);    
+        });
+        
+        it("should accept an Ext.dom.Element", function(){
+            makeCE('.foo');
+            expect(ce.indexOf(Ext.fly('g'))).toBe(2);
+        });
+    });
+    
+    describe("contains", function(){
+        it("should return false when there are no items", function(){
+            makeCE();
+            expect(ce.contains('a')).toBe(false);    
+        });
+        
+        it("should return false when the item doesn't exist in the collection", function(){
+            makeCE('.bar');
+            expect(ce.contains('a')).toBe(false);   
+        });
+        
+        it("should accept an id", function(){
+            makeCE('.foo');
+            expect(ce.contains('a')).toBe(true);    
+        });
+        
+        it("should accept an HTMLElement", function(){
+            makeCE('.foo');
+            expect(ce.contains(byId('d'))).toBe(true);    
+        });
+        
+        it("should accept an Ext.dom.Element", function(){
+            makeCE('.foo');
+            expect(ce.contains(Ext.fly('g'))).toBe(true);
+        });
+    });
+    
+    describe("removeElement", function(){
+        it("should accept a string id", function(){
+            makeCE('.foo');
+            ce.removeElement('a');
+            expect(ce.contains('a')).toBe(false);
+        });
+        
+        it("should accept an HTMLElement", function(){
+            makeCE('.foo');
+            ce.removeElement(byId('a'));
+            expect(ce.contains('a')).toBe(false);
+        });
+        
+        it("should accept an Ext.dom.Element", function(){
+            makeCE('.foo');
+            ce.removeElement(Ext.fly('a'));
+            expect(ce.contains('a')).toBe(false);
+        });
+        
+        it("should accept an index", function(){
+            makeCE('.foo');
+            ce.removeElement(0);
+            expect(ce.contains('a')).toBe(false);
+        });
+        
+        it("should remove the element if removeDom is specified", function(){
+            makeCE('.foo');
+            ce.removeElement('a', true);
+            // refill from DOM
+            ce.fill('.foo');
+            expect(ce.contains('a')).toBe(false);    
+        });
+        
+        it("should return the CompositeElement", function(){
+            makeCE();
+            expect(ce.removeElement(null)).toBe(ce);    
+        });
+    });
+    
+    describe("clear", function(){
+        it("should do nothing when the collection is empty", function(){
+            makeCE();
+            ce.clear();
+            expect(ce.getCount()).toBe(0);    
+        });
+        
+        it("should remove all elements", function(){
+            makeCE('.foo');
+            ce.clear();
+            expect(ce.getCount()).toBe(0);    
+        });
+    });
+    
+});

data/app/assets/javascripts/extjs-rails/src/core/test/unit/spec/dom/DomHelper.js

@@ -0,0 +1,444 @@
+xdescribe("Ext.core.DomHelper", function(){
+    // TODO this spec is just unmaintanable, because of subtleGradient magic...
+    // no dynamic spec generation !
+    var TestHelper = {
+        dom:{
+            cleanBody: function(){
+                document.getElementsByTagName('body')[0].innerHTML = '';
+            },
+
+            parentNodeName: {
+                '*'      : 'div',
+                frame    : 'frameset',
+                col      : 'colgroup',
+                colgroup : 'table',
+                option   : 'select',
+                optgroup : 'select',
+                tbody    : 'table',
+                thead    : 'table',
+                tfoot    : 'table',
+                tr       : 'tbody',
+                td       : 'tr'
+            },
+
+            voidNode: {
+                area   : true,
+                br     : true,
+                col    : true,
+                frame  : true,
+                hr     : true,
+                img    : true,
+                input  : true,
+                link   : true,
+                meta   : true,
+                param  : true,
+                range  : true,
+                spacer : true,
+                wbr    : true
+            }
+
+        },
+        String:{
+            html: function(tagName, className){
+                var HTML = '<'+tagName+' class='+className+'>';
+                if (!TestHelper.dom.voidNode[tagName]) HTML += '</'+tagName+'>';
+                // console.log(HTML);
+                return HTML;
+            }
+        }
+    };    
+    
+    xdescribe('useDom = false', function(){
+        beforeEach(function(){
+            Ext.core.DomHelper.useDom = false;
+        });
+        //Ext_core_DomHelper_Tests.apply(this, arguments);
+    });
+    
+    xdescribe('useDom = true', function(){
+        beforeEach(function(){
+            Ext.core.DomHelper.useDom = false;
+        });
+        afterEach(function(){
+            Ext.core.DomHelper.useDom = true;
+        });
+        //Ext_core_DomHelper_Tests.apply(this, arguments);
+    });
+   
+   
+function Ext_core_DomHelper_Tests() {
+    var dh = Ext.core.DomHelper,
+        el, els;
+    beforeEach(function(){
+        el = Ext.getBody().createChild({
+            id      : 'DomHelperHelper',
+            children: [
+                {cls: 'child', id: 'firstChild'},
+                {cls: 'child'},
+                {cls: 'child'},
+                {cls: 'child'},
+                {cls: 'child'},
+                {cls: 'child2'},
+                {cls: 'child2'},
+                {cls: 'child'},
+                {cls: 'child'},
+                {cls: 'child'}
+            ]
+        });
+        
+        els = Ext.select('#DomHelperHelper > div');
+    });
+    
+    afterEach(TestHelper.dom.cleanBody);
+    
+    describe("markup", function() {
+        it("should return the markup for a string", function() {
+            var markup = '<div class="class">my div!</div>';
+            
+            expect(dh.markup(markup)).toEqual(markup);
+        });
+        
+        it("should return the markup for an object", function() {
+            var markup = '<div class="class"><span style="padding:10px;">test</span><br/></div>',
+                html   = {
+                    cls: 'class',
+                    children: [
+                        {
+                            tag : 'span',
+                            html: 'test',
+                            style: {
+                                padding: '10px'
+                            }
+                        },
+                        {tag: 'br'}
+                    ]
+                };
+            
+            expect(dh.markup(html)).toEqual(markup);
+        });
+    });
+    
+    describe("applyStyles", function() {
+        it("should apply styles from a string", function() {
+            dh.applyStyles(el, 'padding:10px;');
+            
+            expect(el.dom.style.padding).toMatch(/^(?:10px|10px 10px 10px 10px)$/);
+        });
+        
+        it("should apply styles from an object", function() {
+            dh.applyStyles(el, {
+                padding: '10px'
+            });
+            
+            expect(el.dom.style.padding).toMatch(/^(?:10px|10px 10px 10px 10px)$/);
+        });
+        
+        // TODO: Implement using raw numbers in DomHelper.applyStyles
+        xit("should apply styles from an object using numbers", function() {
+            dh.applyStyles(el, {
+                padding: 10
+            });
+            
+            expect(el.dom.style.padding).toMatch(/^(?:10px|10px 10px 10px 10px)$/);
+        });
+        
+        it("should apply styles from a function", function() {
+            dh.applyStyles(el, function() {
+                return {
+                    padding: '10px'
+                };
+            });
+            
+            expect(el.dom.style.padding).toMatch(/^(?:10px|10px 10px 10px 10px)$/);
+        });
+    });
+    
+    describe("insertHtml", function() {
+        
+        var testEl, HTML = '<div id="newChild"></div>';
+        
+        describe("basic",function(){
+            beforeEach(function(){
+                testEl = Ext.getDom(els.first());
+                expect(Ext.get('newChild')).toBeNull();
+            });
+            afterEach(function(){
+                var el = document.getElementById('newChild');
+                expect(el).toBeDefined();
+                testEl.innerHTML = '';
+            });
+
+            it("should insert a new element beforeBegin", function() { dh.insertHtml('beforeBegin', testEl, HTML); });
+            it("should insert a new element afterBegin", function() { dh.insertHtml('afterBegin', testEl, HTML); });
+            it("should insert a new element beforeEnd", function() { dh.insertHtml('beforeEnd', testEl, HTML); });
+            it("should insert a new element afterEnd", function() { dh.insertHtml('afterEnd', testEl, HTML); });
+            
+            describe("textNode", function(){
+                var UID=0, text, textNode;
+                beforeEach(function(){
+                    textNode = document.createTextNode(text = "howdy" + (UID++));
+                    testEl.appendChild(textNode);
+                    expect(testEl.firstChild).toEqual(textNode);
+                    expect(testEl.firstChild.nodeValue).toEqual(text);
+                });
+                afterEach(function(){
+                    expect(testEl.childNodes.length).toEqual(2);
+                    testEl.removeChild(textNode);
+                    expect(testEl.childNodes.length).toEqual(1);
+                    
+                    textNode = null;
+                    testEl.innerHTML = '';
+                    expect(testEl.childNodes.length).toEqual(0);
+                });
+                
+                it("should insert a new element beforeBegin", function() { dh.insertHtml('beforeBegin', textNode, HTML); });
+                it("should insert a new element afterBegin", function() { dh.insertHtml('afterBegin', textNode, HTML); });
+                it("should insert a new element beforeEnd", function() { dh.insertHtml('beforeEnd', textNode, HTML); });
+                it("should insert a new element afterEnd", function() { dh.insertHtml('afterEnd', textNode, HTML); });
+            });
+
+        });
+        
+        describe("details", function(){
+            var outside = {afterEnd:true, beforeBegin:true},
+                inside = {afterBegin:true, beforeEnd:true},
+                everywhere = {afterEnd:true, beforeBegin:true, afterBegin:true, beforeEnd:true};
+            
+            for (var tagName in TestHelper.dom.voidNode) {
+                insertHtml_shouldSupport(outside, tagName, tagName);
+            }
+            
+            insertHtml_shouldSupport(everywhere, 'div', 'div');
+            insertHtml_shouldSupport(everywhere, 'a', 'p');
+            insertHtml_shouldSupport(everywhere, 'a', 'a');
+            
+            insertHtml_shouldSupport(inside, 'tr', 'td');
+            insertHtml_shouldSupport(outside, 'tr', 'tr');
+            
+            insertHtml_shouldSupport(inside, 'tbody', 'tr');
+            insertHtml_shouldSupport(inside, 'tfoot', 'tr');
+            insertHtml_shouldSupport(inside, 'thead', 'tr');
+            
+            insertHtml_shouldSupport(outside, 'tbody', 'tbody');
+            insertHtml_shouldSupport(outside, 'tbody', 'thead');
+            insertHtml_shouldSupport(outside, 'tbody', 'tfoot');
+            insertHtml_shouldSupport(outside, 'tfoot', 'tbody');
+            insertHtml_shouldSupport(outside, 'tfoot', 'thead');
+            insertHtml_shouldSupport(outside, 'tfoot', 'tfoot');
+            insertHtml_shouldSupport(outside, 'thead', 'tbody');
+            insertHtml_shouldSupport(outside, 'thead', 'thead');
+            insertHtml_shouldSupport(outside, 'thead', 'tfoot');
+            
+            
+            function insertHtml_shouldSupport(where, tagName, tagNameToInsert){
+                if (where.afterBegin) insertHtml_shouldSupport_inside('afterBegin', tagName, tagNameToInsert);
+                if (where.beforeEnd) insertHtml_shouldSupport_inside('beforeEnd', tagName, tagNameToInsert);
+                if (where.afterEnd) insertHtml_shouldSupport_outside('afterEnd', tagName, tagNameToInsert);
+                if (where.beforeBegin) insertHtml_shouldSupport_outside('beforeBegin', tagName, tagNameToInsert);
+                
+                if (where.afterBegin || where.beforeEnd){
+                    it(["should overwrite the HTML",
+                        "of a", tagName.toUpperCase(), "Element"].join(' '), function(){
+                        
+                        var html = TestHelper.String.html(tagNameToInsert, 'overwrite');
+                        
+                        var target = document.createElement(tagName);
+                        expect(target.parentNode).toBeNull();
+                        expect(target.childNodes.length).toBe(0);
+                        expect(target.firstChild).toBeNull();
+                        
+                        dh.overwrite(target, html);
+                        expect(target.childNodes.length).toBe(1);
+                        expect(target.firstChild).toBeDefined();
+                        expect(target.firstChild.className).toBe('overwrite');
+                    });
+                    
+                    
+                    if (Ext.core.Element.prototype.setHTML) it(["should set the HTML",
+                        "of a", tagName.toUpperCase(), "Element"].join(' '), function(){
+                        
+                        var html = TestHelper.String.html(tagNameToInsert, 'overwrite');
+                        
+                        var target = document.createElement(tagName);
+                        expect(target.parentNode).toBeNull();
+                        expect(target.childNodes.length).toBe(0);
+                        expect(target.firstChild).toBeNull();
+                        
+                        Ext.fly(target).setHTML(html);
+                        expect(target.childNodes.length).toBe(1);
+                        expect(target.firstChild).toBeDefined();
+                        expect(target.firstChild.className).toBe('overwrite');
+                    });
+                }
+            }
+            
+            function insertHtml_shouldSupport_inside(where, tagName, tagNameToInsert){
+                it(["should insertHtml", tagNameToInsert.toUpperCase(), where,
+                    "of a " + tagName.toUpperCase() + " Element",
+                    "when it has no parentNode"].join(' '), function(){
+                    
+                    var html = TestHelper.String.html(tagNameToInsert, where);
+                    
+                    var target = document.createElement(tagName);
+                    expect(target.parentNode).toBeNull();
+                    expect(target.childNodes.length).toBe(0);
+                    expect(target.firstChild).toBeNull();
+                    
+                    dh.insertHtml(where, target, html);
+                    expect(target.childNodes.length).toBe(1);
+                    expect(target.firstChild).toBeDefined();
+                    expect(target.firstChild.className).toBe(where);
+                });
+            }
+            
+            function insertHtml_shouldSupport_outside(where, tagName, tagNameToInsert){
+                it(["should insertHtml", tagNameToInsert.toUpperCase(), where,
+                    "of a " + tagName.toUpperCase() + " Element"].join(' '), function(){
+                    
+                    var html = TestHelper.String.html(tagNameToInsert, where);
+                    
+                    var target = document.createElement(tagName);
+                    document.createElement(TestHelper.dom.parentNodeName[tagName] || TestHelper.dom.parentNodeName['*']).appendChild(target);
+                    var parentNode = target.parentNode;
+                    
+                    expect(parentNode).toBeDefined();
+                    expect(target.childNodes.length).toBe(0);
+                    expect(target.firstChild).toBeNull();
+                    expect(parentNode.childNodes.length).toBe(1);
+                    
+                    dh.insertHtml(where, target, html);
+                    parentNode.removeChild(target);
+                    
+                    expect(parentNode.childNodes.length).toBe(1);
+                    expect(parentNode.firstChild.tagName.toLowerCase()).toBe(tagNameToInsert);
+                    expect(parentNode.firstChild.className).toBe(where);
+                });
+            }
+        });
+        
+    });
+    
+    describe("overwrite", function() {
+        it("should overwrite the el", function() {
+            var node = Ext.getDom(els.first());
+            
+            expect(node.innerHTML).toEqual('');
+            
+            dh.overwrite(node, {
+                tag : 'span',
+                html: 'hello'
+            });
+            
+            expect(node.innerHTML.toLowerCase()).toEqual('<span>hello</span>');
+        });
+        
+        describe("table innerHTML bug", function(){
+            it("should set the html of a tr Element, even when it has no parentNode", function(){
+                var tr = document.createElement('tr');
+                expect(tr.parentNode).toEqual(null);
+                expect(tr.childNodes.length).toEqual(0);
+                
+                dh.overwrite(tr, '<td>cell1');
+                expect(tr.childNodes.length).toEqual(1);
+                expect(tr.lastChild.innerHTML).toEqual('cell1');
+                
+                dh.overwrite(tr, '<td>cell2');
+                expect(tr.childNodes.length).toEqual(1);
+                expect(tr.lastChild.innerHTML).toEqual('cell2');
+                
+            });
+            
+            it("should set the html of an Element", function(){
+                var html = '<a href="http://mootools.net/">Link</a>';
+                var parent = document.createElement('div');
+                dh.overwrite(parent, html);
+                expect(parent.innerHTML.toLowerCase()).toEqual(html.toLowerCase());
+            });
+            
+            it("should set the html of an Element with multiple arguments", function(){
+                var html = ['<p>Paragraph</p>', '<a href="http://mootools.net/">Link</a>'];
+                var parent = document.createElement('div');
+                dh.overwrite(parent, html);
+                
+                expect(parent.innerHTML.toLowerCase()).toEqual(html.join('').toLowerCase());
+            });
+            
+            it("should set the html of a select Element", function(){
+                var html = '<option>option 1</option><option selected="selected">option 2</option>';
+                var select = document.createElement('select');
+                dh.overwrite(select, html);
+                
+                expect(select.childNodes.length).toEqual(2);
+                expect(select.options.length).toEqual(2);
+                expect(select.selectedIndex).toEqual(1);
+            });
+            
+            it("should set the html of a table Element", function(){
+                var html = '<tbody><tr><td>cell 1</td><td>cell 2</td></tr><tr><td class="cell">cell 1</td><td>cell 2</td></tr></tbody>';
+                var table = document.createElement('table');
+                
+                dh.overwrite(table, html);
+                
+                expect(table.childNodes.length).toEqual(1);
+                expect(table.firstChild.firstChild.childNodes.length).toEqual(2);
+                expect(table.firstChild.lastChild.firstChild.className).toEqual('cell');
+            });
+            
+            it("should set the html of a tbody Element", function(){
+                var html = '<tr><td>cell 1</td><td>cell 2</td></tr><tr><td class="cell">cell 1</td><td>cell 2</td></tr>';
+                var tbody = document.createElement('tbody');
+                document.createElement('table').appendChild(tbody);
+                dh.overwrite(tbody, html);
+                
+                expect(tbody.childNodes.length).toEqual(2);
+                expect(tbody.lastChild.firstChild.className).toEqual('cell');
+            });
+            
+            it("should set the html of a thead Element", function(){
+                var html = '<tr><td>cell 1</td><td>cell 2</td></tr><tr><td class="cell">cell 1</td><td>cell 2</td></tr>';
+                var thead = document.createElement('thead');
+                document.createElement('table').appendChild(thead);
+                dh.overwrite(thead, html);
+                
+                expect(thead.childNodes.length).toEqual(2);
+                expect(thead.lastChild.firstChild.className).toEqual('cell');
+            });
+            
+            it("should set the html of a tfoot Element", function(){
+                var html = '<tr><td>cell 1</td><td>cell 2</td></tr><tr><td class="cell">cell 1</td><td>cell 2</td></tr>';
+                var tfoot = document.createElement('tfoot');
+                document.createElement('table').appendChild(tfoot);
+                dh.overwrite(tfoot, html);
+                
+                expect(tfoot.childNodes.length).toEqual(2);
+                expect(tfoot.lastChild.firstChild.className).toEqual('cell');
+            });
+            
+            it("should set the html of a tr Element", function(){
+                var html = '<td class="cell">cell 1</td><td>cell 2</td>';
+                var tr = document.createElement('tr');
+                document.createElement('tbody').appendChild(tr);
+                document.createElement('table').appendChild(tr.parentNode);
+                dh.overwrite(tr, html);
+                
+                expect(tr.childNodes.length).toEqual(2);
+                expect(tr.firstChild.className).toEqual('cell');
+            });
+            
+            it("should set the html of a td Element", function(){
+                var html = '<span class="span">Some Span</span><a href="#">Some Link</a>';
+                var td = document.createElement('td');
+                document.createElement('tr').appendChild(td);
+                document.createElement('tbody').appendChild(td.parentNode);
+                document.createElement('table').appendChild(td.parentNode.parentNode);
+                dh.overwrite(td, html);
+                
+                expect(td.childNodes.length).toEqual(2);
+                expect(td.firstChild.className).toEqual('span');
+            });
+            
+        });
+    });
+}
+});
+