third_party/WebKit/LayoutTests/fast/css/font-shorthand.html

   1 <!DOCTYPE html>
   2 <div id="target"></div>
   3 <pre id="output"></pre>
   4 <script>
   5 if (window.testRunner) {
   6     testRunner.dumpAsText();
   7 }
   8
   9 var style = target.style;
  10 function showFontLonghands(fontValue, suppressLonghandValue)
  11 {
  12     output.textContent += 'Longhands for font: ' + fontValue + '\n';
  13     style.font = '';
  14     style.font = fontValue;
  15     for (var i = 0; i < style.length; i++) {
  16         output.textContent += style[i];
  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 platform specific.
  36 // Platform specific system font styles are covered in fast/css/css2-system-fonts.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);
  46
  47 // Invalid values should yield no longhands.
  48 showFontLonghands('italic small-caps bold 12px/24px');
  49 showFontLonghands('italic small-caps bold 12px');
  50 showFontLonghands('italic small-caps bold /12px serif');
  51 showFontLonghands('italic small-caps small-caps 12px serif');
  52 showFontLonghands('italic italic small-caps bold 12px serif');
  53 showFontLonghands('12px/italic serif');
  54 showFontLonghands("caption italic");
  55 showFontLonghands("icon 12px");
  56 showFontLonghands("icon 12px serif");
  57 showFontLonghands("menu italic 12px");
  58 </script>