Update web-platform-tests to revision 192193581b6912818a0e3f2408f40f033a451a79

This commit is contained in:
WPT Sync Bot 2019-01-14 20:34:43 -05:00
parent 2cf9a00c99
commit 13bbfdb3eb
46 changed files with 1499 additions and 144 deletions

View file

@ -0,0 +1,48 @@
<!DOCTYPE html>
<meta charset=utf-8>
<title>The current time of a worklet animation</title>
<link rel="help" href="https://drafts.css-houdini.org/css-animationworklet/">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/web-animations/testcommon.js"></script>
<script src="common.js"></script>
<body>
<div id="log"></div>
<script>
'use strict';
const DURATION = 10000; // ms
const KEYFRAMES = { height : ['100px', '50px'] };
promise_test(async t => {
await registerPassthroughAnimator();
const animation =
new WorkletAnimation('passthrough', new KeyframeEffect(createDiv(t),
KEYFRAMES, DURATION), document.timeline);
animation.play();
assert_equals(animation.currentTime, 0,
'Current time returns the hold time set when entering the play-pending' +
'state');
}, 'The current time returns the hold time when set');
promise_test(async t => {
await registerPassthroughAnimator();
const animation =
new WorkletAnimation('passthrough', new KeyframeEffect(createDiv(t),
KEYFRAMES, DURATION), document.timeline);
// TODO(majidvp): We should use Animation.startTime here because the
// animation may not immediately start.
const startTime = document.timeline.currentTime;
animation.play();
await waitForNextFrame();
const timelineTime = document.timeline.currentTime;
assert_times_equal(animation.currentTime, (timelineTime - startTime));
}, 'The current time is calculated from the timeline time and start time');
// TODO(majidvp): Add tests for playbackRate and animations that are not
// associated with a timeline once these are supported in WorkletAnimation.
// http://crbug.com/833846
</script>
</body>

View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<title>CSS Test: background-image applicability to ::first-letter</title>
<link rel="help" href="http://www.w3.org/TR/css3-background/">
<link rel="help" href="http://www.w3.org/TR/CSS21/selector.html#first-line-pseudo">
<link rel="match" href="reference/background-image-first-line-ref.html">
<meta name="flags" content="ahem image">
<meta name="assert" content="background-image applicability to ::first-line">
<style type="text/css">
#content {
color: transparent;
font: 100px Ahem;
}
#content::first-line {
background-image: url("support/cat.png"); /* 98 w. by 99px h. */
background-repeat: no-repeat;
}
</style>
<p>Test passes if cat image is visible.</p>
<div id="content">X</div>

View file

@ -0,0 +1,12 @@
<!DOCTYPE html>
<meta name="flags" content="ahem image">
<style type="text/css">
#content {
color: transparent;
font: 100px Ahem;
background-image: url("../support/cat.png"); /* 98 w. by 99px h. */
background-repeat: no-repeat;
}
</style>
<p>Test passes if cat image is visible.</p>
<div id="content">X</div>

View file

@ -0,0 +1,22 @@
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://www.w3.org/TR/css-break-3/#transforms">
<link rel="help" href="https://www.w3.org/TR/CSS22/visudet.html#abs-non-replaced-height">
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div style="position:relative;">
<div style="position:absolute; top:50px; width:50px; height:50px; background:red;"></div>
</div>
<div id="multicol" style="columns:2; column-fill:auto; column-gap:0; width:101px; height:100px; background:green;">
<div style="position:relative; height:100px;">
<div style="position:absolute; bottom:0;">
<div style="position:absolute; bottom:0;">
<div style="width:50px; height:50px; background:green;"></div>
</div>
</div>
</div>
</div>
<script>
document.body.offsetTop;
document.getElementById("multicol").style.width = "100px";
</script>

View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<link rel="author" title="Andrew Comminos" href="mailto:acomminos@fb.com" />
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#painting" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
#container {
width: 600px;
display: flex;
}
#left {
width: 300px;
overflow: hidden;
white-space: nowrap;
background: rgba(200, 200, 200, 0.8);
order: 0;
}
#right {
width: 300px;
background-color: rgba(0, 128, 0, 0.8);
margin-left: -100px;
order: 1;
}
</style>
<div id="container">
<div id="right"></div>
<a id="left" href="#">foofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoofoo</a>
</div>
<div id="log"></div>
<script>
test(function(t)
{
const container = document.querySelector('#container');
// Target the intersection of the two child elements.
// The occluded link should not be clickable.
const x = container.offsetLeft + 250;
const y = container.offsetTop + 5;
var element = document.elementFromPoint(x, y);
assert_equals(element.nodeName, 'DIV');
assert_equals(element.id, 'right');
}, "Flexboxes should perform hit testing in reverse paint order for overlapping elements: flex order case (crbug.com/844505)");
</script>

