Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(144)

Side by Side Diff: third_party/WebKit/LayoutTests/svg/text/bidi-text-query.svg

Issue 1847763002: Only synthesize grapheme widths once for surrogate pair characters (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Address reviewer comments Created 4 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <?xml version="1.0" encoding="utf-8"?> 1 <?xml version="1.0" encoding="utf-8"?>
2 <svg width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/ 2000/svg"> 2 <svg width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2 000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
3 <g font-family="Arial" font-size="18"> 3 <style>
4 <text x="10" y="50"><tspan direction="ltr" unicode-bidi="bidi-override">نشاط التدويل، W3C</tspan></text> 4 .testTextRun {
5 <text x="10" y="80"><tspan direction="ltr" unicode-bidi="normal">نشاط التدوي ل، W3C</tspan></text> 5 font-family: Arial;
6 <text x="10" y="110" text-anchor="end" direction="rtl">W3C <tspan>نشاط التدو يل،</tspan></text> 6 font-size: 18px;
7 <g id="container"/> 7 }
8 #highlightContainer rect {
9 fill-opacity: 0.4;
10 }
11 #highlightContainer text {
12 font-family: Arial;
13 font-size: 4px;
14 }
15 </style>
8 16
9 <script type="text/javascript"><![CDATA[ 17 <text x="10" y="50" class="testTextRun"><tspan direction="ltr" unicode-bidi= "bidi-override">نشاط التدويل، W3C</tspan></text>
10 function highlightGlyph(text, index, color) { 18 <text x="10" y="80" class="testTextRun"><tspan direction="ltr" unicode-bidi= "normal">نشاط التدويل، W3C</tspan></text>
11 var extent = text.getExtentOfChar(index); 19 <text x="10" y="110" class="testTextRun" text-anchor="end" direction="rtl">W 3C <tspan>نشاط التدويل،</tspan></text>
20 <g id="highlightContainer"/>
12 21
13 // Highlight rect that we've selected using the extent information 22 <script xlink:href="resources/highlightGlyphs.js"></script>
14 var rectElement = document.createElementNS("http://www.w3.org/2000/s vg", "rect"); 23 <script>
15 rectElement.setAttribute("x", extent.x); 24 highlightGlyphs(document.querySelectorAll('.testTextRun'), document.getE lementById('highlightContainer'));
16 rectElement.setAttribute("y", extent.y); 25 </script>
17 rectElement.setAttribute("width", extent.width);
18 rectElement.setAttribute("height", extent.height);
19 rectElement.setAttribute("fill-opacity", "0.4");
20 rectElement.setAttribute("fill", color);
21 document.getElementById("container").appendChild(rectElement);
22 // Output the start offset
23 var textElement = document.createElementNS("http://www.w3.org/2000/s vg", "text");
24 textElement.setAttribute("x", extent.x + extent.width / 2);
25 textElement.setAttribute("y", extent.y + extent.height + 5);
26 textElement.setAttribute("text-anchor", "middle");
27 textElement.setAttribute("font-size", 4);
28 textElement.appendChild(document.createTextNode(index));
29 document.getElementById("container").appendChild(textElement);
30 }
31
32 var colors = [ "red", "orange", "yellow", "green", "blue", "indigo", "vi olet"];
33
34 // Highlight each glyph with a semi-transparent rectangle and
35 // a number corresponding to the queried character index.
36 var textElements = document.querySelectorAll("text");
37 for (var elemNum = 0; elemNum < textElements.length; ++elemNum) {
38 var text = textElements[elemNum];
39 var charCount = text.getNumberOfChars();
40 for (var index = 0; index < charCount; ++index)
41 highlightGlyph(text, index, colors[index % colors.length]);
42 }
43 ]]></script>
44 </g>
45 </svg> 26 </svg>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698