| <html> |
| <head> |
| <script src="../../http/tests/inspector/inspector-test.js"></script> |
| <script src="../../http/tests/inspector/elements-test.js"></script> |
| <script src="./sass-test.js"></script> |
| <style> |
| pre { |
| font-family: monospace; |
| } |
| </style> |
| <script> |
| |
| function test() |
| { |
| InspectorTest.evaluateInPagePromise("getSASS()") |
| .then(result => InspectorTest.parseSCSS("", result.value)) |
| .then(ast => onAST(ast)) |
| .then(() => InspectorTest.completeTest()); |
| |
| function onAST(ast) |
| { |
| var text = ast.document.text; |
| var offsetToNode = new Map(); |
| ast.visit(onNode); |
| |
| function onNode(node) |
| { |
| if (!(node instanceof WebInspector.SASSSupport.TextNode)) |
| return; |
| var startOffset = text.offsetFromPosition(node.range.startLine, node.range.startColumn); |
| var endOffset = text.offsetFromPosition(node.range.endLine, node.range.endColumn); |
| for (var i = startOffset; i <= endOffset; ++i) |
| offsetToNode.set(i, node); |
| } |
| |
| var cursor = new WebInspector.TextCursor(text.lineEndings()); |
| for (var i = 0; i < text.value().length; ++i) { |
| var canonical = offsetToNode.get(i) || null; |
| cursor.advance(i); |
| var fastSearch = ast.findNodeForPosition(cursor.lineNumber(), cursor.columnNumber()); |
| if (fastSearch !== canonical) { |
| InspectorTest.addResult("Results differ for offset " + i); |
| return; |
| } |
| } |
| InspectorTest.addResult("All nodes found correctly."); |
| } |
| } |
| |
| function getSASS() |
| { |
| return document.querySelector(".snippet").textContent; |
| } |
| |
| </script> |
| </head> |
| |
| <body onload="runTest()"> |
| <p> |
| Verifies findNodeForPosition method works correctly. |
| </p> |
| <pre class="snippet"> |
| div { |
| /* display: flex; */ |
| color: $my-color; |
| background-color: blue; |
| /* position: absolute; */ |
| |
| .className { |
| padding: 10px 0 0 10px; |
| /* font-family: "Times New Roman"; */ |
| background-image: url(assets/no-image-set.png); |
| |
| #test::before { |
| margin: 10px 10px; |
| content: "test me"; |
| /* border: 1px solid black; */ |
| } |
| } |
| } |
| </pre> |
| </body> |
| </html> |
