<head>
<meta name="content-type" content="text/html; charset=UTF-8">
<style>
body { margin-top: 0; }
select { display: block; font-size: 13px; }
div#reference { font: 13px 'Lucida Grande'; text-align: center; height: 24px; }
</style>
<script>
function setTitle(text)
{
document.title = text;
document.getElementById("reference").innerHTML = text;
}
</script>
</head>
<body>
<div id="reference"></div>
<p>
This tests drawing bidirectional text in Windows Safari chrome.
</p>
<p>
Select each item from the list and verify that the window title is
rendered exactly like the selected item.
Pay attention to the ordering of
the characters, the direction of parentheses, diacritics and combining marks,
and shaping of Arabic letters. You can ignore small differences in the overall width
of the text.
For your convenience, the
text to match will be displayed at the top of the window.
</p>
<select onchange="setTitle(item(selectedIndex).innerText)" size="9">
<option>
First שניה (03) רביעית fifth
</option>
<option>
‫First שניה (03) רביעית fifth‬
</option>
<option>
‭First שניה (03) רביעית fifth‬
</option>
<option>
‮First שניה (03) רביעית fifth‬
</option>
<option>
משהו עם נִקּוּד
</option>
<option>
اللغة العربية
</option>
<option>
Et volià: ATSUI!
</option>
<option>
Directional ‮overrides‬ are confusing.
</option>
<option>
She said “‫יש TNT במזוודה!‬” and ran off
</option>
</select>
</body>
</html>