third_party/WebKit/LayoutTests/fast/text/atsui-spacing-features.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   2 "http://www.w3.org/TR/html4/loose.dtd">
   3 <html>
   4 <head>
   5 <title>ATSUI spacing features</title>
   6 <style type="text/css">
   7 div.test { width: 200px; border: solid blue 1px; margin-bottom: 5px; }
   8 div.rtl { direction: rtl; font-family: 'Lucida Grande'; line-height: 18px; }
   9 div.ref { width: 200px; border: solid green 1px; }
  10 div.word { word-spacing: 10px; }
  11 div.letter { letter-spacing: 5px; }
  12 div.justify { text-align: justify; }
  13 </style>
  14 </head>
  15 <body>
  16 <p>
  17 Test for regressions against <i><a href="https://bugs.webkit.org/show_bug.cgi?id=3922">http://bugzilla.opendarwin.org/show_bug.cgi?id=3922</a> Variable word/letter spacing and full justification not supported for ATSUI-rendered text</i>.
  18 </p>
  19 Each green box should be identical to the blue box it follows, except for accents.
  20 <hr>
  21 <table>
  22 <tr style="text-align: center;">
  23 <td>Word spacing</td>
  24 <td>Letter spacing</td>
  25 <td>Justification</td>
  26 </tr>
  27 <tr style="vertical-align: top;">
  28 <td>
  29 <div class="word">
  30 <div class="test rtl">
  31 &#x05d9;&#x05b0;&#x05d4;&#x05b4;&#x05d9;,
  32 &#x05d0;&#x05b8;&#x05d7;&#x05b4;&#x05d9;,
  33 &#x05dc;&#x05b0;&#x05da;&#x05b8;
  34 &#x05e1;&#x05b5;&#x05e4;&#x05b6;&#x05e8;
  35 &#x05e9;&#x05c1;&#x05b0;&#x05dc;&#x05b7;&#x05d7;&#x05b0;&#x05ea;&#x05bc;&#x05b4;&#x05d9;&#x05d5;
  36 &#x05d5;&#x05bc;&#x05de;&#x05b4;&#x05de;&#x05b0;&#x05db;&#x05bc;&#x05b6;&#x05e8;&#x05b6;&#x05ea;
  37 &#x05e6;&#x05b0;&#x05de;&#x05b4;&#x05d9;&#x05ea;&#x05d5;&#x05bc;&#x05ea;
  38 &#x05dc;&#x05b8;&#x05da;&#x05b0;
  39 &#x05de;&#x05b0;&#x05db;&#x05b7;&#x05e8;&#x05b0;&#x05ea;&#x05bc;&#x05b4;&#x05d9;&#x05d5;.
  40 </div>
  41 <div class="test">
  42 Lore&#x0300;m ipsum dolor sit ame&#x0300;t, consectetuer adipiscing e&#x0300;lit.
  43 </div>
  44 <div class="ref">
  45 Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
  46 </div>
  47 </div>
  48 </td>
  49 <td>
  50 <div class="letter">
  51 <div class="test rtl">
  52 &#x05d9;&#x05b0;&#x05d4;&#x05b4;&#x05d9;,
  53 &#x05d0;&#x05b8;&#x05d7;&#x05b4;&#x05d9;,
  54 &#x05dc;&#x05b0;&#x05da;&#x05b8;
  55 &#x05e1;&#x05b5;&#x05e4;&#x05b6;&#x05e8;
  56 &#x05e9;&#x05c1;&#x05b0;&#x05dc;&#x05b7;&#x05d7;&#x05b0;&#x05ea;&#x05bc;&#x05b4;&#x05d9;&#x05d5;
  57 &#x05d5;&#x05bc;&#x05de;&#x05b4;&#x05de;&#x05b0;&#x05db;&#x05bc;&#x05b6;&#x05e8;&#x05b6;&#x05ea;
  58 &#x05e6;&#x05b0;&#x05de;&#x05b4;&#x05d9;&#x05ea;&#x05d5;&#x05bc;&#x05ea;
  59 &#x05dc;&#x05b8;&#x05da;&#x05b0;
  60 &#x05de;&#x05b0;&#x05db;&#x05b7;&#x05e8;&#x05b0;&#x05ea;&#x05bc;&#x05b4;&#x05d9;&#x05d5;.
  61 </div>
  62 <div class="test">
  63 Lore&#x0300;m ipsum dolor sit ame&#x0300;t, consectetue&#x0300;r adipiscing e&#x0300;lit.
  64 </div>
  65 <div class="ref">
  66 Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
  67 </div>
  68 </div>
  69 </td>
  70 <td>
  71 <div class="justify">
  72 <div class="test rtl">
  73 &#x05d9;&#x05b0;&#x05d4;&#x05b4;&#x05d9;,
  74 &#x05d0;&#x05b8;&#x05d7;&#x05b4;&#x05d9;,
  75 &#x05dc;&#x05b0;&#x05da;&#x05b8;
  76 &#x05e1;&#x05b5;&#x05e4;&#x05b6;&#x05e8;
  77 &#x05e9;&#x05c1;&#x05b0;&#x05dc;&#x05b7;&#x05d7;&#x05b0;&#x05ea;&#x05bc;&#x05b4;&#x05d9;&#x05d5;
  78 &#x05d5;&#x05bc;&#x05de;&#x05b4;&#x05de;&#x05b0;&#x05db;&#x05bc;&#x05b6;&#x05e8;&#x05b6;&#x05ea;
  79 &#x05e6;&#x05b0;&#x05de;&#x05b4;&#x05d9;&#x05ea;&#x05d5;&#x05bc;&#x05ea;
  80 &#x05dc;&#x05b8;&#x05da;&#x05b0;
  81 &#x05de;&#x05b0;&#x05db;&#x05b7;&#x05e8;&#x05b0;&#x05ea;&#x05bc;&#x05b4;&#x05d9;&#x05d5;.
  82 </div>
  83 <div class="test">
  84 Lore&#x0300;m ipsum dolor sit ame&#x0300;t, consectetue&#x0300;r adipiscing e&#x0300;lit.
  85 </div>
  86 <div class="ref">
  87 Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
  88 </div>
  89 </div>
  90 </td>
  91 </tr>
  92 </table>
  93 </body>
  94 </html>