<!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>