condition-cssom.html | Explore in Territory

<!DOCTYPE html>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<style>
    @media screen and (min-width: 480px) {
        body { background-color: lightgreen; }
    }
    @media {
        body { background-color: red; }
    }
    @supports (width: 0) {
        s { width: 0; }
    }
</style>
<p>Test for @media CSSOM <a href="http://crbug.com/651792">bug 651792</a>.</p>
<script>
    test(function(){
        assert_equals(Object.getPrototypeOf(CSSMediaRule.prototype), CSSConditionRule.prototype);
        assert_equals(Object.getPrototypeOf(CSSSupportsRule.prototype), CSSConditionRule.prototype);
    }, "CSSConditionRule protype chain.");

    var rules = document.styleSheets[0].cssRules;
    test(function(){
        assert_equals(CSSRule.STYLE_RULE,1);
        assert_equals(CSSRule.MEDIA_RULE,4);
        assert_equals(rules.length, 3);
        assert_equals(rules[0].type, 4);
        assert_equals(rules[0].cssRules.length, 1);
        assert_equals(rules[0].cssRules[0].type, 1);
        assert_equals(rules[0].media.mediaText, "screen and (min-width: 480px)");
        assert_equals(rules[0].conditionText, "screen and (min-width: 480px)");
        assert_equals(rules[0].media.mediaText,rules[0].conditionText);
        assert_equals(rules[0].cssText,
                          "@media screen and (min-width: 480px) {\n" +
                          "  body { background-color: lightgreen; }\n" +
                          "}");
    }, "@media inherited from CSSConditionRule.");

    test(function(){
        assert_equals(rules.length, 3);
        assert_equals(rules[1].type, 4);
        assert_equals(rules[1].cssRules.length, 1);
        assert_equals(rules[1].cssRules[0].type, 1);
        assert_equals(rules[1].media.mediaText, "");
        assert_equals(rules[1].conditionText, "");
        assert_equals(rules[1].media.mediaText,rules[1].conditionText);
        assert_equals(rules[1].cssText,
                          "@media  {\n" +
                          "  body { background-color: red; }\n" +
                          "}");
    }, "@media inherited from CSSConditionRule, empty media.");

    test(function(){
        assert_equals(rules.length, 3);
        assert_equals(rules[2].cssRules.length, 1);
        assert_equals(rules[2].conditionText, "(width: 0)");
        assert_equals(rules[2].cssText,
                          "@supports (width: 0) {\n" +
                          "  s { width: 0px; }\n" +
                          "}");
    }, "@supports inherited from CSSConditionRule.");
</script>
chromium/third_party/blink/web_tests/css3/condition-cssom.html
