blob: b64348ad5f5d3e103f6979217f7b6ed6d1d068f6 [file] [log] [blame]
<!DOCTYPE HTML>
<meta charset="utf8">
<style>
.testTextRun {
font-size: 35px;
}
#highlightContainer rect {
fill-opacity: 0.3;
}
</style>
<svg width="600px" height="500px" xmlns="http://www.w3.org/2000/svg">
<g id="highlightContainer"/>
<!-- multiple combining diacritics in LTR -->
<text x="50" y="50" class="testTextRun" font-family="cursive">ab&#x030c;c&#x030c;&#x030c;</text>
<text x="200" y="50" class="testTextRun" font-family="serif">ab&#x030c;c&#x030c;&#x030c;</text>
<text x="350" y="50" class="testTextRun" font-family="sans-serif">ab&#x030c;c&#x030c;&#x030c;</text>
<!-- multiple combining diacritics in RTL -->
<text x="100" y="125" class="testTextRun" font-family="cursive" direction="rtl">&#8207;a&#8207;b&#x030c;&#8207;c&#x030c;&#x030c;</text>
<text x="250" y="125" class="testTextRun" font-family="serif" direction="rtl">&#8207;a&#8207;b&#x030c;&#8207;c&#x030c;&#x030c;</text>
<text x="400" y="125" class="testTextRun" font-family="sans-serif" direction="rtl">&#8207;a&#8207;b&#x030c;&#8207;c&#x030c;&#x030c;</text>
<!-- multiple combining diacritics on ligatures in LTR -->
<!-- MacOS has differences with multiple diacritics in cursive font family so this is skipped, see: https://crbug.com/669693. -->
<!-- <text x="50" y="200" class="testTextRun" font-family="cursive">fi&#x030c; ffi&#x030c;&#x030c;</text> -->
<text x="200" y="200" class="testTextRun" font-family="serif">fi&#x030c; ffi&#x030c;&#x030c;</text>
<text x="350" y="200" class="testTextRun" font-family="sans-serif">fi&#x030c; ffi&#x030c;&#x030c;</text>
<!-- combining diacritics on ligatures in mixed bidi runs -->
<text x="50" y="275" class="testTextRun" font-family="cursive">ff&#x030c;&#1600;&#1600;&#1604;&#1575;ff&#x030c;</text>
<text x="200" y="275" class="testTextRun" font-family="serif">ff&#x030c;&#1600;&#1600;&#1604;&#1575;ff&#x030c;</text>
<text x="350" y="275" class="testTextRun" font-family="sans-serif">ff&#x030c;&#1600;&#1600;&#1604;&#1575;ff&#x030c;</text>
<!-- combining diacritics which are wider than characters in mixed bidi runs -->
<text x="50" y="350" class="testTextRun" font-family="cursive"> &#x030c;&#64944;i&#819;</text>
<!-- Linux has differences with space width in the following two runs so a period is used as a workaround. -->
<text x="200" y="350" class="testTextRun" font-family="serif">.&#x030c;&#64944;i&#819;</text>
<text x="350" y="350" class="testTextRun" font-family="sans-serif">.&#x030c;&#64944;i&#819;</text>
</svg>
<script src="resources/highlightGlyphs.js"></script>
<script>
highlightGlyphs(document.querySelectorAll('.testTextRun'), highlightContainer);
</script>