summaryrefslogtreecommitdiffstats
path: root/dom/svg/test/test_text.html
blob: c1b99a9175196f52ab98702c58a033566e95a442 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<!--
https://bugzilla.mozilla.org/show_bug.cgi?id=392233
-->
<head>
  <title>Test for Bug 392233</title>
  <script src="/tests/SimpleTest/SimpleTest.js"></script>
  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=392233">Mozilla Bug 392233</a>
<p id="display"></p>
<div id="content" style="display: none"></div>

<iframe id="svg" src="text-helper.svg"></iframe>

<pre id="test">
<script class="testbody" type="application/javascript">
SimpleTest.waitForExplicitFinish();

function runTest() {
  var doc = $("svg").contentWindow.document;
  var text1 = doc.getElementById("text1");
  var text2 = doc.getElementById("text2");
  var text3 = doc.getElementById("text3");
  var text4 = doc.getElementById("text4");

  var charWidth = text1.getSubStringLength(0, 1);

  function isPoint(pt1, x, y, str) {
    is(pt1.x, x, str + " x");
    is(pt1.y, y, str + " y");
  }

  function isPointFuzzy(pt1, x, y, str) {
    isfuzzy(pt1.x, x, 0.05, str + " x");
    isfuzzy(pt1.y, y, 0.05, str + " y");
  }

  function ymost(r) {
    return r.y + r.height;
  }

  function xmost(r) {
    return r.x + r.width;
  }

  var p = text1.getStartPositionOfChar(0);

  // Simple horizontal string

  is(text1.getNumberOfChars(), 3, "text1 length");
  ok(text1.getComputedTextLength() > 0, "text1 measured length");
  is(text1.getComputedTextLength(), text1.getSubStringLength(0, 3), "text1 substring length");
  isPoint(text1.getStartPositionOfChar(0), 5, 25, "text1 char 0 start offset");
  isPointFuzzy(text1.getStartPositionOfChar(1), 5 + charWidth, 25, "text1 char 1 start offset");
  isPointFuzzy(text1.getStartPositionOfChar(2), 5 + 2 * charWidth, 25, "text1 char 2 start offset");
  isPointFuzzy(text1.getEndPositionOfChar(0), 5 + charWidth, 25, "text1 char 0 end offset");
  isPointFuzzy(text1.getEndPositionOfChar(1), 5 + 2 * charWidth, 25, "text1 char 1 end offset");
  isPointFuzzy(text1.getEndPositionOfChar(2), 5 + 3 * charWidth, 25, "text1 char 2 end offset");
  isfuzzy(text1.getExtentOfChar(0).x, 5, 0.01, "text1 char 0 extent x");
  is(text1.getExtentOfChar(0).width, text1.getSubStringLength(0, 1), "text1 char 0 extent width");
  ok(text1.getExtentOfChar(0).y < 25, "text1 char 0 extent y");
  ok(ymost(text1.getExtentOfChar(0)) > 25, "text1 char 0 extent height");
  isfuzzy(text1.getExtentOfChar(1).x, 5 + charWidth, 0.01, "text1 char 1 extent x");
  is(text1.getExtentOfChar(1).width, text1.getSubStringLength(0, 1), "text1 char 1 extent width");
  is(text1.getExtentOfChar(1).y, text1.getExtentOfChar(0).y, "text1 char 0/1 extent y");
  is(text1.getExtentOfChar(1).height, text1.getExtentOfChar(0).height, "text1 char 0/1 extent height");
  isfuzzy(text1.getExtentOfChar(2).x, 5 + 2 * charWidth, 0.02, "text1 char 2 extent x");
  is(text1.getExtentOfChar(2).width, text1.getSubStringLength(0, 1), "text1 char 2 extent width");
  is(text1.getExtentOfChar(2).y, text1.getExtentOfChar(0).y, "text1 char 0/2 extent y");
  is(text1.getExtentOfChar(2).height, text1.getExtentOfChar(0).height, "text1 char 0/2 extent height");
  is(text1.getRotationOfChar(0), 0, "text1 char 0 rotation");
  is(text1.getRotationOfChar(1), 0, "text1 char 0 rotation");
  is(text1.getRotationOfChar(2), 0, "text1 char 0 rotation");
  p.x = 5 + 0.1;
  p.y = 25;
  is(text1.getCharNumAtPosition(p), 0, "text1 finding char 0 left edge");
  p.x = 5 + charWidth - 0.1;
  is(text1.getCharNumAtPosition(p), 0, "text1 finding char 0 on right");
  p.x = 5 - 0.1;
  is(text1.getCharNumAtPosition(p), -1, "text1 finding no char on left");
  p.x = 5 + 0.1;
  p.y = text1.getExtentOfChar(0).y - 0.1;
  is(text1.getCharNumAtPosition(p), -1, "text1 finding no char on top");
  p.y = text1.getExtentOfChar(0).y + 0.1;
  is(text1.getCharNumAtPosition(p), 0, "text1 finding char 0 top edge");
  p.x = 5 + 3 * charWidth - 0.1;
  is(text1.getCharNumAtPosition(p), 2, "text1 finding char 2 top edge");
  p.x = 5 + 3 * charWidth + 0.1;
  is(text1.getCharNumAtPosition(p), -1, "text1 finding no char on right");

  // Simple rotated-90 string ... width might change because of hinting

  charWidth = text2.getSubStringLength(0, 1);

  is(text2.getNumberOfChars(), 3, "text2 length");
  ok(text2.getComputedTextLength() > 0, "text2 measured length");
  is(text2.getComputedTextLength(), text2.getSubStringLength(0, 3), "text2 substring length");
  isPointFuzzy(text2.getStartPositionOfChar(0), 100, 125, "text2 char 0 start offset");
  isPointFuzzy(text2.getStartPositionOfChar(1), 100, 125 + charWidth, "text2 char 1 start offset");
  isPointFuzzy(text2.getStartPositionOfChar(2), 100, 125 + 2 * charWidth, "text2 char 2 start offset");
  isPointFuzzy(text2.getEndPositionOfChar(0), 100, 125 + charWidth, "text2 char 0 end offset");
  isPointFuzzy(text2.getEndPositionOfChar(1), 100, 125 + 2 * charWidth, "text2 char 1 end offset");
  isPointFuzzy(text2.getEndPositionOfChar(2), 100, 125 + 3 * charWidth, "text2 char 2 end offset");
  isfuzzy(text2.getExtentOfChar(0).y, 125, 0.01, "text2 char 0 extent y");
  isfuzzy(text2.getExtentOfChar(0).height, charWidth, 0.000001, "text2 char 0 extent height");
  ok(text2.getExtentOfChar(0).width < 100, "text2 char 0 extent x");
  ok(xmost(text2.getExtentOfChar(0)) > 100, "text2 char 0 extent width");
  isfuzzy(text2.getExtentOfChar(1).y, 125 + charWidth, 0.01, "text2 char 1 extent x");
  isfuzzy(text2.getExtentOfChar(1).height, text2.getSubStringLength(0, 1), 0.000001, "text2 char 1 extent width");
  is(text2.getExtentOfChar(1).x, text2.getExtentOfChar(0).x, "text2 char 0/1 extent y");
  is(text2.getExtentOfChar(1).width, text2.getExtentOfChar(0).width, "text2 char 0/1 extent height");
  isfuzzy(text2.getExtentOfChar(2).y, 125 + 2 * charWidth, 0.01, "text2 char 2 extent x");
  isfuzzy(text2.getExtentOfChar(2).height, text2.getSubStringLength(0, 1), 0.000001, "text2 char 2 extent width");
  is(text2.getExtentOfChar(2).x, text2.getExtentOfChar(0).x, "text2 char 0/2 extent y");
  is(text2.getExtentOfChar(2).width, text2.getExtentOfChar(0).width, "text2 char 0/2 extent height");
  is(text2.getRotationOfChar(0), 90, "text2 char 0 rotation");
  is(text2.getRotationOfChar(1), 90, "text2 char 0 rotation");
  is(text2.getRotationOfChar(2), 90, "text2 char 0 rotation");
  p.y = 125 + 0.1;
  p.x = 100;
  is(text2.getCharNumAtPosition(p), 0, "text2 finding char 0 top edge");
  p.y = 125 + charWidth - 0.1;
  is(text2.getCharNumAtPosition(p), 0, "text2 finding char 0 on bottom");
  p.y = 125 - 0.1;
  is(text2.getCharNumAtPosition(p), -1, "text2 finding no char on top");
  p.y = 125 + 0.1;
  p.x = text2.getExtentOfChar(0).x - 0.1;
  is(text2.getCharNumAtPosition(p), -1, "text2 finding no char on left");
  p.x = text2.getExtentOfChar(0).x + 0.1;
  is(text2.getCharNumAtPosition(p), 0, "text2 finding char 0 left edge");
  p.y = 125 + 3 * charWidth - 0.1;
  is(text2.getCharNumAtPosition(p), 2, "text2 finding char 2 bottom edge");
  p.y = 1225 + 3 * charWidth + 0.1;
  is(text2.getCharNumAtPosition(p), -1, "text2 finding no char on bottom");

  // Text along a thin rectangle path

  charWidth = text3.getSubStringLength(0, 1);

  is(text3.getNumberOfChars(), 26, "text3 length");
  ok(text3.getComputedTextLength() > 0, "text3 measured length");
  is(text3.getComputedTextLength(), text3.getSubStringLength(0, 26), "text3 substring length");

  // character 12 should be on the bottom side
  is(text3.getStartPositionOfChar(12).y, 253, "text3 char 12 start offset");
  is(text3.getEndPositionOfChar(12).y, 253, "text3 char 12 end offset");
  ok(text3.getExtentOfChar(12).y < 253, "text3 char 12 extent y");
  ok(ymost(text3.getExtentOfChar(12)) > 253, "text3 char 12 extent height");
  isfuzzy(text3.getRotationOfChar(12), 180, 0.001, "text3 char 12 rotation");
  p.x = text3.getExtentOfChar(12).x + 0.1;
  p.y = ymost(text3.getExtentOfChar(12)) - 0.1;
  is(text3.getCharNumAtPosition(p), 12, "text3 finding char 12");
  // This next test is tricky. The glyph for character 3 may overlap from the above
  // but character 12 wins because it's the last to render
  p.y = text3.getExtentOfChar(12).y + 0.1;
  is(text3.getCharNumAtPosition(p), 12, "text3 finding last rendered char");

  // character 25 should be beyond the end of the path
  // Not sure what should happen here. Currently we throw, which seems wrong
  // is(text3.getStartPositionOfChar(25).x, 0, "text3 char 25 start offset");

  // Display:none string

  is(text4.getNumberOfChars(), 0, "text4 length");
  is(text4.getComputedTextLength(), 0, "text4 measured length");
  is(text4.getSubStringLength(0, 3), 0, "text4 substring length");
  p = text1.getStartPositionOfChar(0);
  is(text4.getCharNumAtPosition(p), -1, "text4 shouldn't find rendered char");
}

function runTests() {
  runTest();

  var doc = $("svg").contentWindow.document;
  doc.getElementById("g").setAttribute("transform", "scale(2) rotate(90 200 200)");

  runTest();

  SimpleTest.finish();
}

window.addEventListener("load", runTests);
</script>
</pre>
</body>
</html>