svg-responsive-to-updated-baseval.html

<!DOCTYPE html>
<title>SVG Web Animations should be responsive to changes in the underlying value</title>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script>
// offset has a primitive animVal type.
function createOffsetTestTarget() {
  var target = document.createElementNS('http://www.w3.org/2000/svg', 'stop');
  target.setAttribute('offset', '0');
  var animation = target.animate({'svg-offset': '1'}, 1);
  animation.pause();
  animation.currentTime = 0.5;
  assert_equals(target.offset.animVal, 0.5, 'Initial get animVal');
  return target;
}

test(() => {
  var target = createOffsetTestTarget();
  target.setAttribute('offset', '0.5');
  assert_equals(target.offset.animVal, 0.75);
}, document.title + ': setAttribute() -> get primitive animVal');

test(() => {
  var target = createOffsetTestTarget();
  target.offset.baseVal = '0.5';
  assert_equals(target.offset.animVal, 0.75);
}, document.title + ': set baseVal -> get primitive animVal');


function serializeRect(rect) {
  return [rect.x, rect.y, rect.width, rect.height].join(' ');
}

// viewBox has a tear-off animVal type.
function createViewBoxTestTarget() {
  var target = document.createElementNS('http://www.w3.org/2000/svg', 'marker');
  target.setAttribute('viewBox', '0 0 0 0');
  var animation = target.animate({'svg-viewBox': '1 1 1 1'}, 1);
  animation.pause();
  animation.currentTime = 0.5;
  assert_equals(serializeRect(target.viewBox.animVal), '0.5 0.5 0.5 0.5', 'Initial get animVal');
  return target;
}

test(() => {
  var target = createViewBoxTestTarget();
  var animVal = target.viewBox.animVal;
  target.setAttribute('viewBox', '0.5 0.5 0.5 0.5');
  assert_equals(serializeRect(animVal), '0.75 0.75 0.75 0.75');
}, document.title + ': setAttribute() -> read tear-off animVal');

test(() => {
  var target = createViewBoxTestTarget();
  var animVal = target.viewBox.animVal;
  var baseVal = target.viewBox.baseVal;
  baseVal.x = 0.5;
  baseVal.y = 0.5;
  baseVal.width = 0.5;
  baseVal.height = 0.5;
  assert_equals(serializeRect(animVal), '0.75 0.75 0.75 0.75');
}, document.title + ': set baseVal -> read tear-off animVal');
</script>
chromium/third_party/blink/web_tests/animations/responsive/svg-responsive-to-updated-baseval.html
