OLD | NEW |
1 function testElementStyle(propertyJS, propertyCSS, type, value) | 1 function testElementStyle(propertyJS, propertyCSS, type, value) |
2 { | 2 { |
3 if (type != null) { | 3 if (type != null) { |
4 shouldBe("e.style." + propertyJS, "'" + value + "'"); | 4 shouldBe("e.style." + propertyJS, "'" + value + "'"); |
5 shouldBe("e.style.getPropertyCSSValue('" + propertyCSS + "').toString()"
, "'" + type + "'"); | 5 shouldBe("e.style.getPropertyCSSValue('" + propertyCSS + "').toString()"
, "'" + type + "'"); |
6 shouldBe("e.style.getPropertyCSSValue('" + propertyCSS + "').cssText", "
'" + value + "'"); | 6 shouldBe("e.style.getPropertyCSSValue('" + propertyCSS + "').cssText", "
'" + value + "'"); |
7 } else | 7 } else |
8 shouldBeNull("e.style.getPropertyCSSValue('" + propertyCSS + "')"); | 8 shouldBeNull("e.style.getPropertyCSSValue('" + propertyCSS + "')"); |
9 } | 9 } |
10 | 10 |
11 function testComputedStyle(propertyJS, propertyCSS, type, value) | 11 function testComputedStyle(propertyJS, propertyCSS, type, value) |
12 { | 12 { |
13 computedStyle = window.getComputedStyle(e, null); | 13 computedStyle = window.getComputedStyle(e, null); |
14 shouldBe("computedStyle." + propertyJS, "'" + value + "'"); | 14 shouldBe("computedStyle." + propertyJS, "'" + value + "'"); |
15 shouldBe("computedStyle.getPropertyCSSValue('" + propertyCSS + "').toString(
)", "'" + type + "'"); | 15 shouldBe("computedStyle.getPropertyCSSValue('" + propertyCSS + "').toString(
)", "'" + type + "'"); |
16 shouldBe("computedStyle.getPropertyCSSValue('" + propertyCSS + "').cssText",
"'" + value + "'"); | 16 shouldBe("computedStyle.getPropertyCSSValue('" + propertyCSS + "').cssText",
"'" + value + "'"); |
17 } | 17 } |
18 | 18 |
19 description("Test to make sure text-decoration property returns values properly.
") | 19 description("Test to make sure text-decoration property returns values properly.
") |
20 | 20 |
21 var testContainer = document.createElement("div"); | 21 var testContainer = document.createElement("div"); |
22 testContainer.contentEditable = true; | 22 testContainer.contentEditable = true; |
23 document.body.appendChild(testContainer); | 23 document.body.appendChild(testContainer); |
24 | 24 |
25 testContainer.innerHTML = '<div id="test">hello world</div>'; | 25 testContainer.innerHTML = '<div id="test">hello world</div>'; |
26 debug("Initial value:"); | 26 debug("Initial value:"); |
27 e = document.getElementById('test'); | 27 e = document.getElementById('test'); |
28 testElementStyle("textDecoration", "text-decoration", null, ''); | 28 testElementStyle("textDecoration", "text-decoration", null, ''); |
29 testComputedStyle("textDecoration", "text-decoration", "[object CSSPrimitiveValu
e]", "none"); | 29 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"none solid rgb(0, 0, 0)"); |
30 debug(''); | 30 debug(''); |
31 | 31 |
32 debug("Initial value (explicit):"); | 32 debug("Initial value (explicit):"); |
33 e.style.textDecoration = 'initial'; | 33 e.style.textDecoration = 'initial'; |
34 testElementStyle("textDecoration", "text-decoration", "[object CSSValue]", "init
ial"); | 34 testElementStyle("textDecoration", "text-decoration", null, ''); |
35 testComputedStyle("textDecoration", "text-decoration", "[object CSSPrimitiveValu
e]", "none"); | 35 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"none solid rgb(0, 0, 0)"); |
36 debug(''); | 36 debug(''); |
37 | 37 |
38 debug("Value 'none':"); | 38 debug("Value 'none':"); |
39 e.style.textDecoration = 'none'; | 39 e.style.textDecoration = 'none'; |
40 testElementStyle("textDecoration", "text-decoration", "[object CSSPrimitiveValue
]", "none"); | 40 testElementStyle("textDecoration", "text-decoration", null, ''); |
41 testComputedStyle("textDecoration", "text-decoration", "[object CSSPrimitiveValu
e]", "none"); | 41 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"none solid rgb(0, 0, 0)"); |
42 debug(''); | 42 debug(''); |
43 | 43 |
44 debug("Value 'underline':"); | 44 debug("Value 'underline':"); |
45 e.style.textDecoration = 'underline'; | 45 e.style.textDecoration = 'underline'; |
46 testElementStyle("textDecoration", "text-decoration", "[object CSSValueList]", "
underline"); | 46 testElementStyle("textDecoration", "text-decoration", null, ''); |
47 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline"); | 47 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline solid rgb(0, 0, 0)"); |
48 debug(''); | 48 debug(''); |
49 | 49 |
50 debug("Value 'overline':"); | 50 debug("Value 'overline':"); |
51 e.style.textDecoration = 'overline'; | 51 e.style.textDecoration = 'overline'; |
52 testElementStyle("textDecoration", "text-decoration", "[object CSSValueList]", "
overline"); | 52 testElementStyle("textDecoration", "text-decoration", null, ''); |
53 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"overline"); | 53 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"overline solid rgb(0, 0, 0)"); |
54 debug(''); | 54 debug(''); |
55 | 55 |
56 debug("Value 'line-through':"); | 56 debug("Value 'line-through':"); |
57 e.style.textDecoration = 'line-through'; | 57 e.style.textDecoration = 'line-through'; |
58 testElementStyle("textDecoration", "text-decoration", "[object CSSValueList]", "
line-through"); | 58 testElementStyle("textDecoration", "text-decoration", null, ''); |
59 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"line-through"); | 59 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"line-through solid rgb(0, 0, 0)"); |
60 debug(''); | 60 debug(''); |
61 | 61 |
62 debug("Value 'underline overline line-through':"); | 62 debug("Value 'underline overline line-through':"); |
63 e.style.textDecoration = 'underline overline line-through'; | 63 e.style.textDecoration = 'underline overline line-through'; |
64 testElementStyle("textDecoration", "text-decoration", "[object CSSValueList]", "
underline overline line-through"); | 64 testElementStyle("textDecoration", "text-decoration", null, ''); |
65 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline overline line-through"); | 65 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline overline line-through solid rgb(0, 0, 0)"); |
66 debug(''); | 66 debug(''); |
67 | 67 |
68 debug("Value 'blink' (valid but ignored):"); | 68 debug("Value 'blink' (valid but ignored):"); |
69 e.style.textDecoration = 'blink'; | 69 e.style.textDecoration = 'blink'; |
70 testElementStyle("textDecoration", "text-decoration", "[object CSSValueList]", "
blink"); | 70 testElementStyle("textDecoration", "text-decoration", null, ''); |
71 testComputedStyle("textDecoration", "text-decoration", "[object CSSPrimitiveValu
e]", "none"); | 71 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"none solid rgb(0, 0, 0)"); |
72 debug(''); | 72 debug(''); |
73 | 73 |
74 debug("Value '':"); | 74 debug("Value '':"); |
75 e.style.textDecoration = ''; | 75 e.style.textDecoration = ''; |
76 testElementStyle("textDecoration", "text-decoration", null, ''); | 76 testElementStyle("textDecoration", "text-decoration", null, ''); |
77 testComputedStyle("textDecoration", "text-decoration", "[object CSSPrimitiveValu
e]", "none"); | 77 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"none solid rgb(0, 0, 0)"); |
78 debug(''); | 78 debug(''); |
79 | 79 |
80 testContainer.innerHTML = '<div id="test-parent" style="text-decoration: underli
ne;">hello <span id="test-ancestor" style="text-decoration: inherit;">world</spa
n></div>'; | 80 testContainer.innerHTML = '<div id="test-parent" style="text-decoration: underli
ne;">hello <span id="test-ancestor" style="text-decoration: inherit;">world</spa
n></div>'; |
81 debug("Parent gets 'underline' value:"); | 81 debug("Parent gets 'underline' value:"); |
82 e = document.getElementById('test-parent'); | 82 e = document.getElementById('test-parent'); |
83 testElementStyle("textDecoration", "text-decoration", "[object CSSValueList]", "
underline"); | 83 testElementStyle("textDecoration", "text-decoration", null, ''); |
84 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline"); | 84 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline solid rgb(0, 0, 0)"); |
85 debug(''); | 85 debug(''); |
86 | 86 |
87 debug("Ancestor should explicitly inherit value from parent when 'inherit' value
is used:"); | 87 debug("Ancestor should explicitly inherit value from parent when 'inherit' value
is used:"); |
88 e = document.getElementById('test-ancestor'); | 88 e = document.getElementById('test-ancestor'); |
89 testElementStyle("textDecoration", "text-decoration", "[object CSSValue]", "inhe
rit"); | 89 testElementStyle("textDecoration", "text-decoration", null, ''); |
90 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline"); | 90 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline solid rgb(0, 0, 0)"); |
91 debug(''); | 91 debug(''); |
92 | 92 |
93 debug("Ancestor should not implicitly inherit value from parent (i.e. when value
is void):"); | 93 debug("Ancestor should not implicitly inherit value from parent (i.e. when value
is void):"); |
94 e.style.textDecoration = ''; | 94 e.style.textDecoration = ''; |
95 testElementStyle("textDecoration", "text-decoration", null, ''); | 95 testElementStyle("textDecoration", "text-decoration", null, ''); |
96 testComputedStyle("textDecoration", "text-decoration", "[object CSSPrimitiveValu
e]", "none"); | 96 testComputedStyle("textDecoration", "text-decoration", "[object CSSPrimitiveValu
e]", "none"); |
97 debug(''); | 97 debug(''); |
98 | 98 |
99 document.body.removeChild(testContainer); | 99 document.body.removeChild(testContainer); |
OLD | NEW |