| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| iframe { |
| border: 0px; |
| } |
| </style> |
| <script> |
| let testFiles = [ |
| "relative-simple.html", |
| "relative-bottom.html", |
| "relative-right.html", |
| "relative-auto.html", |
| "relative-auto-with-parent-offset.html", |
| "relative-position-when-containing-block-is-not-in-the-formatting-context.html", |
| "relative-siblings.html", |
| "padding-simple.html", |
| "padding-nested.html", |
| "border-simple.html", |
| "margin-simple.html", |
| "margin-sibling-collapse-propagated.html", |
| "margin-propagation-simple-content-height.html", |
| "margin-left-right-sizing.html", |
| "margin-left-right-sizing-out-of-flow.html", |
| "margin-collapse-with-block-formatting-context2.html", |
| "margin-collapse-with-block-formatting-context.html", |
| "margin-collapse-when-child-has-padding-border.html", |
| "margin-collapse-top-nested.html", |
| "margin-collapse-simple.html", |
| "margin-collapse-first-last-are-floating.html", |
| "margin-collapse-bottom-nested.html", |
| "margin-collapse-bottom-bottom.html", |
| "absolute-auto-with-sibling-margin-bottom.html", |
| "absolute-bottom.html", |
| "absolute-height-stretch.html", |
| "absolute-left-auto.html", |
| "absolute-left-right-top-bottom-auto.html", |
| "absolute-nested.html", |
| "absolute-nested2.html", |
| "absolute-simple.html", |
| "absolute-width-shrink-to-fit.html", |
| "absolute-width-stretch.html", |
| "absolute-with-static-block-position-nested.html", |
| "absolute-position-when-containing-block-is-not-in-the-formatting-context.html", |
| "absolute-position-when-containing-block-is-not-in-the-formatting-context2.html", |
| "fixed-nested.html", |
| "floating-box-left-and-right-multiple.html", |
| "floating-box-right-simple.html", |
| "floating-left-right-simple.html", |
| "floating-left-right-with-all-margins.html", |
| "floating-multiple-lefts-in-body.html", |
| "floating-multiple-lefts-multiple-lines.html", |
| "floating-multiple-lefts.html", |
| "floating-box-with-relative-positioned-sibling.html", |
| "floating-lefts-and-rights-simple.html", |
| "floating-with-new-block-formatting-context.html", |
| "floating-box-clear-right-simple.html", |
| "floating-box-with-clear-simple.html", |
| "floating-box-with-clear-siblings.html", |
| "floating-box-clear-both-simple.html", |
| "almost-intruding-left-float-simple.html", |
| "negative-margin-simple.html", |
| "intruding-left-float-simple.html", |
| "simple-inline-text.html" |
| ]; |
| |
| let debugThis = []; |
| |
| function addJS(fileName) { |
| let script = document.currentScript.src; |
| let imported = document.createElement('script'); |
| imported.src = fileName; |
| document.head.appendChild(imported); |
| } |
| |
| addJS("./TestHarness.js"); |
| addJS("../Utils.js"); |
| addJS("../Layout.js"); |
| addJS("../TreeBuilder.js"); |
| addJS("../LayoutState.js"); |
| addJS("../LayoutTree/Box.js"); |
| addJS("../LayoutTree/Container.js"); |
| addJS("../LayoutTree/BlockContainer.js"); |
| addJS("../LayoutTree/InitialBlockContainer.js"); |
| addJS("../LayoutTree/InlineBox.js"); |
| addJS("../LayoutTree/Text.js"); |
| addJS("../DisplayTree/Box.js"); |
| addJS("../FormattingState/FormattingState.js"); |
| addJS("../FormattingState/BlockFormattingState.js"); |
| addJS("../FormattingState/InlineFormattingState.js"); |
| addJS("../FormattingContext/FormattingContext.js"); |
| addJS("../FormattingContext/FloatingContext.js"); |
| addJS("../FormattingContext/BlockFormatting/BlockFormattingContext.js"); |
| addJS("../FormattingContext/BlockFormatting/BlockMarginCollapse.js"); |
| addJS("../FormattingContext/InlineFormatting/InlineFormattingContext.js"); |
| addJS("../FormattingContext/InlineFormatting/Line.js"); |
| |
| let failedTests = []; |
| |
| function printResult(files, currentTestIndex) { |
| let resultContent = currentTestIndex != null ? ("Testing..." + currentTestIndex + " out of " + files.length) : ("Number of tests: " + files.length) ; |
| resultContent += "<br><br>Passed: " + ((currentTestIndex != null ? currentTestIndex : files.length) - failedTests.length) + "<br>Failed: " + failedTests.length; |
| if (failedTests.length > 0) { |
| resultContent += "<br><br>Failed cases:" |
| failedTests.forEach(function(item) { |
| resultContent += "<br><a href=\"" + files[item] + "\">" + files[item] + "</a>"; |
| }); |
| } |
| result.innerHTML = resultContent; |
| } |
| |
| function runTest(files, currentTestIndex) { |
| printResult(files, currentTestIndex); |
| let iframe = document.createElement("iframe"); |
| iframe.src = files[currentTestIndex]; |
| iframe.id = "testFrame"; |
| iframe.width = window.innerWidth; |
| iframe.height = window.innerHeight; |
| iframe.onload = function() { |
| let testFrame = document.getElementById("testFrame"); |
| let passed = runLayout(testFrame.contentWindow); |
| testFrame.remove(); |
| if (!passed) |
| failedTests.push(currentTestIndex); |
| setTimeout(function() { |
| if (currentTestIndex < files.length - 1) |
| runTest(files, ++currentTestIndex); |
| else |
| printResult(files); |
| }, 0); |
| }; |
| document.body.appendChild(iframe); |
| } |
| |
| function runTests() { |
| runTest(debugThis.length ? debugThis : testFiles, 0); |
| } |
| </script> |
| </head> |
| <body onload="runTests()"> |
| <pre id=result></pre> |
| </body> |
| </html> |
