1 suite('apply-preserving-inline-style', function() { 2 setup(function() { 3 this.element = document.createElement('div'); 4 ensureStyleIsPatched(this.element); 5 this.style = this.element.style; 6 document.documentElement.appendChild(this.element); 7 }); 8 teardown(function() { 9 this.element.remove(); 10 }); 11 12 test('Style is patched', function() { 13 assert(this.element._webAnimationsPatchedStyle); 14 }); 15 test('Setting animated style', function() { 16 this.style.left = '0px'; 17 this.element.style._set('left', '100px'); 18 assert.equal(this.style.left, '0px'); 19 }); 20 test('Clearing animated style', function() { 21 this.style.left = '0px'; 22 this.element.style._set('left', '100px'); 23 this.element.style._clear('left'); 24 assert.equal(this.style.left, '0px'); 25 }); 26 test('Patched length', function() { 27 this.element.style._set('left', '100px'); 28 this.style.cssText = 'left: 0px; background-color: green;'; 29 assert.equal(this.style.cssText, 'left: 0px; background-color: green;'); 30 assert.equal(this.style.left, '0px'); 31 assert.equal(this.style.backgroundColor, 'green'); 32 assert.equal(this.style.length, 2); 33 }); 34 test('Patched property getters and setters', function() { 35 this.style._set('left', '100px'); 36 this.style.left = '0px'; 37 this.style.backgroundColor = 'rgb(1, 2, 3)'; 38 assert.equal(this.style.left, '0px'); 39 assert.equal(this.style.backgroundColor, 'rgb(1, 2, 3)'); 40 assert.equal(getComputedStyle(this.element).left, '100px'); 41 assert.equal(getComputedStyle(this.element).backgroundColor, 'rgb(1, 2, 3)'); 42 }); 43 test('Patched setProperty/getPropertyValue', function() { 44 this.style._set('left', '100px'); 45 this.style.setProperty('left', '0px'); 46 this.style.setProperty('background-color', 'rgb(1, 2, 3)'); 47 assert.equal(this.style.getPropertyValue('left'), '0px'); 48 assert.equal(this.style.getPropertyValue('background-color'), 'rgb(1, 2, 3)'); 49 assert.equal(getComputedStyle(this.element).left, '100px'); 50 assert.equal(getComputedStyle(this.element).backgroundColor, 'rgb(1, 2, 3)'); 51 }); 52 test('Patched item()', function() { 53 this.style._set('left', '100px'); 54 this.style.setProperty('left', '0px'); 55 this.style.setProperty('background-color', 'rgb(1, 2, 3)'); 56 assert.equal(this.style.item(0), 'left'); 57 assert.equal(this.style.item(1), 'background-color'); 58 assert.equal(this.style.item(2), ''); 59 this.style.cssText = 'top: 0px'; 60 assert.equal(this.style.item(0), 'top'); 61 assert.equal(this.style.item(1), ''); 62 }); 63 test('Patched cssText', function() { 64 this.style._set('left', '100px'); 65 assert.equal(this.style.length, 0); 66 this.style.setProperty('left', '0px'); 67 this.style.setProperty('background-color', 'rgb(1, 2, 3)'); 68 assert.equal(this.style.length, 2); 69 this.style.cssText = 'top: 0px'; 70 assert.equal(this.style.length, 1); 71 }); 72 }); 73
