dom/svg/test/test_text.html

   1 <!DOCTYPE html>
   2 <html xmlns="http://www.w3.org/1999/xhtml">
   3 <!--
   4 https://bugzilla.mozilla.org/show_bug.cgi?id=392233
   5 -->
   6 <head>
   7   <title>Test for Bug 392233</title>
   8   <script src="/tests/SimpleTest/SimpleTest.js"></script>
   9   <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
  10 </head>
  11 <body>
  12 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=392233">Mozilla Bug 392233</a>
  13 <p id="display"></p>
  14 <div id="content" style="display: none"></div>
  15
  16 <iframe id="svg" src="text-helper.svg"></iframe>
  17
  18 <pre id="test">
  19 <script class="testbody" type="application/javascript">
  20 SimpleTest.waitForExplicitFinish();
  21
  22 function runTest() {
  23   var doc = $("svg").contentWindow.document;
  24   var text1 = doc.getElementById("text1");
  25   var text2 = doc.getElementById("text2");
  26   var text3 = doc.getElementById("text3");
  27   var text4 = doc.getElementById("text4");
  28
  29   var charWidth = text1.getSubStringLength(0, 1);
  30
  31   function isPoint(pt1, x, y, str) {
  32     is(pt1.x, x, str + " x");
  33     is(pt1.y, y, str + " y");
  34   }
  35
  36   function isPointFuzzy(pt1, x, y, str) {
  37     isfuzzy(pt1.x, x, 0.05, str + " x");
  38     isfuzzy(pt1.y, y, 0.05, str + " y");
  39   }
  40
  41   function ymost(r) {
  42     return r.y + r.height;
  43   }
  44
  45   function xmost(r) {
  46     return r.x + r.width;
  47   }
  48
  49   var p = text1.getStartPositionOfChar(0);
  50
  51   // Simple horizontal string
  52
  53   is(text1.getNumberOfChars(), 3, "text1 length");
  54   ok(text1.getComputedTextLength() > 0, "text1 measured length");
  55   is(text1.getComputedTextLength(), text1.getSubStringLength(0, 3), "text1 substring length");
  56   isPoint(text1.getStartPositionOfChar(0), 5, 25, "text1 char 0 start offset");
  57   isPointFuzzy(text1.getStartPositionOfChar(1), 5 + charWidth, 25, "text1 char 1 start offset");
  58   isPointFuzzy(text1.getStartPositionOfChar(2), 5 + 2 * charWidth, 25, "text1 char 2 start offset");
  59   isPointFuzzy(text1.getEndPositionOfChar(0), 5 + charWidth, 25, "text1 char 0 end offset");
  60   isPointFuzzy(text1.getEndPositionOfChar(1), 5 + 2 * charWidth, 25, "text1 char 1 end offset");
  61   isPointFuzzy(text1.getEndPositionOfChar(2), 5 + 3 * charWidth, 25, "text1 char 2 end offset");
  62   isfuzzy(text1.getExtentOfChar(0).x, 5, 0.01, "text1 char 0 extent x");
  63   is(text1.getExtentOfChar(0).width, text1.getSubStringLength(0, 1), "text1 char 0 extent width");
  64   ok(text1.getExtentOfChar(0).y < 25, "text1 char 0 extent y");
  65   ok(ymost(text1.getExtentOfChar(0)) > 25, "text1 char 0 extent height");
  66   isfuzzy(text1.getExtentOfChar(1).x, 5 + charWidth, 0.01, "text1 char 1 extent x");
  67   is(text1.getExtentOfChar(1).width, text1.getSubStringLength(0, 1), "text1 char 1 extent width");
  68   is(text1.getExtentOfChar(1).y, text1.getExtentOfChar(0).y, "text1 char 0/1 extent y");
  69   is(text1.getExtentOfChar(1).height, text1.getExtentOfChar(0).height, "text1 char 0/1 extent height");
  70   isfuzzy(text1.getExtentOfChar(2).x, 5 + 2 * charWidth, 0.02, "text1 char 2 extent x");
  71   is(text1.getExtentOfChar(2).width, text1.getSubStringLength(0, 1), "text1 char 2 extent width");
  72   is(text1.getExtentOfChar(2).y, text1.getExtentOfChar(0).y, "text1 char 0/2 extent y");
  73   is(text1.getExtentOfChar(2).height, text1.getExtentOfChar(0).height, "text1 char 0/2 extent height");
  74   is(text1.getRotationOfChar(0), 0, "text1 char 0 rotation");
  75   is(text1.getRotationOfChar(1), 0, "text1 char 0 rotation");
  76   is(text1.getRotationOfChar(2), 0, "text1 char 0 rotation");
  77   p.x = 5 + 0.1;
  78   p.y = 25;
  79   is(text1.getCharNumAtPosition(p), 0, "text1 finding char 0 left edge");
  80   p.x = 5 + charWidth - 0.1;
  81   is(text1.getCharNumAtPosition(p), 0, "text1 finding char 0 on right");
  82   p.x = 5 - 0.1;
  83   is(text1.getCharNumAtPosition(p), -1, "text1 finding no char on left");
  84   p.x = 5 + 0.1;
  85   p.y = text1.getExtentOfChar(0).y - 0.1;
  86   is(text1.getCharNumAtPosition(p), -1, "text1 finding no char on top");
  87   p.y = text1.getExtentOfChar(0).y + 0.1;
  88   is(text1.getCharNumAtPosition(p), 0, "text1 finding char 0 top edge");
  89   p.x = 5 + 3 * charWidth - 0.1;
  90   is(text1.getCharNumAtPosition(p), 2, "text1 finding char 2 top edge");
  91   p.x = 5 + 3 * charWidth + 0.1;
  92   is(text1.getCharNumAtPosition(p), -1, "text1 finding no char on right");
  93
  94   // Simple rotated-90 string ... width might change because of hinting
  95
  96   charWidth = text2.getSubStringLength(0, 1);
  97
  98   is(text2.getNumberOfChars(), 3, "text2 length");
  99   ok(text2.getComputedTextLength() > 0, "text2 measured length");
 100   is(text2.getComputedTextLength(), text2.getSubStringLength(0, 3), "text2 substring length");
 101   isPointFuzzy(text2.getStartPositionOfChar(0), 100, 125, "text2 char 0 start offset");
 102   isPointFuzzy(text2.getStartPositionOfChar(1), 100, 125 + charWidth, "text2 char 1 start offset");
 103   isPointFuzzy(text2.getStartPositionOfChar(2), 100, 125 + 2 * charWidth, "text2 char 2 start offset");
 104   isPointFuzzy(text2.getEndPositionOfChar(0), 100, 125 + charWidth, "text2 char 0 end offset");
 105   isPointFuzzy(text2.getEndPositionOfChar(1), 100, 125 + 2 * charWidth, "text2 char 1 end offset");
 106   isPointFuzzy(text2.getEndPositionOfChar(2), 100, 125 + 3 * charWidth, "text2 char 2 end offset");
 107   isfuzzy(text2.getExtentOfChar(0).y, 125, 0.01, "text2 char 0 extent y");
 108   isfuzzy(text2.getExtentOfChar(0).height, charWidth, 0.000001, "text2 char 0 extent height");
 109   ok(text2.getExtentOfChar(0).width < 100, "text2 char 0 extent x");
 110   ok(xmost(text2.getExtentOfChar(0)) > 100, "text2 char 0 extent width");
 111   isfuzzy(text2.getExtentOfChar(1).y, 125 + charWidth, 0.01, "text2 char 1 extent x");
 112   isfuzzy(text2.getExtentOfChar(1).height, text2.getSubStringLength(0, 1), 0.000001, "text2 char 1 extent width");
 113   is(text2.getExtentOfChar(1).x, text2.getExtentOfChar(0).x, "text2 char 0/1 extent y");
 114   is(text2.getExtentOfChar(1).width, text2.getExtentOfChar(0).width, "text2 char 0/1 extent height");
 115   isfuzzy(text2.getExtentOfChar(2).y, 125 + 2 * charWidth, 0.01, "text2 char 2 extent x");
 116   isfuzzy(text2.getExtentOfChar(2).height, text2.getSubStringLength(0, 1), 0.000001, "text2 char 2 extent width");
 117   is(text2.getExtentOfChar(2).x, text2.getExtentOfChar(0).x, "text2 char 0/2 extent y");
 118   is(text2.getExtentOfChar(2).width, text2.getExtentOfChar(0).width, "text2 char 0/2 extent height");
 119   is(text2.getRotationOfChar(0), 90, "text2 char 0 rotation");
 120   is(text2.getRotationOfChar(1), 90, "text2 char 0 rotation");
 121   is(text2.getRotationOfChar(2), 90, "text2 char 0 rotation");
 122   p.y = 125 + 0.1;
 123   p.x = 100;
 124   is(text2.getCharNumAtPosition(p), 0, "text2 finding char 0 top edge");
 125   p.y = 125 + charWidth - 0.1;
 126   is(text2.getCharNumAtPosition(p), 0, "text2 finding char 0 on bottom");
 127   p.y = 125 - 0.1;
 128   is(text2.getCharNumAtPosition(p), -1, "text2 finding no char on top");
 129   p.y = 125 + 0.1;
 130   p.x = text2.getExtentOfChar(0).x - 0.1;
 131   is(text2.getCharNumAtPosition(p), -1, "text2 finding no char on left");
 132   p.x = text2.getExtentOfChar(0).x + 0.1;
 133   is(text2.getCharNumAtPosition(p), 0, "text2 finding char 0 left edge");
 134   p.y = 125 + 3 * charWidth - 0.1;
 135   is(text2.getCharNumAtPosition(p), 2, "text2 finding char 2 bottom edge");
 136   p.y = 1225 + 3 * charWidth + 0.1;
 137   is(text2.getCharNumAtPosition(p), -1, "text2 finding no char on bottom");
 138
 139   // Text along a thin rectangle path
 140
 141   charWidth = text3.getSubStringLength(0, 1);
 142
 143   is(text3.getNumberOfChars(), 26, "text3 length");
 144   ok(text3.getComputedTextLength() > 0, "text3 measured length");
 145   is(text3.getComputedTextLength(), text3.getSubStringLength(0, 26), "text3 substring length");
 146
 147   // character 12 should be on the bottom side
 148   is(text3.getStartPositionOfChar(12).y, 253, "text3 char 12 start offset");
 149   is(text3.getEndPositionOfChar(12).y, 253, "text3 char 12 end offset");
 150   ok(text3.getExtentOfChar(12).y < 253, "text3 char 12 extent y");
 151   ok(ymost(text3.getExtentOfChar(12)) > 253, "text3 char 12 extent height");
 152   isfuzzy(text3.getRotationOfChar(12), 180, 0.001, "text3 char 12 rotation");
 153   p.x = text3.getExtentOfChar(12).x + 0.1;
 154   p.y = ymost(text3.getExtentOfChar(12)) - 0.1;
 155   is(text3.getCharNumAtPosition(p), 12, "text3 finding char 12");
 156   // This next test is tricky. The glyph for character 3 may overlap from the above
 157   // but character 12 wins because it's the last to render
 158   p.y = text3.getExtentOfChar(12).y + 0.1;
 159   is(text3.getCharNumAtPosition(p), 12, "text3 finding last rendered char");
 160
 161   // character 25 should be beyond the end of the path
 162   // Not sure what should happen here. Currently we throw, which seems wrong
 163   // is(text3.getStartPositionOfChar(25).x, 0, "text3 char 25 start offset");
 164
 165   // Display:none string
 166
 167   is(text4.getNumberOfChars(), 0, "text4 length");
 168   is(text4.getComputedTextLength(), 0, "text4 measured length");
 169   is(text4.getSubStringLength(0, 3), 0, "text4 substring length");
 170   p = text1.getStartPositionOfChar(0);
 171   is(text4.getCharNumAtPosition(p), -1, "text4 shouldn't find rendered char");
 172 }
 173
 174 function runTests() {
 175   runTest();
 176
 177   var doc = $("svg").contentWindow.document;
 178   doc.getElementById("g").setAttribute("transform", "scale(2) rotate(90 200 200)");
 179
 180   runTest();
 181
 182   SimpleTest.finish();
 183 }
 184
 185 window.addEventListener("load", runTests);
 186 </script>
 187 </pre>
 188 </body>
 189 </html>