<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body style="direction:rtl">
<P style="direction:ltr; text-align:right">Test rendering of 3 text runs -- TextRun1 TextRun2 TextRun3,
in which TextRun1 and TextRun2's bidi level are 2, and TextRun3's bidi level is 1.
TextRun2 and TextRun3 are siblings. But their ancestor (not their parent) is a sibling of TextRun1.
The visual order should be TextRun3 TextRun1 TextRun2, not TextRun3 TextRun2 TextRun1.
<hr>
<P style="direction:ltr; text-align:right">Pure text. The following 3 lines should all display as "שנב This is a Test"
<div contentEditable="true" style="background:red;">This is a <span><span>Test <span>שנב</span></span></span></div>
<div contentEditable="true" style="background:red;">This is a <span><span><span>Test <span>שנב</span></span></span></span></div>
<div>This is a <span>Test <span>שנב</span></span></div>
<hr>
<P style="direction:ltr; text-align:right">Text in <em>. The English text should be displayed as "This is a Test".
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><em><span></span>Test<span></span></em></span></div>
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><em>Test<span></span></em></span></div>
<div contenteditable style="background:red;">This is a <span style="text-decoration: underline;"><em>Test <span contenteditable>דמה</span></em></span></div>
<div>This is a <span style="text-decoration: underline;"><em><span></span>Test</em></span></div>
<div>This is a <span style="text-decoration: underline;"><em>Test</em></span></div>
<hr>
<P style="direction:ltr; text-align:right">Text in <strong>. The following lines should all display as "This is a Test".
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><strong><span></span>Test<span></span></strong></span></div>
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><strong>Test<span></span></strong></span></div>
<div>This is a <span style="text-decoration: underline;"><strong><span></span>Test</strong></span></div>
<div>This is a <span style="text-decoration: underline;"><strong>Test</strong></span></div>
<hr>
<P style="direction:ltr; text-align:right">Text in <i>. The following lines should all display as "This is a Test".
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><i><span></span>Test<span></span></i></span></div>
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><i>Test<span></span></i></span></div>
<div>This is a <span style="text-decoration: underline;"><i><span></span>Test</i></span></div>
<div>This is a <span style="text-decoration: underline;"><i>Test</i></span></div>
<hr>
<P style="direction:ltr; text-align:right">Text in <b>. The following lines should all display as "This is a Test".
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><b><span></span>Test<span></span></b></span></div>
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><b>Test<span></span></b></span></div>
<div>This is a <span style="text-decoration: underline;"><b><span></span>Test</b></span></div>
<div>This is a <span style="text-decoration: underline;"><b>Test</strong></span></div>
<hr>
<P style="direction:ltr; text-align:right">Text in <img>, <href>, <em>, <tr>. The following English text should all display as "This is a Test".
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><a href>Test<span><img src= d:/tmp/p1.png/></span></a></span></div>
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><a href>Test <span>שנב</span></a></span></div>
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><em>Test<a href></a></em></span></div>
<div contentEditable="true" style="background:red;">This is a <span style="text-decoration: underline;"><em>Test<span><img src= d:/tmp/p1.png/></span></em></span></div>
<div>This is a <span style="text-decoration: underline;"><a href>Test <span>again</span></a></span></div>
<div>This is a <span style="text-decoration: underline;"><em>Test<table><tr><td>a</td></tr></td></tr></table></em></span></div>
<hr>
<ul id="console" dir=ltr></ul>
<script>
if (window.internals)
internals.settings.setEditingBehavior("mac");
function log(str)
{
var li = document.createElement("li");
li.appendChild(document.createTextNode(str));
var console = document.getElementById("console");
console.appendChild(li);
}
function assertEqual(message, actual, expected)
{
if (actual != expected)
log("\n" + message + ": Failure, actual: " + actual + "; expected: " + expected);
else
log("\n" + message + ": Success");
}
var tests = document.getElementsByTagName('div');
var sel = getSelection();
for (var i = 0; i < tests.length; ++i) {
sel.collapse(tests[i],0);
sel.modify("move", "backward", "lineboundary");
sel.modify("extend", "forward", "word");
assertEqual("Test " + i + ": ", sel.toString(), "This");
}
</script>
</body>
</html>
Codebase Browser
chromium