Update CSS tests to revision d13905941293af83ea8c3c1750dba652e0423fb0

This commit is contained in:
Ms2ger 2015-10-31 14:35:08 +01:00
parent b492a3e8b1
commit 5450053b02
842 changed files with 42936 additions and 27 deletions

View file

@ -0,0 +1,146 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>CSS Test: CSSOM View scrollWidth and scrollHeight</title>
<link rel="author" title="Robert O'Callahan" href="mailto:robert@ocallahan.org">
<link rel="help" href="http://www.w3.org/TR/cssom-view/#dom-element-scrollwidth">
<meta name="flags" content="dom">
<script src="/resources/testharness.js" type="text/javascript"></script>
<script src="/resources/testharnessreport.js" type="text/javascript"></script>
<style type="text/css">
#elemSimple, #elemOverflow, #elemNestedOverflow {
border:1px solid black;
overflow:hidden;
width:200px;
height:40px;
padding-bottom:50px;
padding-right:40px;
}
#elemSimple > div {
background:yellow;
width:60px;
height:30px;
}
#elemOverflow > div {
background:yellow;
width:250px;
height:150px;
}
#elemNestedOverflow > div {
background:yellow;
width:60px;
height:30px;
}
#elemNestedOverflow > div > div {
background:blue;
width:250px;
height:150px;
}
</style>
<script id="metadata_cache" type="text/javascript">/*
{
"elemSimple.clientHeight is the height of the padding edge": {},
"elemSimple.scrollHeight is its clientHeight": {},
"elemSimple.clientWidth is the width of the padding edge": {},
"elemSimple.scrollWidth is its clientWidth": {},
"elemOverflow.clientHeight is the height of the padding edge": {},
"elemOverflow.scrollHeight is the height of its scrolled contents (ignoring padding, since we overflowed)": {},
"elemOverflow.clientWidth is the width of the padding edge": {},
"elemOverflow.scrollHeight is the width of its scrolled contents (ignoring padding, since we overflowed)": {},
"elemNestedOverflow.clientHeight is the height of the padding edge": {},
"elemNestedOverflow.scrollHeight is the height of its scrolled contents (ignoring padding, since we overflowed)": {},
"elemNestedOverflow.clientWidth is the height of the padding edge": {},
"elemNestedOverflow.scrollWidth is the width of its scrolled contents (ignoring padding, since we overflowed)": {}
*/ </script>
</head>
<body>
<noscript>Test not run - javascript required.</noscript>
<div id="log"></div>
<div id="elemSimple">
<div></div>
</div>
<div id="elemOverflow">
<div></div>
</div>
<div id="elemNestedOverflow">
<div>
<div></div>
</div>
</div>
<script type="text/javascript">
var elemSimple = document.getElementById("elemSimple");
var elemOverflow = document.getElementById("elemOverflow");
var elemNestedOverflow = document.getElementById("elemNestedOverflow");
test(function(){
assert_equals(elemSimple.clientHeight, 90);
}, "elemSimple.clientHeight is the height of the padding edge");
test(function(){
assert_equals(elemSimple.scrollHeight, 90);
}, "elemSimple.scrollHeight is its clientHeight");
test(function(){
assert_equals(elemSimple.clientWidth, 240);
}, "elemSimple.clientWidth is the width of the padding edge");
test(function(){
assert_equals(elemSimple.scrollWidth, 240);
}, "elemSimple.scrollWidth is its clientWidth");
test(function(){
assert_equals(elemOverflow.clientHeight, 90);
}, "elemOverflow.clientHeight is the height of the padding edge");
/* This test differs from the spec. Opera and Webkit meet the spec, IE9 and Firefox
give the result here. It seems that in this case Opera and Webkit place
the padding-bottom below elemOverflow's child (i.e. below elemOverflow's bottom border);
you can scroll to it. IE9 and Firefox do not. I believe this is a Webkit/Opera bug
(If you remove overflow:hidden then the padding-bottom moves back to be above the bottom
border, as expected.)
The underlying issue seems to be whether bottom padding on a scrollable element is
always placed at the element's bottom border and not scrolled, or else deemed to
belong to the scrolled content and placed below the scrolled element's children.
Commenting out for now, because this is not really a CSSOM issue, but an issue
over the layout of elements with 'overflow'.
test(function(){
assert_equals(elemOverflow.scrollHeight, 150);
}, "elemOverflow.scrollHeight is the height of its scrolled contents (ignoring padding, since we overflowed)");
*/
test(function(){
assert_equals(elemOverflow.clientWidth, 240);
}, "elemOverflow.clientWidth is the width of the padding edge");
/* This test differs from the spec. All major browsers give the result here, ignoring
the right padding.
*/
test(function(){
assert_equals(elemOverflow.scrollWidth, 250);
}, "elemOverflow.scrollHeight is the width of its scrolled contents (ignoring padding, since we overflowed)");
test(function(){
assert_equals(elemNestedOverflow.clientHeight, 90);
}, "elemNestedOverflow.clientHeight is the height of the padding edge");
/* This test differs from the spec. All major browsers give the result here.
*/
test(function(){
assert_equals(elemNestedOverflow.scrollHeight, 150);
}, "elemNestedOverflow.scrollHeight is the height of its scrolled contents (ignoring padding, since we overflowed)");
test(function(){
assert_equals(elemNestedOverflow.clientWidth, 240);
}, "elemNestedOverflow.clientWidth is the height of the padding edge");
/* This test differs from the spec. All major browsers give the result here, ignoring
the right padding.
*/
test(function(){
assert_equals(elemNestedOverflow.scrollWidth, 250);
}, "elemNestedOverflow.scrollWidth is the width of its scrolled contents (ignoring padding, since we overflowed)");
</script>
</body>
</html>