View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<title>CSS Grid: Reference for grid-template-columns interpolation</title>
<style>
.grid {
display: grid;
width: 400px;
grid-gap: 10px;
grid-template-columns: 60px 1fr;
}
span { border: 1px solid; }
</style>
</head>
<body>
<div class="grid">
<span>column1</span>
<span>column2</span>
</div>
</body>
</html>

View file

@ -0,0 +1,38 @@
<!DOCTYPE html>
<html class="reftest-wait">
<head>
<title>CSS Grid: Test grid-template-columns interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-grid/#track-sizing">
<link rel="match" href="grid-template-columns-001-ref.html">
<meta name="assert" content="The grid-template-columns property should have
correct interpolation result.">
<style>
@keyframes anim {
from {
grid-template-columns: 20px 1fr;
}
to {
grid-template-columns: 100px 1fr;
}
}
.grid {
display: grid;
width: 400px;
grid-gap: 10px;
animation: anim 10s -5s paused linear;
}
span { border: 1px solid; }
</style>
</head>
<body>
<div class="grid">
<span>column1</span>
<span>column2</span>
</div>
</body>
<script>
requestAnimationFrame(() => {
document.documentElement.classList.remove('reftest-wait');
});
</script>
</html>

View file

@ -0,0 +1,179 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>grid-template-columns interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-grid/#track-sizing">
<meta name="assert" content="grid-template-columns supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
</head>
<body>
<script>
'use strict';
// Distinct length of track list.
test_no_interpolation({
property: 'grid-template-columns',
from: "1fr 1fr 1fr",
to: "2fr 2fr"
});
test_no_interpolation({
property: 'grid-template-columns',
from: "10px 20px 30px",
to: "20px 30px"
});
test_no_interpolation({
property: 'grid-template-columns',
from: "1fr 1fr 1fr",
to: "none"
});
test_no_interpolation({
property: 'grid-template-columns',
from: "none",
to: "20px 30px"
});
// Exercise <explicit-track-list>
test_interpolation({
property: 'grid-template-columns',
from: "10px 20px 30px",
to: "20px 30px 40px"
}, [
{at: -1, expect: "0px 10px 20px"},
{at: 0, expect: "10px 20px 30px"},
{at: 0.4, expect: "14px 24px 34px"},
{at: 0.6, expect: "16px 26px 36px"},
{at: 1, expect: "20px 30px 40px"},
{at: 2, expect: "30px 40px 50px"}
]);
test_interpolation({
property: 'grid-template-columns',
from: "10px 20px 30px",
to: "20% 30% 40px"
}, [
{at: -1, expect: "calc(20px + -20%) calc(40px + -30%) 20px"},
{at: 0, expect: "calc(10px + 0%) calc(20px + 0%) 30px"},
{at: 0.4, expect: "calc(6px + 8%) calc(12px + 12%) 34px"},
{at: 0.6, expect: "calc(4px + 12%) calc(8px + 18%) 36px"},
{at: 1, expect: "20% 30% 40px"},
{at: 2, expect: "calc(-10px + 40%) calc(-20px + 60%) 50px"}
]);
test_interpolation({
property: 'grid-template-columns',
from: "1fr 1fr 1fr",
to: "2fr auto 2fr"
}, [
{at: -1, expect: "0fr 1fr 0fr"},
{at: 0, expect: "1fr 1fr 1fr"},
{at: 0.4, expect: "1.4fr 1fr 1.4fr"},
{at: 0.6, expect: "1.6fr auto 1.6fr"},
{at: 1, expect: "2fr auto 2fr"},
{at: 2, expect: "3fr auto 3fr"}
]);
test_interpolation({
property: 'grid-template-columns',
from: "1fr [a b] 1fr [d] 1fr",
to: "2fr [c] auto 2fr"
}, [
{at: -1, expect: "0fr [a b] 1fr [d] 0fr"},
{at: 0, expect: "1fr [a b] 1fr [d] 1fr"},
{at: 0.4, expect: "1.4fr [a b] 1fr [d] 1.4fr"},
{at: 0.6, expect: "1.6fr [c] auto 1.6fr"},
{at: 1, expect: "2fr [c] auto 2fr"},
{at: 2, expect: "3fr [c] auto 3fr"}
]);
test_interpolation({
property: 'grid-template-columns',
from: "fit-content(10px) fit-content(20px)",
to: "fit-content(20px) max-content"
}, [
{at: -1, expect: "fit-content(0px) fit-content(20px)"},
{at: 0, expect: "fit-content(10px) fit-content(20px)"},
{at: 0.4, expect: "fit-content(14px) fit-content(20px)"},
{at: 0.6, expect: "fit-content(16px) max-content"},
{at: 1, expect: "fit-content(20px) max-content"},
{at: 2, expect: "fit-content(30px) max-content"}
]);
test_interpolation({
property: 'grid-template-columns',
from: "minmax(10px, 1fr) minmax(20px, 2fr)",
to: "minmax(20px, 2fr) minmax(30px, auto)"
}, [
{at: -1, expect: "minmax(0px, 0fr) minmax(10px, 2fr)"},
{at: 0, expect: "minmax(10px, 1fr) minmax(20px, 2fr)"},
{at: 0.4, expect: "minmax(14px, 1.4fr) minmax(24px, 2fr)"},
{at: 0.6, expect: "minmax(16px, 1.6fr) minmax(26px, auto)"},
{at: 1, expect: "minmax(20px, 2fr) minmax(30px, auto)"},
{at: 2, expect: "minmax(30px, 3fr) minmax(40px, auto)"}
]);
// Exercise <track-list> (with <track-repeat>)
test_no_interpolation({
property: 'grid-template-columns',
from: "1fr repeat(2, 2fr 30px) 1fr",
to: "2fr repeat(2, 3fr 40px 50px) 2fr"
});
test_no_interpolation({
property: 'grid-template-columns',
from: "1fr repeat(2, 2fr 30px) 1fr",
to: "2fr repeat(3, 3fr 40px) 2fr"
});
test_interpolation({
property: 'grid-template-columns',
from: "repeat(2, 2fr 30px)",
to: "repeat(4, 40px)"
}, [
{at: -1, expect: "2fr 20px 2fr 20px"},
{at: 0, expect: "repeat(2, 2fr 30px)"},
{at: 0.4, expect: "2fr 34px 2fr 34px"},
{at: 0.6, expect: "40px 36px 40px 36px"},
{at: 1, expect: "repeat(4, 40px)"},
{at: 2, expect: "40px 50px 40px 50px"}
]);
test_interpolation({
property: 'grid-template-columns',
from: "1fr repeat(2, 2fr auto 30px) 1fr",
to: "2fr repeat(2, 3fr 30px 40px) 2fr"
}, [
{at: -1, expect: "0fr repeat(2, 1fr auto 20px) 0fr"},
{at: 0, expect: "1fr repeat(2, 2fr auto 30px) 1fr"},
{at: 0.4, expect: "1.4fr repeat(2, 2.4fr auto 34px) 1.4fr"},
{at: 0.6, expect: "1.6fr repeat(2, 2.6fr 30px 36px) 1.6fr"},
{at: 1, expect: "2fr repeat(2, 3fr 30px 40px) 2fr"},
{at: 2, expect: "3fr repeat(2, 4fr 30px 50px) 3fr"}
]);
// Exercise <auto-track-list>
test_no_interpolation({
property: 'grid-template-columns',
from: "10px repeat(auto-fill, minmax(25px, 1fr)) 10px",
to: "20px 20px repeat(auto-fill, minmax(30px, 1fr))"
});
test_no_interpolation({
property: 'grid-template-columns',
from: "10px repeat(auto-fill, minmax(25px, 1fr)) 10px",
to: "20px repeat(auto-fit, minmax(30px, 1fr)) 20px"
});
test_no_interpolation({
property: 'grid-template-columns',
from: "10px repeat(auto-fill, minmax(25px, 1fr)) 10px",
to: "20px repeat(auto-fill, minmax(35px, auto)) 20px"
});
</script>
</body>
</html>

