Bug 1598432 [wpt PR 20372] - Port z-index interpolation to wpt, a=testonly

Automatic update from web-platform-tests
Port z-index interpolation to wpt

Firefox passed
Chrome failed. Bug filed: https://crbug.com/375982

Bug: 900581
Change-Id: I33488661e2938c3fae6bef27ea6672b77047de84
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1925347
Reviewed-by: Xida Chen <xidachen@chromium.org>
Commit-Queue: Hao Sheng <haozhes@chromium.org>
Cr-Commit-Position: refs/heads/master@{#718319}

--

wpt-commits: 51a95630a46ba0804c37abf802b9e50f0be255b3
wpt-pr: 20372
This commit is contained in:
haozhe 2019-11-26 11:32:11 +00:00 коммит произвёл moz-wptsync-bot
Родитель d7760ea744
Коммит e4682cd81f
1 изменённых файлов: 130 добавлений и 0 удалений

Просмотреть файл

@ -0,0 +1,130 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>z-index interpolation</title>
<link rel="help" href="https://www.w3.org/TR/CSS2/visuren.html#z-index">
<meta name="assert" content="z-index supports animation">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
body {
margin-top: 20px;
}
.layer-reference {
position: fixed;
top: 0px;
height: 100vh;
width: 50px;
background-color: rgba(255, 255, 255, 0.75);
font-family: sans-serif;
text-align: center;
padding-top: 5px;
border: 1px solid;
}
.parent {
z-index: 15;
}
.target {
position: relative;
width: 350px;
height: 10px;
z-index: -2;
}
.actual {
background-color: black;
}
.expected {
background-color: green;
}
</style>
<body></body>
<script>
test_interpolation({
property: 'z-index',
from: neutralKeyframe,
to: '5',
}, [
{at: -0.3, expect: '-4'},
{at: 0, expect: '-2'},
{at: 0.3, expect: '0'},
{at: 0.6, expect: '2'},
{at: 1, expect: '5'},
{at: 1.5, expect: '9'},
]);
test_no_interpolation({
property: 'z-index',
from: 'initial',
to: '5',
});
// We fail to inherit correctly due to style overadjustment: crbug.com/375982
test_interpolation({
property: 'z-index',
from: 'inherit',
to: '5',
}, [
{at: -0.3, expect: '18'},
{at: 0, expect: '15'},
{at: 0.3, expect: '12'},
{at: 0.6, expect: '9'},
{at: 1, expect: '5'},
{at: 1.5, expect: '0'},
]);
test_no_interpolation({
property: 'z-index',
from: 'unset',
to: '5',
});
test_interpolation({
property: 'z-index',
from: '-5',
to: '5'
}, [
{at: -0.3, expect: '-8'},
{at: 0, expect: '-5'},
{at: 0.3, expect: '-2'},
{at: 0.6, expect: '1'},
{at: 1, expect: '5'},
{at: 1.5, expect: '10'},
]);
test_interpolation({
property: 'z-index',
from: '2',
to: '4'
}, [
{at: -0.3, expect: '1'},
{at: 0, expect: '2'},
{at: 0.3, expect: '3'},
{at: 0.6, expect: '3'},
{at: 1, expect: '4'},
{at: 1.5, expect: '5'},
]);
test_interpolation({
property: 'z-index',
from: '-2',
to: '-4'
}, [
{at: -0.3, expect: '-1'},
{at: 0, expect: '-2'},
{at: 0.1, expect: '-2'},
{at: 0.3, expect: '-3'},
{at: 0.6, expect: '-3'},
{at: 1, expect: '-4'},
{at: 1.5, expect: '-5'},
]);
test_no_interpolation({
property: 'z-index',
from: 'auto',
to: '10',
});
</script>