Status: FAIL | Duration: 48ms | Subtests: 0/1 | Open test on wpt.live | wpt.fyi
/svg/animations/animate-dynamic-update-attributeName.html
<!doctype html> <html> <meta charset="utf-8"> <title>Test behavior on dynamic-update of attributeName</title> <script src="/resources/testharness.js"></script> <script src="/resources/testharnessreport.js"></script> <script src="/resources/SVGAnimationTestCase-testharness.js"></script> <svg> </svg> <script> var rootSVGElement = document.querySelector("svg"); var epsilon = 1.0; // Setup test document var rect = createSVGElement("rect"); rect.setAttribute("id", "rect"); rect.setAttribute("width", "200"); rect.setAttribute("height", "200"); rect.setAttribute("fill", "red"); rect.setAttribute("color", "red"); rect.setAttribute("onclick", "executeTest()"); var animate = createSVGElement("animate"); animate.setAttribute("id", "animation"); animate.setAttribute("attributeName", "color"); animate.setAttribute("from", "green"); animate.setAttribute("to", "green"); animate.setAttribute("begin", "0s"); animate.setAttribute("dur", "3s"); animate.setAttribute("fill", "freeze"); animate.setAttribute("calcMode", "discrete"); rect.appendChild(animate); rootSVGElement.appendChild(rect); // Setup animation test function sample1() { expectColor(rect, 255, 0, 0); assert_equals(rect.style.color, ""); } function sample2() { expectColor(rect, 0, 128, 0); assert_equals(rect.style.color, ""); } function sample3() { // Set 'attributeName' from 'color' to 'fill' animate.setAttribute("attributeName", "fill"); } function sample4() { expectFillColor(rect, 0, 128, 0); assert_equals(rect.style.color, ""); assert_equals(rect.style.fill, ""); } smil_async_test((t) => { const expectedValues = [ // [animationId, time, sampleCallback] ["animation", 0.0, sample1], ["animation", 0.001, sample2], ["animation", 1.5, sample3], ["animation", 3.0, sample4], ]; runAnimationTest(t, expectedValues); }); </script>