View file

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<title>CSS Grid: Reference for grid-template-rows interpolation</title>
<style>
.grid {
display: grid;
width: 400px;
height: 400px;
grid-gap: 10px;
grid-template-rows: 60px 1fr;
}
span { border: 1px solid; }
</style>
</head>
<body>
<div class="grid">
<span>row1</span>
<span>row2</span>
</div>
</body>
</html>

View file

@ -0,0 +1,39 @@
<!DOCTYPE html>
<html class="reftest-wait">
<head>
<title>CSS Grid: Test grid-template-rows interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-grid/#track-sizing">
<link rel="match" href="grid-template-rows-001-ref.html">
<meta name="assert" content="The grid-template-rows property should have
correct interpolation result.">
<style>
@keyframes anim {
from {
grid-template-rows: 20px 1fr;
}
to {
grid-template-rows: 100px 1fr;
}
}
.grid {
display: grid;
width: 400px;
height: 400px;
grid-gap: 10px;
animation: anim 10s -5s paused linear;
}
span { border: 1px solid; }
</style>
</head>
<body>
<div class="grid">
<span>row1</span>
<span>row2</span>
</div>
</body>
<script>
requestAnimationFrame(() => {
document.documentElement.classList.remove('reftest-wait');
});
</script>
</html>

