<!DOCTYPE HTML>
<meta charset=UTF-8>
<title>CSSGroupingRule Conditional Rules Test</title>
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
<link rel="help" href="https://www.w3.org/TR/css-conditional-3/#the-cssconditionrule-interface">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>

<style id="style"></style>

<script>

function check_condition_text(text) {
  test(function() {
    let style_element = document.getElementById("style");
    style_element.textContent = `@supports ${text} {}`;
    let rules = style_element.sheet.cssRules;
    assert_equals(rules.length, 1);
    assert_equals(rules[0].conditionText, text);
  }, `conditionText getter for @supports ${text}`);
}

check_condition_text("(color: red)");
check_condition_text("(color : red) or ( color:blue )");
check_condition_text("not (color: red)");
check_condition_text("()");
check_condition_text("func()");
check_condition_text("([])");
check_condition_text("({})");
check_condition_text("(())");
check_condition_text("(func())");
check_condition_text("(x)");
check_condition_text("func(x)");
check_condition_text("([x])");
check_condition_text("({x})");
check_condition_text("((x))");
check_condition_text("(func(x))");

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