third_party/WebKit/LayoutTests/svg/text/ligature-queries.html - Issue 1847763002: Only synthesize grapheme widths once for surrogate pair characters

Unified Diff: third_party/WebKit/LayoutTests/svg/text/ligature-queries.html

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, 9 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 side-by-side diff with in-line comments

Download patch

« no previous file with comments | « third_party/WebKit/LayoutTests/svg/text/combining-character-queries.html ('k') | third_party/WebKit/LayoutTests/svg/text/resources/highlightGlyphs.js » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

Index: third_party/WebKit/LayoutTests/svg/text/ligature-queries.html

diff --git a/third_party/WebKit/LayoutTests/svg/text/ligature-queries.html b/third_party/WebKit/LayoutTests/svg/text/ligature-queries.html

index 6e8596efb47336f3cc256e795a0f454e6c50de25..2eccc3ec11fa7f5bb4af556103c2d3b3e3ce144b 100644

--- a/third_party/WebKit/LayoutTests/svg/text/ligature-queries.html

+++ b/third_party/WebKit/LayoutTests/svg/text/ligature-queries.html

@@ -1,62 +1,29 @@

<!DOCTYPE HTML>

<style>

- .commonLigatures {

- font-variant-ligatures: common-ligatures;

+ .testTextRun {

+ font-size: 50px;

}

- .noselect {

- -webkit-user-select: none;

- user-select: none;

+ #highlightContainer text {

+ font-size: 10px;

}

</style>

<defs>

- <path id="path" d="M 25 400 C 300 400 200 200 500 450" />

+ <path id="path" d="M 25 400 C 300 400 200 200 500 450"/>

</defs>

- <g id="container"/>

- <g font-family="Arial" font-size="50px">

- <text x="25" y="50" class="commonLigatures" font-family="cursive">öh у̌eah! fi ffi abcffidef</text>

- <text x="25" y="150" class="commonLigatures" font-family="serif">öh у̌eah! fi ffi abcffidef</text>

- <text x="25" y="250" class="commonLigatures" font-family="sans-serif">öh у̌eah! fi ffi abcffidef</text>

- <use xlink:href="#path" stroke-width="2" stroke="black" fill="transparent"/>

- <text x="25" y="350" class="commonLigatures" font-family="cursive">

- <textPath xlink:href="#path">ffiffiffiffiffiffiffiffiffiffiffi</textPath>

- </text>

- </g>

+ <g id="highlightContainer"/>

+ <text x="25" y="50" class="testTextRun" font-family="cursive">öh у̌eah! fi ffi abcffidef</text>

+ <text x="25" y="150" class="testTextRun" font-family="serif">öh у̌eah! fi ffi abcffidef</text>

+ <text x="25" y="250" class="testTextRun" font-family="sans-serif">öh у̌eah! fi ffi abcffidef</text>

+ <use xlink:href="#path" stroke-width="2" stroke="black" fill="transparent"/>

+ <text x="25" y="350" class="testTextRun" font-family="cursive">

+ <textPath xlink:href="#path">ffiffiffiffiffiffiffiffiffiffiffi</textPath>

+ </text>

</svg>

+<script src="resources/highlightGlyphs.js"></script>

- function highlightGlyph(text, index, color) {

- var extent = text.getExtentOfChar(index);

- // Highlight rect that we've selected using the extent information

- var rectElement = document.createElementNS("http://www.w3.org/2000/svg", "rect");

- rectElement.setAttribute("x", extent.x);

- rectElement.setAttribute("y", extent.y);

- rectElement.setAttribute("width", extent.width);

- rectElement.setAttribute("height", extent.height);

- rectElement.setAttribute("fill-opacity", "0.5");

- rectElement.setAttribute("fill", color);

- document.getElementById("container").appendChild(rectElement);

- // Output the start offset

- var textElement = document.createElementNS("http://www.w3.org/2000/svg", "text");

- textElement.setAttribute("x", extent.x + extent.width / 2);

- textElement.setAttribute("y", extent.y + extent.height + 5);

- textElement.setAttribute("text-anchor", "middle");

- textElement.setAttribute("font-size", 10);

- textElement.setAttribute("class", "noselect");

- textElement.appendChild(document.createTextNode(index));

- document.getElementById("container").appendChild(textElement);

- }

- var colors = ["red", "orange", "yellow", "green", "blue", "indigo", "violet"];

- // Highlight each glyph with a semi-transparent rectangle and

- // a number corresponding to the queried character index.

- var textElements = document.querySelectorAll("text");

- for (var elemNum = 0; elemNum < textElements.length; ++elemNum) {

- var text = textElements[elemNum];

- var charCount = text.getNumberOfChars();

- for (var index = 0; index < charCount; ++index)

- highlightGlyph(text, index, colors[index % colors.length]);

- }

+ highlightGlyphs(document.querySelectorAll('.testTextRun'), highlightContainer);

</script>