View file

@ -0,0 +1,179 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>grid-template-rows interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-grid/#track-sizing">
<meta name="assert" content="grid-template-rows supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/interpolation-testcommon.js"></script>
</head>
<body>
<script>
'use strict';
// Distinct length of track list.
test_no_interpolation({
property: 'grid-template-rows',
from: "1fr 1fr 1fr",
to: "2fr 2fr"
});
test_no_interpolation({
property: 'grid-template-rows',
from: "10px 20px 30px",
to: "20px 30px"
});
test_no_interpolation({
property: 'grid-template-rows',
from: "1fr 1fr 1fr",
to: "none"
});
test_no_interpolation({
property: 'grid-template-rows',
from: "none",
to: "20px 30px"
});
// Exercise <explicit-track-list>
test_interpolation({
property: 'grid-template-rows',
from: "10px 20px 30px",
to: "20px 30px 40px"
}, [
{at: -1, expect: "0px 10px 20px"},
{at: 0, expect: "10px 20px 30px"},
{at: 0.4, expect: "14px 24px 34px"},
{at: 0.6, expect: "16px 26px 36px"},
{at: 1, expect: "20px 30px 40px"},
{at: 2, expect: "30px 40px 50px"}
]);
test_interpolation({
property: 'grid-template-rows',
from: "10px 20px 30px",
to: "20% 30% 40px"
}, [
{at: -1, expect: "calc(20px + -20%) calc(40px + -30%) 20px"},
{at: 0, expect: "calc(10px + 0%) calc(20px + 0%) 30px"},
{at: 0.4, expect: "calc(6px + 8%) calc(12px + 12%) 34px"},
{at: 0.6, expect: "calc(4px + 12%) calc(8px + 18%) 36px"},
{at: 1, expect: "20% 30% 40px"},
{at: 2, expect: "calc(-10px + 40%) calc(-20px + 60%) 50px"}
]);
test_interpolation({
property: 'grid-template-rows',
from: "1fr 1fr 1fr",
to: "2fr auto 2fr"
}, [
{at: -1, expect: "0fr 1fr 0fr"},
{at: 0, expect: "1fr 1fr 1fr"},
{at: 0.4, expect: "1.4fr 1fr 1.4fr"},
{at: 0.6, expect: "1.6fr auto 1.6fr"},
{at: 1, expect: "2fr auto 2fr"},
{at: 2, expect: "3fr auto 3fr"}
]);
test_interpolation({
property: 'grid-template-rows',
from: "1fr [a b] 1fr [d] 1fr",
to: "2fr [c] auto 2fr"
}, [
{at: -1, expect: "0fr [a b] 1fr [d] 0fr"},
{at: 0, expect: "1fr [a b] 1fr [d] 1fr"},
{at: 0.4, expect: "1.4fr [a b] 1fr [d] 1.4fr"},
{at: 0.6, expect: "1.6fr [c] auto 1.6fr"},
{at: 1, expect: "2fr [c] auto 2fr"},
{at: 2, expect: "3fr [c] auto 3fr"}
]);
test_interpolation({
property: 'grid-template-rows',
from: "fit-content(10px) fit-content(20px)",
to: "fit-content(20px) max-content"
}, [
{at: -1, expect: "fit-content(0px) fit-content(20px)"},
{at: 0, expect: "fit-content(10px) fit-content(20px)"},
{at: 0.4, expect: "fit-content(14px) fit-content(20px)"},
{at: 0.6, expect: "fit-content(16px) max-content"},
{at: 1, expect: "fit-content(20px) max-content"},
{at: 2, expect: "fit-content(30px) max-content"}
]);
test_interpolation({
property: 'grid-template-rows',
from: "minmax(10px, 1fr) minmax(20px, 2fr)",
to: "minmax(20px, 2fr) minmax(30px, auto)"
}, [
{at: -1, expect: "minmax(0px, 0fr) minmax(10px, 2fr)"},
{at: 0, expect: "minmax(10px, 1fr) minmax(20px, 2fr)"},
{at: 0.4, expect: "minmax(14px, 1.4fr) minmax(24px, 2fr)"},
{at: 0.6, expect: "minmax(16px, 1.6fr) minmax(26px, auto)"},
{at: 1, expect: "minmax(20px, 2fr) minmax(30px, auto)"},
{at: 2, expect: "minmax(30px, 3fr) minmax(40px, auto)"}
]);
// Exercise <track-list> (with <track-repeat>)
test_no_interpolation({
property: 'grid-template-rows',
from: "1fr repeat(2, 2fr 30px) 1fr",
to: "2fr repeat(2, 3fr 40px 50px) 2fr"
});
test_no_interpolation({
property: 'grid-template-rows',
from: "1fr repeat(2, 2fr 30px) 1fr",
to: "2fr repeat(3, 3fr 40px) 2fr"
});
test_interpolation({
property: 'grid-template-rows',
from: "repeat(2, 2fr 30px)",
to: "repeat(4, 40px)"
}, [
{at: -1, expect: "2fr 20px 2fr 20px"},
{at: 0, expect: "repeat(2, 2fr 30px)"},
{at: 0.4, expect: "2fr 34px 2fr 34px"},
{at: 0.6, expect: "40px 36px 40px 36px"},
{at: 1, expect: "repeat(4, 40px)"},
{at: 2, expect: "40px 50px 40px 50px"}
]);
test_interpolation({
property: 'grid-template-rows',
from: "1fr repeat(2, 2fr auto 30px) 1fr",
to: "2fr repeat(2, 3fr 30px 40px) 2fr"
}, [
{at: -1, expect: "0fr repeat(2, 1fr auto 20px) 0fr"},
{at: 0, expect: "1fr repeat(2, 2fr auto 30px) 1fr"},
{at: 0.4, expect: "1.4fr repeat(2, 2.4fr auto 34px) 1.4fr"},
{at: 0.6, expect: "1.6fr repeat(2, 2.6fr 30px 36px) 1.6fr"},
{at: 1, expect: "2fr repeat(2, 3fr 30px 40px) 2fr"},
{at: 2, expect: "3fr repeat(2, 4fr 30px 50px) 3fr"}
]);
// Exercise <auto-track-list>
test_no_interpolation({
property: 'grid-template-rows',
from: "10px repeat(auto-fill, minmax(25px, 1fr)) 10px",
to: "20px 20px repeat(auto-fill, minmax(30px, 1fr))"
});
test_no_interpolation({
property: 'grid-template-rows',
from: "10px repeat(auto-fill, minmax(25px, 1fr)) 10px",
to: "20px repeat(auto-fit, minmax(30px, 1fr)) 20px"
});
test_no_interpolation({
property: 'grid-template-rows',
from: "10px repeat(auto-fill, minmax(25px, 1fr)) 10px",
to: "20px repeat(auto-fill, minmax(35px, auto)) 20px"
});
</script>
</body>
</html>

