<!DOCTYPE html>
<meta charset="utf-8">
<title>SVG presentation attributes - special cases</title>
<link rel="help" href="https://svgwg.org/svg2-draft/styling.html#PresentationAttributes">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="presentation-attributes.js"></script>
<svg id="svg"></svg>
<script>
// 1. Test the special cases where presentation attributes are only allowed on
// a specific set of elements.

if (propertiesAreSupported(["cx", "cy"])) {
  for (let e of ["circle", "ellipse"]) {
    test(function() {
      for (let p of ["cx", "cy"]) {
        assertPresentationAttributeIsSupported(e, p, "1", p);
      }
    }, `cx and cy presentation attributes supported on ${e} element`);
  }
}

if (propertiesAreSupported(["x", "y", "width", "height"])) {
  for (let e of ["foreignObject", "image", "rect", "svg", "symbol", "use"]) {
    test(function() {
      for (let p of ["x", "y", "width", "height"]) {
        assertPresentationAttributeIsSupported(e, p, "1", p);
      }
    }, `x, y, width, and height presentation attributes supported on ${e} element`);
  }
}

if (CSS.supports("r", "initial")) {
  test(function() {
    assertPresentationAttributeIsSupported("circle", "r", "1", "r");
  }, `r presentation attribute supported on circle element`);
}

if (propertiesAreSupported(["rx", "ry"])) {
  for (let e of ["ellipse", "rect"]) {
    test(function() {
      for (let p of ["rx", "ry"]) {
        assertPresentationAttributeIsSupported(e, p, "1", p);
      }
    }, `rx and ry presentation attributes supported on ${e} element`);
  }
}

if (CSS.supports("d", "initial")) {
  test(function() {
    assertPresentationAttributeIsSupported("path", "d", "M0,0 L1,1", "d");
  }, `d presentation attribute supported on path element`);
}


// 2. Test that for those presentation attributes only allowed on a specific
// set of elements, that they are not supported on some other SVG element.
// (We use 'g' as that element for testing.)

if (propertiesAreSupported(["cx", "cy"])) {
  test(function() {
    for (let p of ["cx", "cy"]) {
      assertPresentationAttributeIsNotSupported("g", p, "1", p);
    }
  }, `cx and cy presentation attributes not supported on other elements`);
}

if (propertiesAreSupported(["x", "y", "width", "height"])) {
  test(function() {
    for (let p of ["x", "y", "width", "height"]) {
      assertPresentationAttributeIsNotSupported("g", p, "1", p);
    }
  }, `x, y, width, and height presentation attributes not supported on other elements`);
}

if (CSS.supports("r", "initial")) {
  test(function() {
    assertPresentationAttributeIsNotSupported("g", "r", "1", "r");
  }, `r presentation attribute not supported on other elements`);
}

if (propertiesAreSupported(["rx", "ry"])) {
  test(function() {
    for (let p of ["rx", "ry"]) {
      assertPresentationAttributeIsNotSupported("g", p, "1", p);
    }
  }, `rx and ry presentation attributes not supported on other elements`);
}

if (CSS.supports("d", "initial")) {
  test(function() {
    assertPresentationAttributeIsNotSupported("g", "d", "M0,0 L1,1", "d");
  }, `d presentation attribute not supported on other elements`);
}


// 3. Test that the fill presentation attribute is not supported on any
// animation elements.

if (CSS.supports("fill", "initial")) {
  for (let e of ["animate", "animateMotion", "animateTransform", "discard", "set"]) {
    test(function() {
      assertPresentationAttributeIsNotSupported(e, "fill", "blue", "fill");
    }, `fill presentation attribute not supported on ${e}`);
  }
}


if (CSS.supports("transform", "initial")) {
  // 4. Test support for the presentation attributes of the transform property,
  // which have a different spelling depending on which element they're on.

  test(function() {
    assertPresentationAttributeIsSupported("g", "transform", "scale(2)", "transform");
  }, `transform presentation attribute supported on g`);

  test(function() {
    assertPresentationAttributeIsSupported("pattern", "patternTransform", "scale(2)", "transform");
  }, `patternTransform presentation attribute supported on pattern`);

  for (let e of ["linearGradient", "radialGradient"]) {
    test(function() {
      assertPresentationAttributeIsSupported(e, "gradientTransform", "scale(2)", "transform");
    }, `patternTransform presentation attribute supported on ${e}`);
  }


  // 5. Test that the wrong spellings of the presentation attributes of the
  // transform property are not supported.

  test(function() {
    for (let e of ["pattern", "linearGradient", "radialGradient"]) {
      assertPresentationAttributeIsNotSupported(e, "transform", "scale(2)", "transform");
    }
  }, `transform presentation attribute not supported on pattern or gradient elements`);

  test(function() {
    for (let e of ["g", "linearGradient", "radialGradient"]) {
      assertPresentationAttributeIsNotSupported(e, "patternTransform", "scale(2)", "transform");
    }
  }, `patternTransform presentation attribute not supported on g or gradient elements`);

  test(function() {
    for (let e of ["g", "pattern"]) {
      assertPresentationAttributeIsNotSupported(e, "gradientTransform", "scale(2)", "transform");
    }
  }, `gradientTransform presentation attribute not supported on g or pattern elements`);
}
</script>
