mirror of
https://github.com/servo/servo.git
synced 2025-08-12 00:45:33 +01:00
Update web-platform-tests to revision e8bfc205e36ad699601212cd50083870bad9a75d
This commit is contained in:
parent
65dd6d4340
commit
ccdb0a3458
1428 changed files with 118036 additions and 9786 deletions
|
@ -0,0 +1,91 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Space</title>
|
||||
<link rel="help" href="http://www.mathml-association.org/MathMLinHTML5/S3.html#SS2.SSS6">
|
||||
<meta name="assert" content="Verify mspace metrics for different values of height, depth and width">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script>
|
||||
var epsilon = 1;
|
||||
function getBox(aId) {
|
||||
var box = document.getElementById(aId).getBoundingClientRect();
|
||||
box.middle = (box.bottom + box.top) / 2;
|
||||
box.center = (box.left + box.right) / 2;
|
||||
return box;
|
||||
}
|
||||
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", runTests);
|
||||
|
||||
function runTests() {
|
||||
test(function() {
|
||||
var empty = getBox("empty");
|
||||
assert_equals(empty.width, 0, "zero width");
|
||||
assert_approx_equals(getBox("baseline").bottom - empty.top, 0, epsilon, "zero depth");
|
||||
assert_approx_equals(empty.bottom - getBox("baseline").bottom, 0, epsilon, "zero depth");
|
||||
}, "Empty mspace");
|
||||
|
||||
test(function() {
|
||||
for (var i = 0; i <= 2; i++) {
|
||||
var space = getBox("width" + i);
|
||||
assert_approx_equals(space.width, 25*(i+1), epsilon, "width " + i);
|
||||
assert_approx_equals(getBox("baseline").bottom - space.top, 0, epsilon, "height" + i);
|
||||
assert_approx_equals(space.bottom - getBox("baseline").bottom, 0, epsilon, "depth" + i);
|
||||
}
|
||||
}, "Different widths");
|
||||
|
||||
test(function() {
|
||||
for (var i = 0; i <= 2; i++) {
|
||||
var space = getBox("height" + i);
|
||||
assert_equals(space.width, 0, "width" + i);
|
||||
assert_approx_equals(getBox("baseline").bottom - space.top, 25*(i+1), epsilon, "height" + i);
|
||||
assert_approx_equals(space.bottom - getBox("baseline").bottom, 0, epsilon, "depth" + i);
|
||||
}
|
||||
}, "Different heights");
|
||||
|
||||
test(function() {
|
||||
for (var i = 0; i <= 2; i++) {
|
||||
var space = getBox("depth" + i);
|
||||
assert_equals(space.width, 0, "width" + i);
|
||||
assert_approx_equals(getBox("baseline").bottom - space.top, 0, epsilon, "height" + i);
|
||||
assert_approx_equals(space.bottom - getBox("baseline").bottom, 25*(i+1), epsilon, "depth" + i);
|
||||
}
|
||||
}, "Different depths");
|
||||
|
||||
test(function() {
|
||||
for (var i = 0; i <= 2; i++) {
|
||||
var space = getBox("mspace" + i);
|
||||
assert_approx_equals(space.width, 25*(1+i%3), epsilon, "width" + i);
|
||||
assert_approx_equals(getBox("baseline").bottom - space.top, 25*(1+(i+1)%3), epsilon, "height" + i);
|
||||
assert_approx_equals(space.bottom - getBox("baseline").bottom, 25*(1+(i+2)%3), epsilon, "depth" + i);
|
||||
}
|
||||
}, "Various combinations of height, depth and width.");
|
||||
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<span id="baseline" style="display: inline-block; width: 30px; height: 5px; background: blue"></span>
|
||||
<math>
|
||||
<mspace id="empty"/>
|
||||
<mspace id="width0" width="25px"/>
|
||||
<mspace id="width1" width="50px"/>
|
||||
<mspace id="width2" width="75px"/>
|
||||
<mspace id="height0" height="25px"/>
|
||||
<mspace id="height1" height="50px"/>
|
||||
<mspace id="height2" height="75px"/>
|
||||
<mspace id="depth0" depth="25px"/>
|
||||
<mspace id="depth1" depth="50px"/>
|
||||
<mspace id="depth2" depth="75px"/>
|
||||
<mspace id="mspace0" width="25px" height="50px" depth="75px" mathbackground="green"/>
|
||||
<mspace id="mspace1" width="50px" height="75px" depth="25px" mathbackground="blue"/>
|
||||
<mspace id="mspace2" width="75px" height="25px" depth="50px" mathbackground="green"/>
|
||||
</math>
|
||||
</p>
|
||||
<hr/>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>space (reference)</title>
|
||||
</head>
|
||||
<body>
|
||||
<p>Test passes if you see a green square and no red.</p>
|
||||
<div style="position: relative;">
|
||||
<div style="position: absolute; top: 0px; left: 0px;
|
||||
background: green; width: 200px; height: 200px;">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,42 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>space</title>
|
||||
<link rel="help" href="http://www.mathml-association.org/MathMLinHTML5/S3.html#SS2.SSS6">
|
||||
<link rel="match" href="space-2-ref.html"/>
|
||||
<meta name="assert" content="Verify mspace visual rendering for different values of height, depth and width">
|
||||
</head>
|
||||
<body>
|
||||
<p>Test passes if you see a green square and no red.</p>
|
||||
<div style="position: relative;">
|
||||
<!-- Some green and red mspaces to draw a square -->
|
||||
<div style="position: absolute; top: 0px; left: 0px;
|
||||
width: 200px; height: 200px;">
|
||||
<math style="position: absolute; top: 0px; left: 0px">
|
||||
<mspace width="50px" height="100px" depth="100px" mathbackground="green"/>
|
||||
<mspace width="50px" height="100px" depth="100px" mathbackground="green"/>
|
||||
<mspace width="25px" depth="100px" mathbackground="green"/>
|
||||
<mspace width="25px" depth="100px" mathbackground="green"/>
|
||||
<mspace width="25px" height="100px" mathbackground="green"/>
|
||||
<mspace width="25px" height="100px" mathbackground="green"/>
|
||||
</math>
|
||||
<math style="position: absolute; top: 0px; left: 0px">
|
||||
<mspace width="100px" height="20px" depth="20px" mathbackground="red"/>
|
||||
<mspace width="50px" height="100px" mathbackground="red"/>
|
||||
<mspace width="50px" depth="100px" mathbackground="red"/>
|
||||
</math>
|
||||
</div>
|
||||
<!-- These green divs should cover the red mspace elements -->
|
||||
<div style="position: absolute; top: 0px; left: 0px;
|
||||
width: 200px; height: 200px;">
|
||||
<div style="position: absolute; top: 80px; left: 0px;
|
||||
width: 100px; height: 40px; background: green"></div>
|
||||
<div style="position: absolute; top: 0px; left: 100px;
|
||||
width: 50px; height: 100px; background: green"></div>
|
||||
<div style="position: absolute; top: 100px; left: 150px;
|
||||
width: 50px; height: 100px; background: green"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
Loading…
Add table
Add a link
Reference in a new issue