View file

@ -0,0 +1,66 @@
'use strict';
function test_interpolation(settings, expectations) {
// Returns a timing function that at 0.5 evaluates to progress.
function timingFunction(progress) {
if (progress === 0)
return 'steps(1, end)';
if (progress === 1)
return 'steps(1, start)';
var y = (8 * progress - 1) / 6;
return 'cubic-bezier(0, ' + y + ', 1, ' + y + ')';
}
test(function(){
assert_true(CSS.supports(settings.property, settings.from), 'Value "' + settings.from + '" is supported by ' + settings.property);
assert_true(CSS.supports(settings.property, settings.to), 'Value "' + settings.to + '" is supported by ' + settings.property);
}, '"' + settings.from + '" and "' + settings.to + '" are valid ' + settings.property + ' values');
for (var i = 0; i < expectations.length; ++i) {
var progress = expectations[i].at;
var expectation = expectations[i].expect;
var animationId = 'anim' + i;
var targetId = 'target' + i;
var referenceId = 'reference' + i;
test(function(){
assert_true(CSS.supports(settings.property, expectation), 'Value "' + expectation + '" is supported by ' + settings.property);
var stylesheet = document.createElement('style');
stylesheet.textContent =
'#' + targetId + ' {\n' +
' animation: 2s ' + timingFunction(progress) + ' -1s paused ' + animationId + ';\n' +
'}\n' +
'@keyframes ' + animationId + ' {\n' +
' 0% { ' + settings.property + ': ' + settings.from + '; }\n' +
' 100% { ' + settings.property + ': ' + settings.to + '; }\n' +
'}\n' +
'#' + referenceId + ' {\n' +
' ' + settings.property + ': ' + expectation + ';\n' +
'}\n';
document.head.appendChild(stylesheet);
var target = document.createElement('div');
target.id = targetId;
document.body.appendChild(target);
var reference = document.createElement('div');
reference.id = referenceId;
document.body.appendChild(reference);
reference.style = '';
assert_equals(getComputedStyle(target)[settings.property], getComputedStyle(reference)[settings.property]);
}, (settings.test_prefix ? settings.test_prefix : "") +
'Animation between "' + settings.from + '" and "' + settings.to +
'" at progress ' + progress);
}
}
function test_no_interpolation(settings) {
var expectatFrom = [-1, 0, 0.4].map(function (progress) {
return {at: progress, expect: settings.from};
});
var expectatTo = [0.6, 1, 2].map(function (progress) {
return {at: progress, expect: settings.to};
});
test_interpolation(settings, expectatFrom.concat(expectatTo));
}

