OLD | NEW |
---|---|
(Empty) | |
1 <!DOCTYPE html> | |
2 <html> | |
3 <head> | |
4 <script src="../../../js/resources/js-test-pre.js"></script> | |
5 </head> | |
6 <body> | |
7 <script> | |
8 function testElementStyle(propertyJS, propertyCSS, value) | |
9 { | |
10 shouldBe("e.style.getPropertyCSSValue('" + propertyCSS + "').css Text", "'" + value + "'"); | |
11 } | |
12 | |
13 function testComputedStyle(propertyJS, propertyCSS, value) | |
14 { | |
15 computedStyle = window.getComputedStyle(e, null); | |
16 shouldBe("computedStyle.getPropertyCSSValue('" + propertyCSS + " ').cssText", "'" + value + "'"); | |
17 } | |
18 | |
19 function checkComputedStyleValue() { | |
20 var before = window.getComputedStyle(e, null).getPropertyValue(' text-decoration'); | |
21 e.style.textDecoration = 'none'; | |
22 e.style.textDecoration = before; | |
23 return (window.getComputedStyle(e, null).getPropertyValue('text- decoration') == before); | |
24 } | |
25 | |
26 description("Test to make sure text-decoration property is backwards compatible with CSS 2.1 and CSS 3 shorthand.") | |
27 | |
28 var testContainer = document.createElement("div"); | |
29 testContainer.contentEditable = true; | |
30 document.body.appendChild(testContainer); | |
31 | |
32 testContainer.innerHTML = '<div id="test">hello world</div>'; | |
33 | |
34 var e = document.getElementById('test'); | |
35 | |
36 debug('Initial values:'); | |
37 shouldBeNull("e.style.getPropertyCSSValue('text-decoration')"); | |
38 testComputedStyle("textDecoration", "text-decoration", "none solid r gb(0, 0, 0)"); | |
39 shouldBe("checkComputedStyleValue()", "true"); | |
40 debug(''); | |
41 | |
42 debug('CSS2.1 backwards compatibility ("text-decoration: underline o verline line-through blink;"):'); | |
43 e.style.textDecoration = "underline overline line-through blink"; | |
44 testElementStyle("textDecorationLine", "text-decoration-line", "unde rline overline line-through blink"); | |
45 testComputedStyle("textDecorationLine", "text-decoration-line", "und erline overline line-through"); | |
46 testComputedStyle("textDecoration", "text-decoration", "underline ov erline line-through solid rgb(0, 0, 0)"); | |
47 shouldBe("checkComputedStyleValue()", "true"); | |
48 debug(''); | |
49 | |
50 debug('CSS3 Shorthand ("text-decoration: underline overline line-thr ough blink dashed red;"):'); | |
51 e.style.textDecoration = "underline overline line-through blink dash ed red"; | |
52 testComputedStyle("textDecoration", "text-decoration", "underline ov erline line-through dashed rgb(255, 0, 0)"); | |
53 testComputedStyle("textDecorationLine", "text-decoration-line", "und erline overline line-through"); | |
54 testComputedStyle("textDecorationStyle", "text-decoration-style", "d ashed"); | |
55 testComputedStyle("textDecorationColor", "text-decoration-color", "r gb(255, 0, 0)"); | |
56 shouldBe("checkComputedStyleValue()", "true"); | |
57 debug(''); | |
58 | |
59 debug('Omitting text decoration line resets to its initial value "no ne" ("text-decoration: navy dotted;"):'); | |
60 e.style.textDecoration = "navy dotted"; | |
61 testComputedStyle("textDecoration", "text-decoration", "none dotted rgb(0, 0, 128)"); | |
62 testComputedStyle("textDecorationLine", "text-decoration-line", "non e"); | |
63 testComputedStyle("textDecorationStyle", "text-decoration-style", "d otted"); | |
64 testComputedStyle("textDecorationColor", "text-decoration-color", "r gb(0, 0, 128)"); | |
65 shouldBe("checkComputedStyleValue()", "true"); | |
Julien - ping for review
2013/08/07 17:10:00
The specification allows any order for <text-decor
abinader
2013/08/07 17:24:04
Sure we can :-) Shall we append it to this patch o
Julien - ping for review
2013/08/07 18:14:54
This patch please, it's bad form to land a change
| |
66 debug(''); | |
67 | |
68 document.body.removeChild(testContainer); | |
69 </script> | |
70 <script src="../../../js/resources/js-test-post.js"></script> | |
71 </body> | |
72 </html> | |
OLD | NEW |