effect-value-opacity-replaced-effect.html

Enable keyboard shortcuts

This WPT test may be referenced by the following Test IDs:
- /web-animations/animation-model/keyframe-effects/effect-value-opacity-replaced-effect.html - WPT Dashboard Interop Dashboard

<!doctype html>

<html class="reftest-wait">

<head>

<meta charset=utf-8>

<title>The effect value of consecutive animations targeting 'opacity'</title>

<link rel="help" href="https://drafts.csswg.org/web-animations/">

<link rel="match" href="effect-value-opacity-replaced-effect-ref.html">

<style>

div {

  width: 100px;

  height: 100px;

  background: green;

  will-change: opacity;

</style>

</head>

<body>

<div></div>

<script>

'use strict';

(async function () {

  const div = document.querySelector('div');

  await div.animate({ opacity: [1, 0] }, { duration: 10, fill: 'both' }).finished;

  await div.animate({ opacity: [0, 1] }, { duration: 10, fill: 'both' }).finished;

  document.documentElement.classList.remove("reftest-wait");

})();

</script>

</body>

</html>