View file

@ -0,0 +1,32 @@
<!DOCTYPE html>
<title>CSS Overflow and Transforms: css-overflow-3</title>
<link rel="author" title="mailto:atotic@google.com">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<link rel="help" href="https://www.w3.org/TR/css-overflow-3/#scrollable">
<meta name="assert" content="css transform is used to compute scroll overflow of abspos children">
<style>
#container {
position: relative;
overflow: auto;
width: 200px;
height: 200px;
}
#target {
position: absolute;
width: 150px;
height: 150px;
margin-left: 100px;
transform: translateX(-100px);
background: green;
}
</style>
<!-- There should be no scrollbars on this page -->
<div id="container">
<div id="target"></div>
</div>
<script>
test(() => {
assert_equals(document.querySelector("#container").scrollWidth, 200);
}, '#target used transform when computing scroll overflow');
</script>

View file

@ -0,0 +1,39 @@
<!DOCTYPE html>
<title>CSS Overflow and Transforms: css-overflow-3</title>
<link rel="author" title="mailto:atotic@google.com">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<link rel="help" href="https://www.w3.org/TR/css-overflow-3/#scrollable">
<meta name="assert" content="css transform is used to compute scroll overflow of inline-block children">
<style>
#container {
border: 1px solid black;
width: 200px;
overflow: auto;
}
#target {
display: inline-block;
width: 20px;
height: 20px;
background: green;
position: relative;
top: 100px;
transform: translateY(80px);
}
</style>
<!--
#container should have vertical scrollbar because target is offset
by position:relative and transform.
-->
<div id="container">
<span>
scroll
<div id="target"></div>
down
</span>
</div>
<script>
test(() => {
assert_equals(document.querySelector("#container").scrollHeight, 200);
}, '#target used transform when computing scroll overflow');
</script>

View file

@ -3,7 +3,7 @@
<script src="/resources/testharnessreport.js"></script>
<style>
#space { height: 4000px; }
#space { height: 1000px; }
#ancestor { position: relative; }
#before, #anchor { height: 100px; }
#anchor { background-color: green; }

View file

@ -6,7 +6,7 @@
#changer { height: 1500px; }
#anchor {
width: 150px;
height: 4000px;
height: 1000px;
background-color: pink;
}

View file

@ -3,7 +3,7 @@
<script src="/resources/testharnessreport.js"></script>
<style>
body { height: 4000px; }
body { height: 1000px; }
div { height: 100px; }
</style>

View file

