gecko-dev/dom/base/test/test_getTranslationNodes.html

228 lines
5.8 KiB
HTML

<!DOCTYPE HTML>
<html>
<head>
<title>Test for nsIDOMWindowUtils.getTranslationNodes</title>
<script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
</head>
<body onload="runTest()">
<script type="application/javascript">
var utils = SpecialPowers.wrap(window).
QueryInterface(SpecialPowers.Ci.nsIInterfaceRequestor).
getInterface(SpecialPowers.Ci.nsIDOMWindowUtils);
function testTranslationRoot(rootNode) {
var translationNodes = utils.getTranslationNodes(rootNode);
var expectedResult = rootNode.getAttribute("expected");
var expectedLength = expectedResult.split(" ").length;
is(translationNodes.length, expectedLength,
"Correct number of translation nodes for testcase " + rootNode.id);
var resultList = [];
for (var i = 0; i < translationNodes.length; i++) {
var node = translationNodes.item(i).localName;
if (translationNodes.isTranslationRootAtIndex(i)) {
node += "[root]"
}
resultList.push(node);
}
is(resultList.length, translationNodes.length,
"Correct number of translation nodes for testcase " + rootNode.id);
is(resultList.join(" "), expectedResult,
"Correct list of translation nodes for testcase " + rootNode.id);
}
function runTest() {
isnot(utils, null, "nsIDOMWindowUtils");
var testcases = document.querySelectorAll("div[expected]");
for (var testcase of testcases) {
testTranslationRoot(testcase);
}
var testiframe = document.getElementById("testiframe");
var iframediv = testiframe.contentDocument.querySelector("div");
try {
var foo = utils.getTranslationNodes(iframediv);
ok(false, "Cannot use a node from a different document");
} catch (e) {
is(e.name, "WrongDocumentError", "Cannot use a node from a different document");
}
SimpleTest.finish();
}
SimpleTest.waitForExplicitFinish();
</script>
<!-- Test that an inline element inside a root is not a root -->
<div id="testcase1"
expected="div[root] span">
<div>
lorem ipsum <span>dolor</span> sit amet
</div>
</div>
<!-- Test that a usually inline element becomes a root if it is
displayed as a block -->
<div id="testcase2"
expected="div[root] span[root]">
<div>
lorem ipsum <span style="display: block;">dolor</span> sit amet
</div>
</div>
<!-- Test that the content-less <div> is ignored and only the
<p> with content is returned -->
<div id="testcase3"
expected="p[root]">
<div>
<p>lorem ipsum</p>
</div>
</div>
<!-- Test that an inline element which the parent is not a root
becomes a root -->
<div id="testcase4"
expected="span[root]">
<div>
<span>lorem ipsum</span>
</div>
</div>
<!-- Test siblings -->
<div id="testcase5"
expected="li[root] li[root]">
<ul>
<li>lorem</li>
<li>ipsum</li>
</ul>
</div>
<!-- Test <ul> with content outside li -->
<div id="testcase6"
expected="ul[root] li[root] li[root]">
<ul>Lorem
<li>lorem</li>
<li>ipsum</li>
</ul>
</div>
<!-- Test inline siblings -->
<div id="testcase7"
expected="ul[root] li li">
<ul>Lorem
<li style="display: inline">lorem</li>
<li style="display: inline">ipsum</li>
</ul>
</div>
<!-- Test inline siblings becoming roots -->
<div id="testcase8"
expected="li[root] li[root]">
<ul>
<li style="display: inline">lorem</li>
<li style="display: inline">ipsum</li>
</ul>
</div>
<!-- Test that nodes with only punctuation, whitespace
or numbers are ignored -->
<div id="testcase9"
expected="li[root] li[root]">
<ul>
<li>lorem</li>
<li>ipsum</li>
<li>-.,;'/!@#$%^*()</li>
<li>0123456789</li>
<li>
</li>
</ul>
</div>
<!-- Test paragraphs -->
<div id="testcase10"
expected="p[root] a b p[root] a b">
<p>Lorem ipsum <a href="a.htm">dolor</a> sit <b>amet</b>, consetetur</p>
<p>Lorem ipsum <a href="a.htm">dolor</a> sit <b>amet</b>, consetetur</p>
</div>
<!-- Test that a display:none element is not ignored -->
<div id="testcase11"
expected="p[root] a b">
<p>Lorem ipsum <a href="a.htm">dolor</a> sit <b style="display:none">amet</b>, consetetur</p>
</div>
<!-- Test that deep nesting does not cause useless content to be returned -->
<div id="testcase12"
expected="p[root]">
<div>
<div>
<div>
<p>Lorem ipsum</p>
</div>
</div>
</div>
</div>
<!-- Test that deep nesting does not cause useless content to be returned -->
<div id="testcase13"
expected="div[root] p[root]">
<div>Lorem ipsum
<div>
<div>
<p>Lorem ipsum</p>
</div>
</div>
</div>
</div>
<!-- Test that non-html elements and elements that usually have non-translatable
content are ignored -->
<div id="testcase14"
expected="div[root]">
<div>
Lorem Ipsum
<noscript>Lorem Ipsum</noscript>
<style>.dummyClass { color: blue; }</style>
<script> /* script tag */ </script>
<code> code </code>
<iframe id="testiframe"
src="data:text/html,<div>Lorem ipsum</div>">
</iframe>
<svg>lorem</svg>
<math>ipsum</math>
</div>
</div>
<!-- Test that nesting of inline elements won't produce roots as long as
the parents are in the list of translation nodes -->
<div id="testcase15"
expected="p[root] a b span em">
<p>Lorem <a>ipsum <b>dolor <span>sit</span> amet</b></a>, <em>consetetur</em></p>
</div>
<!-- Test that comment nodes are not considered for translation -->
<div id="testcase16"
expected="p[root] p[root]">
<p>Lorem ipsum</p>
<div> <!-- Comment --> </div>
<p>Lorem ipsum</p>
</div>
<!-- Test that comment nodes are not considered for translation -->
<div id="testcase17"
expected="p[root]">
<div>
<!-- Comment -->
<p>Lorem Ipsum</p>
</div>
</div>
</body>
</html>