Commit c937145a authored by Chromium WPT Sync's avatar Chromium WPT Sync Committed by Commit Bot

Import wpt@f3248c35c979b8d4a2f3ad7faa028e0d2667044a

Using wpt-import in Chromium 7b9b3dd3.
With Chromium commits locally applied on WPT:
c4dc3441 "[WPT] Reland Upload a test for sending mouse events with key pressed"
fec827fb "Added wpt tests for overscroll customization."
a554ea37 "Reland "[EventTiming] Round instead of ceil the |duration|""
a06bcc90 "WebXR: Rename requestSession parameter variables to match use"
eeafcaee "[sms] Introduce testing infrastructure and handle some corner cases."
c9077e39 "Restore original tail-processing for ScriptProcessor and AudioWorklet"
faed29aa "[EventTiming] Remove unneeded prefix from WPT tests"


Note to sheriffs: This CL imports external tests and adds
expectations for those tests; if this CL is large and causes
a few new failures, please fix the failures by adding new
lines to TestExpectations rather than reverting. See:
https://chromium.googlesource.com/chromium/src/+/master/docs/testing/web_platform_tests.md

NOAUTOREVERT=true
TBR=lpz

No-Export: true
Change-Id: I6c55c3a79f1935d093cb5978bb028fedae865b5c
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1605344Reviewed-by: default avatarWPT Autoroller <wpt-autoroller@chops-service-accounts.iam.gserviceaccount.com>
Commit-Queue: WPT Autoroller <wpt-autoroller@chops-service-accounts.iam.gserviceaccount.com>
Cr-Commit-Position: refs/heads/master@{#658435}
parent b3584a03
<!DOCTYPE html>
<meta charset=utf-8>
<meta name="assert"
content="This test checks the output of frame timing functions with different frame numbers" />
<title>Frames timing function output tests</title>
<link rel="help"
href="https://drafts.csswg.org/css-timing/#frames-timing-functions">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="testcommon.js"></script>
<style>
@keyframes anim {
from { left: 0px; }
to { left: 100px; }
}
</style>
<body>
<div id="log"></div>
<script>
"use strict";
test(function(t) {
const div = createDiv(t);
div.style.animation = 'anim 10s frames(2) forwards';
assert_equals(getComputedStyle(div).left, '0px');
}, 'For an input progress of 0.0, the output of a frames timing function is ' +
'the first frame');
test(function(t) {
const div = createDiv(t);
div.style.animation = 'anim 10s frames(2) forwards';
div.style.animationDelay = '-4999ms';
assert_equals(getComputedStyle(div).left, '0px');
div.style.animationDelay = '-5000ms';
assert_equals(getComputedStyle(div).left, '100px');
}, 'At a frame boundary, the output of a frames timing function is the next ' +
'frame');
test(function(t) {
const div = createDiv(t);
div.style.animation = 'anim 10s frames(2) forwards';
div.style.animationDelay = '-10s';
assert_equals(getComputedStyle(div).left, '100px');
}, 'For an input progress of 1.0, the output of a frames timing function is ' +
'the final frame');
test(function(t) {
const div = createDiv(t);
div.style.animation = 'anim 11s frames(11) forwards';
// We have 11 frames in 11s, so the first step happens at 1.0.
div.style.animationDelay = '-999ms';
assert_equals(getComputedStyle(div).left, '0px');
div.style.animationDelay = '-1000ms';
assert_equals(getComputedStyle(div).left, '10px');
}, 'The number of frames is correctly reflected in the frames timing ' +
'function output');
test(function(t) {
const div = createDiv(t);
div.style.transition = 'left 11s frames(11)';
// We have 11 frames in 11s, so the first step happens at 1.0.
div.style.left = '0px';
div.style.transitionDelay = '-999ms';
getComputedStyle(div).left;
div.style.left = '100px';
assert_equals(getComputedStyle(div).left, '0px');
div.style.left = '0px';
div.style.transitionDelay = '-1000ms';
getComputedStyle(div).left;
div.style.left = '100px';
assert_equals(getComputedStyle(div).left, '10px');
}, 'The number of frames is correctly reflected in the frames timing ' +
'function output on CSS Transitions');
test(function(t) {
var target = createDiv(t);
target.style.position = 'absolute';
var anim = target.animate([ { left: '0px', easing: 'frames(2)' },
{ left: '100px' } ],
{ duration: 1000,
fill: 'forwards',
easing: 'cubic-bezier(0, 1.5, 1, 1.5)' });
// The bezier function produces values between 0.5 and 1 in
// (~0.0442, 0.23368), and values between 1 and 2 in (0.23368794, 1).
anim.currentTime = 0;
assert_equals(getComputedStyle(target).left, '0px');
anim.currentTime = 45;
assert_equals(getComputedStyle(target).left, '100px');
anim.currentTime = 230;
assert_equals(getComputedStyle(target).left, '100px');
anim.currentTime = 250;
assert_equals(getComputedStyle(target).left, '200px');
anim.currentTime = 1000;
assert_equals(getComputedStyle(target).left, '100px');
}, 'frames easing with input progress greater than 1');
test(function(t) {
var target = createDiv(t);
target.style.position = 'absolute';
var anim = target.animate([ { left: '0px', easing: 'frames(2)' },
{ left: '100px' } ],
{ duration: 1000,
fill: 'forwards',
easing: 'cubic-bezier(0, 3, 1, 3)' });
// The bezier funciton produces values:
// Input -> Output
// 0.0 0.0
// 0.114 ~ 0.245 1.5~2.0, so frames(2) is 3.0
// 0.245 ~ 0.6 2.0~2.4, so frames(2) is 4.0
// 0.6 ~ 0.882 2.4~2.0, so frames(2) is 4.0
// 0.882 ~ 0.976 2.0~1.5, so frames(2) is 3.0
// 1.0 1.0
anim.currentTime = 0;
assert_equals(getComputedStyle(target).left, '0px');
anim.currentTime = 114;
assert_equals(getComputedStyle(target).left, '300px');
anim.currentTime = 500;
assert_equals(getComputedStyle(target).left, '400px');
anim.currentTime = 900;
assert_equals(getComputedStyle(target).left, '300px');
}, 'frames easing with input progress greater than 1.5');
test(function(t) {
var target = createDiv(t);
target.style.position = 'absolute';
var anim = target.animate([ { left: '0px', easing: 'frames(2)' },
{ left: '100px' } ],
{ duration: 1000,
fill: 'forwards',
easing: 'cubic-bezier(0, -0.5, 1, -0.5)' });
// The bezier function produces negative values (but always greater than -0.5)
// in (0, 0.766312060).
anim.currentTime = 0;
assert_equals(getComputedStyle(target).left, '0px');
anim.currentTime = 750;
assert_equals(getComputedStyle(target).left, '-100px');
anim.currentTime = 800;
assert_equals(getComputedStyle(target).left, '0px');
anim.currentTime = 1000;
assert_equals(getComputedStyle(target).left, '100px');
}, 'frames easing with input progress less than 0');
</script>
</body>
......@@ -25,7 +25,7 @@
await new Promise(resolve => {
document.getElementById("volume").value = volume;
const utterance = new SpeechSynthesisUtterance();
utterance.text = "hello universe";
utterance.text = text;
utterance.volume = volume;
utterance.onend = resolve;
window.speechSynthesis.speak(utterance);
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment