<!DOCTYPE HTML>
<html>
<head>
<script src="../../resources/js-test.js"></script>
</head>
<body>
  <div id="p"></div>
  <div id="q"><div id="r"></div></div>
  <script type="text/javascript">
    function testEmptyIsBoth(stylesheet, target) {
      cssRule = stylesheet.cssRules.item(0);
      shouldBe("cssRule.type", "cssRule.STYLE_RULE");
      declaration = cssRule.style;
      shouldBe("declaration.length", "0");
      shouldBeEqualToString("declaration.getPropertyValue('font-synthesis')", "");
      computedStyle = getComputedStyle(target);
      shouldBeEqualToString("computedStyle.getPropertyValue('font-synthesis')", "weight style small-caps");
      stylesheet.deleteRule(0);
    }

    function testInitialIsBoth(stylesheet, target) {
      cssRule = stylesheet.cssRules.item(0);
      shouldBe("cssRule.type", "cssRule.STYLE_RULE");
      declaration = cssRule.style;
      shouldBe("declaration.length", "3");
      shouldBeEqualToString("declaration.getPropertyValue('font-synthesis')", "initial");
      computedStyle = getComputedStyle(target);
      shouldBeEqualToString("computedStyle.getPropertyValue('font-synthesis')", "weight style small-caps");
      stylesheet.deleteRule(0);
    }

    function testWeight(stylesheet, target) {
      cssRule = stylesheet.cssRules.item(0);
      shouldBe("cssRule.type", "cssRule.STYLE_RULE");
      declaration = cssRule.style;
      shouldBe("declaration.length", "3");
      shouldBeEqualToString("declaration.getPropertyValue('font-synthesis')", "weight");
      computedStyle = getComputedStyle(target);
      shouldBeEqualToString("computedStyle.getPropertyValue('font-synthesis')", "weight");
      stylesheet.deleteRule(0);
    }

    function testStyle(stylesheet, target) {
      cssRule = stylesheet.cssRules.item(0);
      shouldBe("cssRule.type", "cssRule.STYLE_RULE");
      declaration = cssRule.style;
      shouldBe("declaration.length", "3");
      shouldBeEqualToString("declaration.getPropertyValue('font-synthesis')", "style");
      computedStyle = getComputedStyle(target);
      shouldBeEqualToString("computedStyle.getPropertyValue('font-synthesis')", "style");
      stylesheet.deleteRule(0);
    }

    function testWeightAndStyle(stylesheet, target) {
      cssRule = stylesheet.cssRules.item(0)
      shouldBe("cssRule.type", "cssRule.STYLE_RULE");
      declaration = cssRule.style;
      shouldBe("declaration.length", "3");
      shouldBeEqualToString("declaration.getPropertyValue('font-synthesis')", "weight style");
      computedStyle = getComputedStyle(target);
      shouldBeEqualToString("computedStyle.getPropertyValue('font-synthesis')", "weight style");
      stylesheet.deleteRule(0);
    }

    function testStyleAndWeight(stylesheet, target) {
      cssRule = stylesheet.cssRules.item(0);
      shouldBe("cssRule.type", "cssRule.STYLE_RULE");
      declaration = cssRule.style;
      shouldBe("declaration.length", "3");
      shouldBeEqualToString("declaration.getPropertyValue('font-synthesis')", "weight style");
      computedStyle = getComputedStyle(target);
      shouldBeEqualToString("computedStyle.getPropertyValue('font-synthesis')", "weight style");
      stylesheet.deleteRule(0);
    }

    var styleElement = document.createElement("style");
    document.head.appendChild(styleElement);
    stylesheet = styleElement.sheet;
    var target = document.getElementById("p");

    stylesheet.insertRule("#p { }", 0);
    testEmptyIsBoth(stylesheet, target);

    stylesheet.insertRule("#p { font-synthesis: initial }", 0);
    testInitialIsBoth(stylesheet, target);

    stylesheet.insertRule("#p { font-synthesis: weight }", 0);
    testWeight(stylesheet, target);

    stylesheet.insertRule("#p { font-synthesis: style }", 0);
    testStyle(stylesheet, target);

    stylesheet.insertRule("#p { font-synthesis: weight style }", 0);
    testWeightAndStyle(stylesheet, target);

    stylesheet.insertRule("#p { font-synthesis: style weight }", 0);
    testStyleAndWeight(stylesheet, target);

    stylesheet.insertRule("#p { font-synthesis: garbage style }", 0);
    testEmptyIsBoth(stylesheet, target);

    stylesheet.insertRule("#p { font-synthesis: style garbage }", 0);
    testEmptyIsBoth(stylesheet, target);

    stylesheet.insertRule("#p { font-synthesis: garbage style garbage }", 0);
    testEmptyIsBoth(stylesheet, target);

    stylesheet.insertRule("#p { font-synthesis: style garbage style }", 0);
    testEmptyIsBoth(stylesheet, target);

    stylesheet.insertRule("#p { font-synthesis: weight garbage }", 0);
    testEmptyIsBoth(stylesheet, target);

  </script>
</body>
</html>