@ -3,7 +3,7 @@
<script src="/resources/testharnessreport.js"></script>
<style>
body { height: 4000px; }
body { height: 1000px; }
#outer { width: 300px; }
#outer:after { content: " "; clear:both; display: table; }
#float {

View file

@ -3,7 +3,7 @@
<script src="/resources/testharnessreport.js"></script>
<style>
body { height: 4000px; }
body { height: 1000px; }
#outer { width: 300px; }
#zeroheight { height: 0px; }
#changer { height: 100px; background-color: red; }

View file

@ -3,7 +3,7 @@
<script src="/resources/testharnessreport.js"></script>
<style>
body { height: 4000px; margin: 0; }
body { height: 1000px; margin: 0; }
#fixed, #content { width: 200px; height: 100px; }
#fixed { position: fixed; left: 100px; top: 50px; }
#before { height: 50px; }

View file

@ -3,7 +3,7 @@
<script src="/resources/testharnessreport.js"></script>
<style>
body { height: 4000px }
body { height: 1000px }
#outer { line-height: 100px }
#ib1, #ib2 { display: inline-block }

View file

@ -4,7 +4,7 @@
<style>
#space {
height: 4000px;
height: 1000px;
}
#header {
background-color: #F5B335;

View file

@ -32,11 +32,9 @@ html.vrl { writing-mode: vertical-rl; }
.vpush { height: 80px !important; }
.hpush { width: 70px !important; }
#anchor-container {
display: inline-block;
}
#anchor {
position: relative;
display: inline-block;
background-color: #8e8;
min-width: 100px;
min-height: 100px;
@ -51,10 +49,8 @@ html.vrl { writing-mode: vertical-rl; }
</style>
<div id="container">
<div id="block_pusher"></div><br>
<div id="inline_pusher"></div><div id="anchor-container">
<div id="anchor">
<div id="grower"></div>
</div>
<div id="inline_pusher"></div><div id="anchor">
<div id="grower"></div>
</div>
</div>
<script>

View file

@ -3,7 +3,7 @@
<script src="/resources/testharnessreport.js"></script>
<style>
body { height: 4000px }
body { height: 1000px }
#A, #B { width: 100px; background-color: #afa; }
#B { height: 100px; }
#inner { width: 100px; height: 100px; background-color: pink; }

View file

@ -7,7 +7,7 @@ body {
position: absolute;
font-size: 100px;
width: 200px;
height: 4000px;
height: 1000px;
line-height: 100px;
}

View file

@ -10,16 +10,7 @@ connect to the device.
## Hosts
Until we find a better way, we need to root the Android device and update the
/etc/hosts file to include
```
127.0.0.1 web-platform.test
127.0.0.1 www.web-platform.test
127.0.0.1 www1.web-platform.test
127.0.0.1 www2.web-platform.test
127.0.0.1 xn--n8j6ds53lwwkrqhv28a.web-platform.test
127.0.0.1 xn--lve-6lad.web-platform.test
```
/etc/hosts file to include the entries printed by `./wpt make-hosts-file`.
## CA certificate

View file

@ -3,34 +3,19 @@
importScripts("/resources/testharness.js");
importScripts("/resources/WebIDLParser.js", "/resources/idlharness.js");
function doTest([html, dom, cssom, touchevents, uievents]) {
var idlArray = new IdlArray();
idlArray.add_untested_idls(dom + cssom + touchevents + uievents);
idlArray.add_idls(html);
idlArray.add_objects({
WorkerNavigator: ['self.navigator'],
WebSocket: ['new WebSocket("ws://foo")'],
CloseEvent: ['new CloseEvent("close")'],
Worker: [],
MessageEvent: ['new MessageEvent("message", { data: 5 })'],
DedicatedWorkerGlobalScope: ['self'],
});
idlArray.test();
};
function fetchData(url) {
return fetch(url).then((response) => response.text());
}
promise_test(function() {
return Promise.all([fetchData("/interfaces/html.idl"),
fetchData("/interfaces/dom.idl"),
fetchData("/interfaces/cssom.idl"),
fetchData("/interfaces/touch-events.idl"),
fetchData("/interfaces/uievents.idl")])
.then(doTest);
}, "Test driver");
idl_test(
["html"],
["dom", "cssom", "touch-events", "uievents"],
idlArray => {
idlArray.add_objects({
WorkerNavigator: ['self.navigator'],
WebSocket: ['new WebSocket("ws://foo")'],
CloseEvent: ['new CloseEvent("close")'],
Worker: [],
MessageEvent: ['new MessageEvent("message", { data: 5 })'],
DedicatedWorkerGlobalScope: ['self'],
});
}
);
done();

