constructor.html - mozsearch

Enable keyboard shortcuts

This test has a WPT meta file that expects 7 subtest issues.
This WPT test may be referenced by the following Test IDs:
- /web-animations/interfaces/AnimationTrigger/constructor.html - WPT Dashboard Interop Dashboard

<!DOCTYPE html>

<meta charset=utf-8>

<title>AnimationTrigger constructor</title>

<link rel="help"

      href="https://drafts.csswg.org/web-animations-2/#the-animationtrigger-interface">

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

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

<script src="../../testcommon.js"></script>

<body>

<script>

  test(t => {

    const trigger = new AnimationTrigger();

    assert_equals(trigger.type, "once", "default type is once.");

    assert_equals(trigger.timeline, document.timeline,

      "default timeline is document.timeline.");

    assert_equals(trigger.rangeStart, "normal", "default rangeStart is normal");

    assert_equals(trigger.rangeEnd, "normal", "default rangeEnd is normal");

    assert_equals(trigger.exitRangeStart, "normal",

      "default exitRangeStart is normal");

    assert_equals(trigger.exitRangeStart, "normal",

      "default exitRangeEnd is normal");

  }, "Default values when no property bag is supplied");

  test(t => {

    const trigger = new AnimationTrigger({});

    assert_equals(trigger.type, "once", "default type is once.");

    assert_equals(trigger.timeline, document.timeline,

      "default timeline is document.timeline.");

    assert_equals(trigger.rangeStart, "normal", "default rangeStart is normal");

    assert_equals(trigger.rangeEnd, "normal", "default rangeEnd is normal");

    assert_equals(trigger.exitRangeStart, "normal",

      "default exitRangeStart is normal");

    assert_equals(trigger.exitRangeEnd, "normal",

      "default exitRangeEnd is normal");

  }, "Default values when an empty property bag is supplied.");

  test(t => {

    const scroll_timeline = new ScrollTimeline();

    const trigger = new AnimationTrigger({

      type: "repeat",

      timeline: scroll_timeline,

      rangeStart: "contain 10%",

      rangeEnd: "contain 90%",

      exitRangeStart: "cover 10%",

      exitRangeEnd: "cover 90%"

});

    assert_equals(trigger.type, "repeat", "default type is repeat.");

    assert_equals(trigger.timeline, scroll_timeline,

      "timeline is supplied scroll timeline.");

    assert_equals(trigger.rangeStart, "contain 10%",

      "rangeStart is supplied value");

    assert_equals(trigger.rangeEnd, "contain 90%",

      "rangeEnd is supplied value");

    assert_equals(trigger.exitRangeStart, "cover 10%",

      "exitRangeStart is supplied value");

    assert_equals(trigger.exitRangeEnd, "cover 90%",

      "exitRangeEnd is supplied value");

  }, "All values supplied (scroll timeline).");

  test(t => {

    const view_timeline = new ViewTimeline();

    const trigger = new AnimationTrigger({

      type: "repeat",

      timeline: view_timeline,

      rangeStart: "contain 10%",

      rangeEnd: "contain 90%",

      exitRangeStart: "cover 10%",

      exitRangeEnd: "cover 90%"

});

    assert_equals(trigger.type, "repeat", "type is supplied type.");

    assert_equals(trigger.timeline, view_timeline,

      "timeline is supplied scroll timeline.");

    assert_equals(trigger.rangeStart, "contain 10%",

      "rangeStart is supplied value");

    assert_equals(trigger.rangeEnd, "contain 90%",

      "rangeEnd is supplied value");

    assert_equals(trigger.exitRangeStart, "cover 10%",

      "exitRangeStart is supplied value");

    assert_equals(trigger.exitRangeEnd, "cover 90%",

      "exitRangeEnd is supplied value");

  }, "All values supplied (view timeline).");

  test(t => {

    const trigger = new AnimationTrigger();

    assert_equals(trigger.type, "once", "default type is once.");

    trigger.type = "alternate";

    assert_equals(trigger.type, "alternate", "valid type change is honored.");

    trigger.type = "etanretla";

    assert_equals(trigger.type, "alternate", "invalid type change is ignored.");

  }, "Set AnimationTrigger.type.");

  test(t => {

    const trigger = new AnimationTrigger();

    assert_equals(trigger.timeline, document.timeline,

      "default timeline is document.timeline.");

    const scroll_timeline = new ScrollTimeline();

    trigger.timeline = scroll_timeline;

    assert_equals(trigger.timeline, scroll_timeline,

      "valid timeline change is honored.");

    assert_throws_js(TypeError, () => {

      trigger.timeline = document.createElement("div");

});

    assert_equals(trigger.timeline, scroll_timeline,

      "invalid timeline change is ignored.");

  }, "Set AnimationTrigger.timeline.");

  test(t => {

    const trigger = new AnimationTrigger();

    assert_equals(trigger.rangeStart, "normal",

    "default rangeStart is normal.");

    const rangeOffset = { rangeName: "entry", offset: CSS.percent("20") };

    // Valid values

    trigger.rangeStart = rangeOffset;

    assert_true(typeof(trigger.rangeStart) == "object",

      "trigger.rangeStart is an object");

    assert_equals(trigger.rangeStart.rangeName, rangeOffset.rangeName,

      "valid rangeStart (TimelineRange.rangeName) change is honored.");

    assert_equals(trigger.rangeStart.offset, rangeOffset.offset,

      "valid rangeStart (TimelineRange.offset) change is honored.");

    trigger.rangeStart = "contain 10%";

    assert_equals(trigger.rangeStart, "contain 10%",

      "valid rangeStart (string) change is honored.");

    // Invalid values

    let func = () => {

      trigger.rangeStart = "totally not a valid rangeStart";

    assert_throws_js(TypeError, func);

    func = () => {

      trigger.rangeStart = { rangeName: 'invalid' };

    assert_throws_js(TypeError, func);

    func = () => {

      trigger.rangeStart = { offset: 'invalid' };

    assert_throws_js(TypeError, func);

  }, "Set AnimationTrigger.rangeStart.");

</script>