gap-decorations-outset-neutral-keyframe-002.html

Enable keyboard shortcuts

This test has a WPT meta file that expects 1 subtest issues.
This WPT test may be referenced by the following Test IDs:
- /css/css-gaps/animation/gap-decorations-outset-neutral-keyframe-002.html - WPT Dashboard Interop Dashboard

<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8">

    <title>gap decorations column-rule-inset properties support neutral keyframe</title>

    <link rel="help" href="https://drafts.csswg.org/css-gaps-1/#outset">

    <meta name="assert" content="gap decorations column-rule-inset value list supports neutral keyframe.">

    <script src="/resources/testharness.js"></script>

    <script src="/resources/testharnessreport.js"></script>

    <script src="/css/support/interpolation-testcommon.js"></script>

  </head>

  <body>

    <div id="target"></div>

    <script>

      test(() => {

        target.style.columnRuleStyle = 'solid';

        target.style.columnRuleEdgeStartInset = '1px';

        target.style.columnRuleEdgeEndInset = '1px';

        target.style.columnRuleInteriorStartInset = '1px';

        target.style.columnRuleInteriorEndInset = '1px';

        var animation = target.animate([{}, {columnRuleEdgeStartInset: '11px'}], 1000);

        animation.pause();

        animation.currentTime = 500;

        assert_equals(getComputedStyle(target).columnRuleEdgeStartInset, '6px');

        var animation2 = target.animate([{}, {columnRuleEdgeEndInset: '11px'}], 1000);

        animation2.pause();

        animation2.currentTime = 500;

        assert_equals(getComputedStyle(target).columnRuleEdgeEndInset, '6px');

        var animation3 = target.animate([{}, {columnRuleInteriorStartInset: '11px'}], 1000);

        animation3.pause();

        animation3.currentTime = 500;

        assert_equals(getComputedStyle(target).columnRuleInteriorStartInset, '6px');

        var animation4 = target.animate([{}, {columnRuleInteriorEndInset: '11px'}], 1000);

        animation4.pause();

        animation4.currentTime = 500;

        assert_equals(getComputedStyle(target).columnRuleInteriorEndInset, '6px');

      }, 'gap decorations column-rule-inset properties support neutral keyframe.');

    </script>

  </body>

</html>