View file

@ -3,6 +3,7 @@
<title>Selector: pseudo-classes (:link)</title>
<link rel="author" title="Denis Ah-Kang" href="mailto:denis@w3.org" id=link1>
<link rel=help href="https://html.spec.whatwg.org/multipage/#pseudo-classes" id=link2>
<link rel=stylesheet href="non-existent.css" id=link3>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="utils.js"></script>

View file

@ -154,7 +154,7 @@ class FennecBrowser(FirefoxBrowser):
"apz.allow_zooming": False,
"android.widget_paints_background": False,
# Ensure that scrollbars are always painted
"ui.scrollbarFadeBeginDelay": 100000})
"layout.testing.overlay-scrollbars.always-visible": True})
if self.install_fonts:
self.logger.debug("Copying Ahem font to profile")

View file

@ -166,7 +166,9 @@ class ServoWebDriverBrowser(Browser):
command=" ".join(self.command))
def is_alive(self):
return self.proc.poll() is None
if self.runner:
return self.runner.is_running()
return False
def cleanup(self):
self.stop()

View file

@ -679,18 +679,6 @@ const gCSSProperties = {
{ type: 'discrete', options: [ [ '". . a b" ". .a b"', 'none' ] ] }
]
},
'grid-template-columns': {
// https://drafts.csswg.org/css-template/#grid-template-columns
types: [
{ type: 'discrete', options: [ [ '1px', '5px' ] ] }
]
},
'grid-template-rows': {
// https://drafts.csswg.org/css-template/#grid-template-rows
types: [
{ type: 'discrete', options: [ [ '1px', '5px' ] ] }
]
},
'height': {
// https://drafts.csswg.org/css21/visudet.html#propdef-height
types: [

View file

@ -108,7 +108,7 @@
};
await pc.setLocalDescription(offer);
eventSequence += 'setLocalDescription;';
await signalingstatechangeResolver.promise;
await signalingstatechangeResolver;
assert_equals(eventSequence, 'onsignalingstatechange;setLocalDescription;');
}, 'onsignalingstatechange fires before setLocalDescription resolves');

View file

@ -114,4 +114,22 @@
}));
}, `setRemoteDescription(rollback) should ignore invalid sdp content and succeed`);
promise_test(async t => {
const pc1 = new RTCPeerConnection();
const pc2 = new RTCPeerConnection();
t.add_cleanup(() => pc1.close());
t.add_cleanup(() => pc2.close());
// We don't use this right away
const offer1 = await pc1.createOffer({offerToReceiveAudio: true});
// Create offer from pc2, apply and rollback on pc1
const offer2 = await pc2.createOffer({offerToReceiveAudio: true});
await pc1.setRemoteDescription(offer2);
await pc1.setRemoteDescription({type: "rollback"});
// Then try applying pc1's old offer
await pc1.setLocalDescription(offer1);
}, `local offer created before setRemoteDescription(remote offer) then rollback should still be usable`);
</script>

View file

@ -40,9 +40,6 @@
function onFrame(time, xrFrame) {
assert_true(xrFrame instanceof XRFrame);
assert_not_equals(xrFrame.views, null);
assert_equals(xrFrame.views.length, 2);
let viewerPose = xrFrame.getViewerPose(referenceSpace);
assert_not_equals(viewerPose, null);
@ -50,10 +47,13 @@
assert_equals(viewerPose.poseModelMatrix[i], identityMatrix[i]);
}
assert_not_equals(viewerPose.getViewMatrix(xrFrame.views[0]), null);
assert_equals(viewerPose.getViewMatrix(xrFrame.views[0]).length, 16);
assert_not_equals(viewerPose.getViewMatrix(xrFrame.views[1]), null);
assert_equals(viewerPose.getViewMatrix(xrFrame.views[1]).length, 16);
assert_not_equals(viewerPose.views, null);
assert_equals(viewerPose.views.length, 2);
assert_not_equals(viewerPose.views[0].viewMatrix, null);
assert_equals(viewerPose.views[0].viewMatrix.length, 16);
assert_not_equals(viewerPose.views[1].viewMatrix, null);
assert_equals(viewerPose.views[1].viewMatrix.length, 16);
// Test does not complete until the returned promise resolves.
resolve();