+
@@ -112,7 +112,7 @@
var scrollbarWidth = measure.offsetWidth - measure.clientWidth;
var scrollbarHeight = measure.offsetHeight - measure.clientHeight;
- // Here are the data-width-without-scrollbar (and height) attributes of all
+ // Here are the data-test-width-without-scrollbar (and height) attributes of all
// elements that have the "scroll" class. Things that contribute to the expected
// sizes are:
//
@@ -126,8 +126,8 @@
// so that we can ensure the scrollbar sizes are calculated in an engine-agnostic way.
var elements = document.getElementsByClassName("scroll");
for (var i = 0; i < elements.length; i++) {
- const expectedWidth = parseInt(elements[i].getAttribute("data-width-without-scrollbar"));
- const expectedHeight = parseInt(elements[i].getAttribute("data-height-without-scrollbar"));
+ const expectedWidth = parseInt(elements[i].getAttribute("data-test-width-without-scrollbar"));
+ const expectedHeight = parseInt(elements[i].getAttribute("data-test-height-without-scrollbar"));
elements[i].setAttribute("data-expected-width", expectedWidth + scrollbarWidth);
elements[i].setAttribute("data-expected-height", expectedHeight + scrollbarHeight);
}
diff --git a/resources/check-layout-th.js b/resources/check-layout-th.js
index 928b0cf2a1041e..30b68fc1d3be32 100644
--- a/resources/check-layout-th.js
+++ b/resources/check-layout-th.js
@@ -25,8 +25,41 @@ function assert_tolerance(actual, expected, message)
}
}
+function checkDataKeys(node) {
+ var validData = new Set([
+ "data-expected-width",
+ "data-expected-height",
+ "data-offset-x",
+ "data-offset-y",
+ "data-expected-client-width",
+ "data-expected-client-height",
+ "data-expected-scroll-width",
+ "data-expected-scroll-height",
+ "data-expected-bounding-client-rect-width",
+ "data-total-x",
+ "data-total-y",
+ "data-expected-display",
+ "data-expected-padding-top",
+ "data-expected-padding-bottom",
+ "data-expected-padding-left",
+ "data-expected-padding-right",
+ "data-expected-margin-top",
+ "data-expected-margin-bottom",
+ "data-expected-margin-left",
+ "data-expected-margin-right"
+ ]);
+ if (!node || !node.getAttributeNames)
+ return;
+ // Use "data-test" prefix if you need custom-named data elements.
+ for (let name of node.getAttributeNames()) {
+ if (name.startsWith("data-") && !name.startsWith("data-test"))
+ assert_true(validData.has(name), name + " is a valid data attribute");
+ }
+}
+
function checkExpectedValues(t, node, prefix)
{
+ checkDataKeys(node);
var output = { checked: false };
var expectedWidth = checkAttribute(output, node, "data-expected-width");
@@ -162,6 +195,8 @@ function checkExpectedValues(t, node, prefix)
}
var testNumber = 0;
+var highlightError = false; // displays outline around failed test element.
+var printDomOnError = true; // prints dom when test fails.
window.checkLayout = function(selectorList, callDone = true)
{
@@ -175,13 +210,24 @@ window.checkLayout = function(selectorList, callDone = true)
Array.prototype.forEach.call(nodes, function(node) {
test(function(t) {
var container = node.parentNode.className == 'container' ? node.parentNode : node;
- var prefix = "\n" + container.outerHTML + "\n";
+ var prefix =
+ printDomOnError ? '\n' + container.outerHTML + '\n' : '';
var passed = false;
try {
checkedLayout |= checkExpectedValues(t, node.parentNode, prefix);
checkedLayout |= checkSubtreeExpectedValues(t, node, prefix);
passed = true;
} finally {
+ if (!passed && highlightError) {
+ if (!document.getElementById('testharness_error_css')) {
+ var style = document.createElement('style');
+ style.setAttribute('id', 'testharness_error_css');
+ style.appendChild(document.createTextNode(
+ '.testharness_error { outline: red dotted 2px !important; }'));
+ }
+ if (node)
+ node.classList.add('testharness_error');
+ }
checkedLayout |= !passed;
}
}, selectorList + ' ' + String(++testNumber));