random-item-in-keyframe.html

<!DOCTYPE html>
<title>CSS Values and Units Test: random-item() in @keyframes</title>
<link rel="help" href="https://drafts.csswg.org/css-values-5/#funcdef-random-item">
<link rel="author" title="Joanne Pan" href="https://github.com/J0pan">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
  @keyframes --anim {
    from {
        color: rgb(0, 0, 0);
        color: random-item(fixed 0, rgb(1, 0, 0), rgb(0, 1, 0));
    }
    to {
        color: rgb(0, 0, 0);
    }
  }
  #target {
    animation: --anim 1000s step-end;
  }
</style>
<div id="target"></div>
<script>
  test(() => {
    assert_equals(getComputedStyle(target).color, "rgb(1, 0, 0)");
  }, "random-item() is not ignored in a keyframe");
</script>