add extjs 6.0.1 sources

[extjs.git] / extjs / packages / core / test / specs / dom / Element.style.js

describe("Ext.Element.style", function() {\r
    var testEl;\r
    \r
    beforeEach(function() {\r
        testEl = Ext.getBody().createChild({\r
            id      : 'ExtElementHelper',\r
            style   : 'position:absolute;'\r
        });\r
    });\r
    \r
    afterEach(function() {\r
        testEl.destroy();\r
    });\r
    \r
    describe('addCls', function () {\r
        xit('should add one class', function () {\r
            testEl.addCls('foo');\r
            expect(testEl.dom.className).toEqual('foo');\r
        });\r
\r
        it('should add two class', function () {\r
            testEl.addCls('foo').addCls('bar');\r
            expect(testEl.dom.className).toEqual('foo bar');\r
        });\r
\r
        xit('should add one class when given duplicates', function () {\r
            testEl.addCls('foo').addCls('foo');\r
            expect(testEl.dom.className).toEqual('foo');\r
        });\r
\r
        xit('should add two class at once', function () {\r
            testEl.addCls('foo bar').addCls('bar');\r
            expect(testEl.dom.className).toEqual('foo bar');\r
        });\r
\r
        xit('should add two class at once and handle duplicates', function () {\r
            testEl.addCls('foo bar').addCls('bar foo');\r
            expect(testEl.dom.className).toEqual('foo bar');\r
        });\r
    });\r
\r
    describe('removeCls', function () {\r
        it('should remove nothing if no classes', function () {\r
            testEl.removeCls('bar');\r
            expect(testEl.dom.className).toEqual('');\r
        });\r
\r
        it('should remove nothing if class is not present', function () {\r
            testEl.dom.className = 'foo bar';\r
            testEl.removeCls('fbar');\r
            expect(testEl.dom.className).toEqual('foo bar');\r
        });\r
\r
        it('should remove only class', function () {\r
            testEl.dom.className = 'foo';\r
            testEl.removeCls('foo');\r
            expect(testEl.dom.className).toEqual('');\r
        });\r
\r
        it('should remove last class', function () {\r
            testEl.dom.className = 'foo bar';\r
            testEl.removeCls('bar');\r
            expect(testEl.dom.className).toEqual('foo');\r
        });\r
\r
        it('should remove first class', function () {\r
            testEl.dom.className = 'foo bar';\r
            testEl.removeCls('bar');\r
            expect(testEl.dom.className).toEqual('foo');\r
        });\r
\r
        it('should remove middle class', function () {\r
            testEl.dom.className = 'foo bar jazz';\r
            testEl.removeCls('bar');\r
            expect(testEl.dom.className).toEqual('foo jazz');\r
        });\r
\r
        it('should remove multiple classes', function () {\r
            testEl.dom.className = 'foo bar jazz spud';\r
            testEl.removeCls('jazz bar fff');\r
            expect(testEl.dom.className).toEqual('foo spud');\r
        });\r
\r
        it('should remove multiple classes sequentially', function () {\r
            testEl.dom.className = 'foo bar jazz spud';\r
            testEl.removeCls('jazz').removeCls('bar').removeCls('fff');\r
            expect(testEl.dom.className).toEqual('foo spud');\r
        });\r
    });\r
\r
    describe('getStyle', function(){\r
        var el, dom;\r
        beforeEach(function(){\r
            dom = document.createElement('div');\r
            testEl.appendChild(dom);\r
            el = Ext.get(dom);\r
        });\r
        afterEach(function(){\r
            el.destroy();\r
        });\r
\r
        describe('border-*-width', function(){\r
            Ext.Array.forEach('top right bottom left'.split(' '), function(side){\r
                it('must report the correct border-'+ side +'-width when the border-'+ side +'-style is "solid"', function(){\r
                    dom.style.cssText = 'border:5px solid';\r
                    expect(el.getStyle('border-'+ side +'-width')).toBe('5px');\r
                });\r
                it('must report 0px for border-'+ side +'-width when the border-'+ side +'-style is "none"', function(){\r
                    dom.style.cssText = 'border:5px solid; border-' + side + '-style:none';\r
                    expect(el.getStyle('border-'+ side +'-width')).toBe('0px');\r
                });\r
            });\r
        });\r
\r
    });\r
    \r
    describe('setStyle', function() {\r
        var el, dom;\r
        beforeEach(function(){\r
            dom = document.createElement('div');\r
            testEl.appendChild(dom);\r
            el = Ext.get(dom);\r
        });\r
        afterEach(function(){\r
            el.destroy();\r
        });\r
\r
        describe('font-size', function() {\r
            it('should set the font size', function() {\r
                el.setStyle('font-size', '50px');\r
                expect(el.getStyle('font-size')).toEqual('50px');\r
            });\r
        });\r
\r
        describe('font-sstyle', function() {\r
            it('should set the font style', function() {\r
                el.setStyle('font-style', 'italic');\r
                expect(el.getStyle('font-style')).toEqual('italic');\r
            });\r
        });\r
\r
        describe('font-family', function() {\r
            it('should set the font family', function() {\r
                el.setStyle('font-family', 'Courier');\r
                expect(el.getStyle('font-family').toLowerCase().indexOf('courier')).toBeGreaterThan(-1);\r
            });\r
        });\r
    });\r
\r
}, "/src/dom/Element.style.js");\r