| <html> |
| <head> |
| <script src="../http/tests/inspector/inspector-test.js"></script> |
| <script src="utilities-test.js"></script> |
| <script> |
| function test() |
| { |
| function dumpTextNodesAsString(node) |
| { |
| var result = ""; |
| function dumpTextNode(node) |
| { |
| var str = node.textContent; |
| if (node.parentElement.className) |
| result += "[" + str + "]"; |
| else |
| result += str; |
| }; |
| |
| function dumpElement(element) |
| { |
| for (var i = 0; i < element.childNodes.length; i++) |
| dumpNode(element.childNodes[i]); |
| } |
| |
| function dumpNode(node) |
| { |
| if (node.nodeType === Node.TEXT_NODE) |
| dumpTextNode(node); |
| else if (node.nodeType === Node.ELEMENT_NODE) |
| dumpElement(node); |
| }; |
| |
| dumpNode(node); |
| |
| return result; |
| } |
| |
| function performTestForElement(element, ranges) |
| { |
| var changes = []; |
| InspectorTest.addResult("--------- Running test: ----------"); |
| WebInspector.highlightRangesWithStyleClass(element, ranges, "highlighted", changes); |
| InspectorTest.addResult("After highlight: " + dumpTextNodesAsString(element)); |
| WebInspector.revertDomChanges(changes); |
| InspectorTest.addResult("After revert: " + dumpTextNodesAsString(element)); |
| WebInspector.applyDomChanges(changes); |
| InspectorTest.addResult("After apply: " + dumpTextNodesAsString(element)); |
| } |
| |
| function textElement(strings) |
| { |
| var element = document.createElement("div"); |
| for (var i = 0; i < strings.length; i++) { |
| var span = document.createElement("span"); |
| span.textContent = strings[i]; |
| element.appendChild(span); |
| } |
| return element; |
| } |
| |
| function range(offset, length) |
| { |
| var result = {}; |
| result.offset = offset; |
| result.length = length; |
| return result; |
| } |
| |
| performTestForElement(textElement(["function"]), [range(0, 8)]); // Highlight whole text node. |
| performTestForElement(textElement(["function"]), [range(0, 7)]); // Highlight only text node beginning. |
| performTestForElement(textElement(["function"]), [range(1, 7)]); // Highlight only text node ending. |
| performTestForElement(textElement(["function"]), [range(1, 6)]); // Highlight in the middle of text node. |
| |
| performTestForElement(textElement(["function", " ", "functionName"]), [range(0, 21)]); // Highlight all text in 3 text nodes. |
| performTestForElement(textElement(["function", " ", "functionName"]), [range(0, 20)]); // Highlight all text in 3 text nodes except for the last character. |
| performTestForElement(textElement(["function", " ", "functionName"]), [range(1, 20)]); // Highlight all text in 3 text nodes except for the first character. |
| performTestForElement(textElement(["function", " ", "functionName"]), [range(1, 19)]); // Highlight all text in 3 text nodes except for the first and the last characters. |
| performTestForElement(textElement(["function", " ", "functionName"]), [range(7, 3)]); // Highlight like that "functio[n f]unctionName" |
| |
| performTestForElement(textElement(["function", " ", "functionName"]), [range(0, 1), range(8, 1), range(9, 1)]); // Highlight first characters in text nodes. |
| performTestForElement(textElement(["function", " ", "functionName"]), [range(7, 1), range(8, 1), range(20, 1)]); // Highlight last characters in text node. |
| performTestForElement(textElement(["function", " ", "functionName"]), [range(0, 1), range(7, 3), range(20, 1)]); // Highlight like that: "[f]unctio[n f]unctionNam[e]" |
| InspectorTest.completeTest(); |
| } |
| </script> |
| </head> |
| <body onload="runTest()"> |
| <p>Tests how utilities functions highlight text and then revert/re-apply highlighting changes.</p> |
| <a href="https://bugs.webkit.org/show_bug.cgi?id=70244">Bug 70244</a> |
| </body> |
| </html> |
