Codebase Browser
chromium
Go to App

chromium/third_party/blink/web_tests/svg/text/surrogate-pair-queries.html 

<!DOCTYPE HTML>
<meta charset="utf8">
<style>
    .testTextRun {
        font-size: 35px;
    }
</style>
<svg width="600px" height="500px" xmlns="http://www.w3.org/2000/svg">
    <g id="highlightContainer"/>

    <!-- Two surrogate pairs -->
    <text x="50" y="50" class="testTextRun" font-family="cursive">&#x1f3b6;&#x1f3b6;</text>
    <text x="200" y="50" class="testTextRun" font-family="serif">&#x1f3b6;&#x1f3b6;</text>
    <text x="350" y="50" class="testTextRun" font-family="sans-serif">&#x1f3b6;&#x1f3b6;</text>

    <!-- Surrogate pair with a combining diacritic -->
    <text x="50" y="125" class="testTextRun" font-family="cursive">&#x10437;&#x030c; v&#x030c;</text>
    <text x="200" y="125" class="testTextRun" font-family="serif">&#x10437;&#x030c; v&#x030c;</text>
    <text x="350" y="125" class="testTextRun" font-family="sans-serif">&#x10437;&#x030c; v&#x030c;</text>

    <!-- Surrogate pair with a combining diacritic in RTL -->
    <text x="150" y="250" class="testTextRun" direction="rtl" font-family="cursive">&#x1f3b6;&#x10437;&#x030c;&#x1f3b6;</text>
    <text x="300" y="250" class="testTextRun" direction="rtl" font-family="serif">&#x1f3b6;&#x10437;&#x030c;&#x1f3b6;</text>
    <text x="450" y="250" class="testTextRun" direction="rtl" font-family="sans-serif">&#x1f3b6;&#x10437;&#x030c;&#x1f3b6;</text>

    <!-- Surrogate pair with a combining diacritic in RTL with override -->
    <text x="150" y="350" class="testTextRun" direction="rtl" unicode-bidi="bidi-override" font-family="cursive">&#x1f3b6;&#x10437;&#x030c;&#x1f3b6;</text>
    <text x="300" y="350" class="testTextRun" direction="rtl" unicode-bidi="bidi-override" font-family="serif">&#x1f3b6;&#x10437;&#x030c;&#x1f3b6;</text>
    <text x="450" y="350" class="testTextRun" direction="rtl" unicode-bidi="bidi-override" font-family="sans-serif">&#x1f3b6;&#x10437;&#x030c;&#x1f3b6;</text>
</svg>
<script src="resources/highlightGlyphs.js"></script>
<script>
    highlightGlyphs(document.querySelectorAll('.testTextRun'), highlightContainer);
</script>