OLD | NEW |
1 <html> | 1 <!DOCTYPE html> |
2 <head> | 2 <div id="target"></div> |
| 3 <pre id="output"></pre> |
3 <script> | 4 <script> |
4 if (window.testRunner) | 5 if (window.testRunner) { |
5 testRunner.dumpAsText(); | 6 testRunner.dumpAsText(); |
6 </script> | |
7 </head> | |
8 <body> | |
9 <div id="foo">Test</div> | |
10 <script> | |
11 function testFontValue(value) | |
12 { | |
13 document.write("Font for '" + value + "':<br>"); | |
14 var element = document.getElementById("foo"); | |
15 var decl = element.style; | |
16 decl.font = ""; | |
17 decl.font = value; | |
18 for (var i = 0; i < decl.length; i++) { | |
19 document.write(decl[i] + ": " + decl.getPropertyValue(decl[i])); | |
20 document.write("<br>"); | |
21 } | |
22 document.write("<br>"); | |
23 } | 7 } |
24 | 8 |
25 testFontValue("12px monospace"); | 9 var style = target.style; |
26 testFontValue("12px/24px serif"); | 10 function showFontLonghands(fontValue, suppressLonghandValue) |
27 testFontValue("normal 12px serif"); | 11 { |
28 testFontValue("normal normal 12px serif"); | 12 output.textContent += 'Longhands for font: ' + fontValue + '\n'; |
29 testFontValue("normal normal normal 12px serif"); | 13 style.font = ''; |
30 testFontValue("italic small-caps 12px/24px serif"); | 14 style.font = fontValue; |
31 testFontValue("italic bold 12px/24px serif"); | 15 for (var i = 0; i < style.length; i++) { |
32 testFontValue("small-caps bold 14px/28px Arial, sans-serif"); | 16 output.textContent += style[i]; |
33 testFontValue("italic small-caps bold 14px/28px Arial, sans-serif"); | 17 if (!suppressLonghandValue) { |
| 18 output.textContent += ': ' + style.getPropertyValue(style[i]); |
| 19 } |
| 20 output.textContent += '\n'; |
| 21 } |
| 22 output.textContent += '\n'; |
| 23 } |
| 24 |
| 25 showFontLonghands('12px monospace'); |
| 26 showFontLonghands('12px/24px serif'); |
| 27 showFontLonghands('normal 12px serif'); |
| 28 showFontLonghands('normal normal 12px serif'); |
| 29 showFontLonghands('normal normal normal 12px serif'); |
| 30 showFontLonghands('italic small-caps 12px/24px serif'); |
| 31 showFontLonghands('italic bold 12px/24px serif'); |
| 32 showFontLonghands('small-caps bold 14px/28px Arial, sans-serif'); |
| 33 showFontLonghands('italic small-caps bold 14px/28px Arial, sans-serif'); |
| 34 |
| 35 // Suppress showing the longhand values for system fonts because they are platfo
rm specific. |
| 36 // Platform specific system font styles are covered in fast/css/css2-system-font
s.html. |
| 37 showFontLonghands('caption', true); |
| 38 showFontLonghands('icon', true); |
| 39 showFontLonghands('menu', true); |
| 40 showFontLonghands('message-box', true); |
| 41 showFontLonghands('small-caption', true); |
| 42 showFontLonghands('status-bar', true); |
| 43 showFontLonghands('-webkit-mini-control', true); |
| 44 showFontLonghands('-webkit-small-control', true); |
| 45 showFontLonghands('-webkit-control', true); |
34 | 46 |
35 // Invalid values should yield no longhands. | 47 // Invalid values should yield no longhands. |
36 testFontValue("italic small-caps bold 12px/24px"); | 48 showFontLonghands('italic small-caps bold 12px/24px'); |
37 testFontValue("italic small-caps bold 12px"); | 49 showFontLonghands('italic small-caps bold 12px'); |
38 testFontValue("italic small-caps bold /12px serif"); | 50 showFontLonghands('italic small-caps bold /12px serif'); |
39 testFontValue("italic small-caps small-caps 12px serif"); | 51 showFontLonghands('italic small-caps small-caps 12px serif'); |
40 testFontValue("italic italic small-caps bold 12px serif"); | 52 showFontLonghands('italic italic small-caps bold 12px serif'); |
41 testFontValue("12px/italic serif"); | 53 showFontLonghands('12px/italic serif'); |
| 54 showFontLonghands("caption italic"); |
| 55 showFontLonghands("icon 12px"); |
| 56 showFontLonghands("icon 12px serif"); |
| 57 showFontLonghands("menu italic 12px"); |
42 </script> | 58 </script> |
43 </body> | |
44 </html> | |
OLD | NEW |