mirror of
https://github.com/servo/servo.git
synced 2025-06-23 08:34:42 +01:00
138 lines
5.1 KiB
HTML
138 lines
5.1 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
<head>
|
|
<title>CSSOM View —— offsetParent element test</title>
|
|
<link rel="author" title="neo_and_rayi" href="mailto:1988wangxiao@gmail.com">
|
|
<link rel="help" href="http://www.w3.org/TR/cssom-view/#extensions-to-the-htmlelement-interface">
|
|
<link rel="help" href="http://www.w3.org/TR/cssom-view/#dom-htmlelement-offsetparent">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script id="metadata_cache">/*
|
|
{
|
|
"Valid the algorithm rule of offsetParent check step 1": { "assert": "The offsetParent attribute algorithm rule checking passed!" },
|
|
"Valid the algorithm rule of offsetParent check step 2": { "assert": "The offsetParent attribute algorithm rule checking passed!" }
|
|
}
|
|
*/</script>
|
|
<style>
|
|
#fixed {
|
|
position: fixed;
|
|
}
|
|
|
|
#none-element {
|
|
display:none;
|
|
}
|
|
|
|
#relative-element {
|
|
position: relative;
|
|
}
|
|
|
|
#absolute-element {
|
|
position: absolute;
|
|
}
|
|
</style>
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<div id="body-element-child"></div>
|
|
|
|
<div id="relative-element">
|
|
<div id="relative-element-child"></div>
|
|
</div>
|
|
|
|
<div id="absolute-element">
|
|
<div id="absolute-element-child"></div>
|
|
</div>
|
|
|
|
<table id="table-element">
|
|
<caption>
|
|
<div id="caption-element-child"></div>
|
|
</caption>
|
|
|
|
<tbody>
|
|
<tr id="table-element-tr">
|
|
<td id="table-element-td">
|
|
<span id="table-element-child"></span>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<div id="none-element">
|
|
<a href="#" id="none-element-child-a"></a>
|
|
<p id="none-element-child-p"></p>
|
|
<video id="none-element-child-video"></video>
|
|
<audio id="none-element-child-audio"></audio>
|
|
<canvas id="none-element-child-canvas"></canvas>
|
|
<svg id="none-element-child-svg"></svg>
|
|
</div>
|
|
|
|
<div id="fixed">
|
|
</div>
|
|
|
|
<div id="log"></div>
|
|
<script type="text/javascript">
|
|
var getStyle = window.getComputedStyle;
|
|
var html = document.documentElement;
|
|
var body = document.body;
|
|
var fixed_element = document.getElementById('fixed');
|
|
var none_element = document.getElementById('none-element');
|
|
|
|
var none_element_child_a = document.getElementById('none-element-child-a');
|
|
var none_element_child_p = document.getElementById('none-element-child-p');
|
|
var none_element_child_video = document.getElementById('none-element-child-video');
|
|
var none_element_child_audio = document.getElementById('none-element-child-audio');
|
|
var none_element_child_canvas = document.getElementById('none-element-child-canvas');
|
|
var none_element_child_svg = document.getElementById('none-element-child-svg');
|
|
|
|
var relative_element = document.getElementById('relative-element');
|
|
var absolute_element = document.getElementById('absolute-element');
|
|
var td_element = document.getElementsByTagName('td')[0];
|
|
|
|
var body_element_child = document.getElementById('body-element-child');
|
|
var relative_element_child = document.getElementById('relative-element-child');
|
|
var absolute_element_child = document.getElementById('absolute-element-child');
|
|
var table_element_child = document.getElementById('table-element-child');
|
|
|
|
var caption_element_child = document.getElementById('caption-element-child');
|
|
var table_element_tr = document.getElementById('table-element-tr');
|
|
var table_element = document.getElementById('table-element');
|
|
|
|
test(function() {
|
|
assert_equals(html.offsetParent,null);
|
|
assert_equals(body.offsetParent,null);
|
|
assert_equals(fixed_element.offsetParent,null);
|
|
assert_equals(none_element.offsetParent,null);
|
|
assert_equals(none_element_child_a.offsetParent,null);
|
|
assert_equals(none_element_child_p.offsetParent,null);
|
|
assert_equals(none_element_child_video.offsetParent,null);
|
|
assert_equals(none_element_child_audio.offsetParent,null);
|
|
assert_equals(none_element_child_canvas.offsetParent,null);
|
|
assert_equals(none_element_child_svg.offsetParent,null);
|
|
}, "Valid the algorithm rule of offsetParent check step 1",
|
|
{ assert: "The offsetParent attribute algorithm rule checking passed!" }
|
|
);
|
|
|
|
test(function() {
|
|
assert_equals(body_element_child.offsetParent,body);
|
|
assert_equals(window.getComputedStyle(relative_element).position,'relative');
|
|
assert_equals(relative_element_child.offsetParent,relative_element);
|
|
assert_equals(window.getComputedStyle(absolute_element).position,'absolute');
|
|
assert_equals(absolute_element_child.offsetParent,absolute_element);
|
|
assert_equals(window.getComputedStyle(td_element).position,'static');
|
|
assert_equals(table_element_child.offsetParent,td_element);
|
|
assert_equals(window.getComputedStyle(table_element_tr).position,'static');
|
|
assert_equals(table_element_tr.offsetParent,table_element);
|
|
assert_equals(window.getComputedStyle(caption_element_child).position,'static');
|
|
assert_equals(caption_element_child.offsetParent,table_element);
|
|
assert_equals(window.getComputedStyle(td_element).position,'static');
|
|
assert_equals(td_element.offsetParent,table_element);
|
|
}, "Valid the algorithm rule of offsetParent check step 2",
|
|
{ assert: "The offsetParent attribute algorithm rule checking passed!" }
|
|
);
|
|
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|