<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Defining Custom Properties: the --* family of properties - CSS Custom Properties Level 1 CR Test Suite</title>
<style type="text/css">
@import "http://www.w3.org/StyleSheets/TR/base.css";
@import "../indices.css";
</style>
</head>
<body>
<h1>CSS Custom Properties Level 1 CR Test Suite</h1>
<h2>Defining Custom Properties: the --* family of properties (97 tests)</h2>
<table width="100%">
<col id="test-column">
<col id="refs-column">
<col id="flags-column">
<col id="info-column">
<thead>
<tr>
<th>Test</th>
<th><abbr title="Rendering References">Refs</abbr></th>
<th>Flags</th>
<th>Info</th>
</tr>
</thead>
<tbody id="s2">
<tr><th colspan="4" scope="rowgroup">
<a href="#s2">+</a>
<a href="https://www.w3.org/TR/css-variables-1/#defining-variables">2 Defining Custom Properties: the --* family of properties</a></th></tr>
<!-- 35 tests -->
<tr id="test_variable_legal_values-2" class="script">
<td>
<a href="test_variable_legal_values.htm">test_variable_legal_values</a></td>
<td></td>
<td><abbr class="script" title="Executes tests in script">Script</abbr></td>
<td>CSS Variables Allowed Syntax
<ul class="assert">
<li>The <value> type used in the syntax above is defined as anything matching the "value" production in CSS 2.1 Chapter 4.1 [CSS21].</li>
</ul>
</td>
</tr>
<tr id="variable-declaration-06-2" class="">
<td>
<a href="variable-declaration-06.htm">variable-declaration-06</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test overriding an existing variable declaration.
</td>
</tr>
<tr id="variable-declaration-29-2" class="">
<td>
<a href="variable-declaration-29.htm">variable-declaration-29</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with a valid custom property name "--".
</td>
</tr>
<tr id="variable-declaration-31-2" class="">
<td>
<a href="variable-declaration-31.htm">variable-declaration-31</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable where the variable name begins with a digit.
</td>
</tr>
<tr id="variable-declaration-32-2" class="">
<td>
<a href="variable-declaration-32.htm">variable-declaration-32</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable where the variable name begins with an escaped digit.
</td>
</tr>
<tr id="variable-declaration-33-2" class="">
<td>
<a href="variable-declaration-33.htm">variable-declaration-33</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable where the variable name begins with an escaped letter.
</td>
</tr>
<tr id="variable-declaration-34-2" class="">
<td>
<a href="variable-declaration-34.htm">variable-declaration-34</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable where the variable name begins with a lone surrogate.
</td>
</tr>
<tr id="variable-declaration-35-2" class="">
<td>
<a href="variable-declaration-35.htm">variable-declaration-35</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable where the variable name begins with U+FFFD.
</td>
</tr>
<tr id="variable-declaration-36-2" class="">
<td>
<a href="variable-declaration-36.htm">variable-declaration-36</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable where the variable name begins with an out-of-range Unicode character escape.
</td>
</tr>
<tr id="variable-declaration-38-2" class="">
<td>
<a href="variable-declaration-38.htm">variable-declaration-38</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring two variables in the same declaration block that differ only in case, with lowercase first.
</td>
</tr>
<tr id="variable-declaration-39-2" class="">
<td>
<a href="variable-declaration-39.htm">variable-declaration-39</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring two variables in the same declaration block that differ only in case, with uppercase first.
</td>
</tr>
<tr id="variable-declaration-40-2" class="">
<td>
<a href="variable-declaration-40.htm">variable-declaration-40</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with an invalid custom property name due to it beginning with "VAR-".
</td>
</tr>
<tr id="variable-declaration-41-2" class="">
<td>
<a href="variable-declaration-41.htm">variable-declaration-41</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable where the second '-' in the "--" prefix of the custom property name is escaped.
</td>
</tr>
<tr id="variable-declaration-42-2" class="">
<td>
<a href="variable-declaration-42.htm">variable-declaration-42</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable where the custom property name includes an unescaped Chinese character and an escape that is terminated by a space character.
</td>
</tr>
<tr id="variable-declaration-43-2" class="">
<td>
<a href="variable-declaration-43.htm">variable-declaration-43</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable whose value is "initial".
</td>
</tr>
<tr id="variable-declaration-44-2" class="">
<td>
<a href="variable-declaration-44.htm">variable-declaration-44</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable whose value is "inherit" where there is no variable to inherit from.
</td>
</tr>
<tr id="variable-declaration-45-2" class="">
<td>
<a href="variable-declaration-45.htm">variable-declaration-45</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable whose value is "inherit" where there is a variable to inherit from.
</td>
</tr>
<tr id="variable-declaration-46-2" class="">
<td>
<a href="variable-declaration-46.htm">variable-declaration-46</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable whose value is "initial" where there is a variable to inherit from.
</td>
</tr>
<tr id="variable-declaration-47-2" class="">
<td>
<a href="variable-declaration-47.htm">variable-declaration-47</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable whose value consists of a reference to a variable whose value is "inherit".
</td>
</tr>
<tr id="variable-declaration-56-2" class="">
<td>
<a href="variable-declaration-56.htm">variable-declaration-56</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable whose value is "unset" where there is no variable to inherit from.
</td>
</tr>
<tr id="variable-declaration-57-2" class="">
<td>
<a href="variable-declaration-57.htm">variable-declaration-57</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable whose value is "unset" where there is a variable to inherit from.
</td>
</tr>
<tr id="variable-declaration-58-2" class="">
<td>
<a href="variable-declaration-58.htm">variable-declaration-58</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable whose value consists of a reference to a variable whose value is "unset".
</td>
</tr>
<tr id="variable-declaration-59-2" class="">
<td>
<a href="variable-declaration-59.htm">variable-declaration-59</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with a trailing invalid token.
</td>
</tr>
<tr id="variable-external-font-face-01-2" class="ahem">
<td>
<a href="variable-external-font-face-01.htm">variable-external-font-face-01</a></td>
<td><a href="reference/variable-external-font-face-01-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Test the invalid declaration and use of a variable in an @font-face rule within an external CSS.
</td>
</tr>
<tr id="variable-font-face-01-2" class="ahem">
<td>
<a href="variable-font-face-01.htm">variable-font-face-01</a></td>
<td><a href="reference/variable-font-face-01-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Test the invalid declaration and use of a variable in an @font-face rule.
</td>
</tr>
<tr id="variable-font-face-02-2" class="ahem">
<td>
<a href="variable-font-face-02.htm">variable-font-face-02</a></td>
<td><a href="reference/variable-font-face-02-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Test the invalid use of a variable in an @font-face rule where the variable is defined on the root element.
</td>
</tr>
<tr id="variable-reference-13-2" class="">
<td>
<a href="variable-reference-13.htm">variable-reference-13</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test that important variable declarations are not overwritten by subsequent non-important variable declarations in the one declaration block.
</td>
</tr>
<tr id="variable-reference-14-2" class="">
<td>
<a href="variable-reference-14.htm">variable-reference-14</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test that important variable declarations cascade correctly.
</td>
</tr>
<tr id="variable-supports-58-2" class="">
<td>
<a href="variable-supports-58.htm">variable-supports-58</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing property declaration in an @supports rule with property name "--".
</td>
</tr>
<tr id="variable-supports-60-2" class="">
<td>
<a href="variable-supports-60.htm">variable-supports-60</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule for a variable whose name is a digit.
</td>
</tr>
<tr id="variable-supports-61-2" class="">
<td>
<a href="variable-supports-61.htm">variable-supports-61</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule for a variable whose name is a digit which is specified with an escape.
</td>
</tr>
<tr id="variable-supports-62-2" class="">
<td>
<a href="variable-supports-62.htm">variable-supports-62</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule for a variable whose name is U+FFFD which is specified with an escaped lone surrogate.
</td>
</tr>
<tr id="variable-supports-63-2" class="">
<td>
<a href="variable-supports-63.htm">variable-supports-63</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule for a variable whose name is U+FFFD which is specified with an out-of-range Unicode character escape.
</td>
</tr>
<tr id="variable-supports-66-2" class="">
<td>
<a href="variable-supports-66.htm">variable-supports-66</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a failing custom property declaration in an @supports rule where the property name begins with "VAR-".
</td>
</tr>
<tr id="variable-supports-67-2" class="">
<td>
<a href="variable-supports-67.htm">variable-supports-67</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a declaration for a custom property has an invalid value does not cause the @supports rule to fail to parse.
</td>
</tr>
</tbody>
<tbody id="s2.#custom-property">
<!-- 0 tests -->
</tbody>
<tbody id="s2.#example-6e1ad79f">
<!-- 0 tests -->
</tbody>
<tbody id="s2.#example-d1c7ba56">
<!-- 0 tests -->
</tbody>
<tbody id="s2.#propdef-">
<!-- 0 tests -->
</tbody>
<tbody id="s2.#typedef-custom-property-name">
<!-- 0 tests -->
</tbody>
<tbody id="s2.1">
<tr><th colspan="4" scope="rowgroup">
<a href="#s2.1">+</a>
<a href="https://www.w3.org/TR/css-variables-1/#syntax">2.1 Custom Property Value Syntax</a></th></tr>
<!-- 56 tests -->
<tr id="variable-declaration-01-2.1" class="">
<td>
<a href="variable-declaration-01.htm">variable-declaration-01</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable consisting of a single token preceded by white space.
</td>
</tr>
<tr id="variable-declaration-02-2.1" class="">
<td>
<a href="variable-declaration-02.htm">variable-declaration-02</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable consisting of a single token with no preceding white space.
</td>
</tr>
<tr id="variable-declaration-03-2.1" class="">
<td>
<a href="variable-declaration-03.htm">variable-declaration-03</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that references another variable.
</td>
</tr>
<tr id="variable-declaration-04-2.1" class="">
<td>
<a href="variable-declaration-04.htm">variable-declaration-04</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable consisting of a variable reference followed by white space.
</td>
</tr>
<tr id="variable-declaration-05-2.1" class="">
<td>
<a href="variable-declaration-05.htm">variable-declaration-05</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable consisting of a variable reference that includes white space around the variable name.
</td>
</tr>
<tr id="variable-declaration-07-2.1" class="">
<td>
<a href="variable-declaration-07.htm">variable-declaration-07</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with invalid syntax due to a variable reference having no tokens in its fallback.
</td>
</tr>
<tr id="variable-declaration-08-2.1" class="">
<td>
<a href="variable-declaration-08.htm">variable-declaration-08</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that consists of a variable reference whose fallback is white space.
</td>
</tr>
<tr id="variable-declaration-09-2.1" class="">
<td>
<a href="variable-declaration-09.htm">variable-declaration-09</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with invalid syntax due to a variable reference having only a comment in its fallback.
</td>
</tr>
<tr id="variable-declaration-10-2.1" class="">
<td>
<a href="variable-declaration-10.htm">variable-declaration-10</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that consists of a variable reference with a fallback that includes a comment and an identifier.
</td>
</tr>
<tr id="variable-declaration-11-2.1" class="">
<td>
<a href="variable-declaration-11.htm">variable-declaration-11</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with invalid syntax due to a variable reference having a '!' token at the top level of its fallback.
</td>
</tr>
<tr id="variable-declaration-12-2.1" class="">
<td>
<a href="variable-declaration-12.htm">variable-declaration-12</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with invalid syntax due to a variable reference having a ';' token at the top level of its fallback.
</td>
</tr>
<tr id="variable-declaration-13-2.1" class="">
<td>
<a href="variable-declaration-13.htm">variable-declaration-13</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with invalid syntax due to a variable reference having "!important" the top level of its fallback.
</td>
</tr>
<tr id="variable-declaration-14-2.1" class="">
<td>
<a href="variable-declaration-14.htm">variable-declaration-14</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that consists of a variable reference and a following identifier with no intervening white space.
</td>
</tr>
<tr id="variable-declaration-15-2.1" class="ahem">
<td>
<a href="variable-declaration-15.htm">variable-declaration-15</a></td>
<td><a href="reference/variable-declaration-15-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Test declaring a variable that consists of a comma-separated font family list.
</td>
</tr>
<tr id="variable-declaration-16-2.1" class="ahem">
<td>
<a href="variable-declaration-16.htm">variable-declaration-16</a></td>
<td><a href="reference/variable-declaration-16-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Test declaring a variable that consists of a comma-separated font family list with the first item being a variable reference.
</td>
</tr>
<tr id="variable-declaration-17-2.1" class="ahem">
<td>
<a href="variable-declaration-17.htm">variable-declaration-17</a></td>
<td><a href="reference/variable-declaration-17-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Test declaring a variable that consists of a comma-separated font family list with the last item being a variable reference.
</td>
</tr>
<tr id="variable-declaration-18-2.1" class="ahem">
<td>
<a href="variable-declaration-18.htm">variable-declaration-18</a></td>
<td><a href="reference/variable-declaration-18-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>Test declaring a variable that consists of a comma-separated font family list with the comma coming from a variable reference.
</td>
</tr>
<tr id="variable-declaration-19-2.1" class="">
<td>
<a href="variable-declaration-19.htm">variable-declaration-19</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that consists of a function where one of the arguments is a variable reference.
</td>
</tr>
<tr id="variable-declaration-20-2.1" class="">
<td>
<a href="variable-declaration-20.htm">variable-declaration-20</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with "!important".
</td>
</tr>
<tr id="variable-declaration-21-2.1" class="">
<td>
<a href="variable-declaration-21.htm">variable-declaration-21</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that consists of a function where all of the arguments and commas are made up of variable references.
</td>
</tr>
<tr id="variable-declaration-22-2.1" class="">
<td>
<a href="variable-declaration-22.htm">variable-declaration-22</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that consists of a variable reference with a number of levels of variable reference fallbacks.
</td>
</tr>
<tr id="variable-declaration-23-2.1" class="">
<td>
<a href="variable-declaration-23.htm">variable-declaration-23</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with invalid syntax due to having two "!important" priorities.
</td>
</tr>
<tr id="variable-declaration-24-2.1" class="">
<td>
<a href="variable-declaration-24.htm">variable-declaration-24</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that contains a CDO token.
</td>
</tr>
<tr id="variable-declaration-25-2.1" class="">
<td>
<a href="variable-declaration-25.htm">variable-declaration-25</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that contains a CDC token.
</td>
</tr>
<tr id="variable-declaration-26-2.1" class="">
<td>
<a href="variable-declaration-26.htm">variable-declaration-26</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that contains only a white space token.
</td>
</tr>
<tr id="variable-declaration-28-2.1" class="">
<td>
<a href="variable-declaration-28.htm">variable-declaration-28</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with invalid syntax due to having no tokens.
</td>
</tr>
<tr id="variable-declaration-37-2.1" class="">
<td>
<a href="variable-declaration-37.htm">variable-declaration-37</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable consisting of a variable reference where white space surrounds the comma separating the variable name and fallback.
</td>
</tr>
<tr id="variable-declaration-60-2.1" class="">
<td>
<a href="variable-declaration-60.htm">variable-declaration-60</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable with a value whose name is "initial" but using Turkish dotted/dotless 'i's.
</td>
</tr>
<tr id="variable-external-declaration-01-2.1" class="">
<td>
<a href="variable-external-declaration-01.htm">variable-external-declaration-01</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable in an external CSS file.
</td>
</tr>
<tr id="variable-reference-without-whitespace-2.1" class="">
<td>
<a href="variable-reference-without-whitespace.htm">variable-reference-without-whitespace</a></td>
<td><a href="reference/variable-reference-without-whitespace-ref.htm">=</a> </td>
<td></td>
<td>Variable reference without whitespace
</td>
</tr>
<tr id="variable-supports-33-2.1" class="">
<td>
<a href="variable-supports-33.htm">variable-supports-33</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference.
</td>
</tr>
<tr id="variable-supports-34-2.1" class="">
<td>
<a href="variable-supports-34.htm">variable-supports-34</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains white space and a variable reference.
</td>
</tr>
<tr id="variable-supports-35-2.1" class="">
<td>
<a href="variable-supports-35.htm">variable-supports-35</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference surrounded by white space.
</td>
</tr>
<tr id="variable-supports-36-2.1" class="">
<td>
<a href="variable-supports-36.htm">variable-supports-36</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference surrounded by white space with the variable name also surrounded by white space.
</td>
</tr>
<tr id="variable-supports-37-2.1" class="">
<td>
<a href="variable-supports-37.htm">variable-supports-37</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a failing custom property declaration in an @supports rule whose value contains a variable reference with no fallback tokens.
</td>
</tr>
<tr id="variable-supports-38-2.1" class="">
<td>
<a href="variable-supports-38.htm">variable-supports-38</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference with fallback consisting only of white space.
</td>
</tr>
<tr id="variable-supports-39-2.1" class="">
<td>
<a href="variable-supports-39.htm">variable-supports-39</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a failing custom property declaration in an @supports rule whose value contains a variable reference with no fallback tokens, just a comment.
</td>
</tr>
<tr id="variable-supports-40-2.1" class="">
<td>
<a href="variable-supports-40.htm">variable-supports-40</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference with fallback consisting of a comment and an identifier.
</td>
</tr>
<tr id="variable-supports-41-2.1" class="">
<td>
<a href="variable-supports-41.htm">variable-supports-41</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a failing custom property declaration in an @supports rule whose value contains a variable reference with fallback containing a top level '!' token.
</td>
</tr>
<tr id="variable-supports-42-2.1" class="">
<td>
<a href="variable-supports-42.htm">variable-supports-42</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a failing custom property declaration in an @supports rule whose value contains a variable reference with fallback containing a top level "!important".
</td>
</tr>
<tr id="variable-supports-43-2.1" class="">
<td>
<a href="variable-supports-43.htm">variable-supports-43</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a dimension followed by a variable reference.
</td>
</tr>
<tr id="variable-supports-44-2.1" class="">
<td>
<a href="variable-supports-44.htm">variable-supports-44</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference followed bya dimension.
</td>
</tr>
<tr id="variable-supports-45-2.1" class="">
<td>
<a href="variable-supports-45.htm">variable-supports-45</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a selection of tokens and a non-top level variable reference.
</td>
</tr>
<tr id="variable-supports-46-2.1" class="">
<td>
<a href="variable-supports-46.htm">variable-supports-46</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference and an "!important" priority.
</td>
</tr>
<tr id="variable-supports-47-2.1" class="">
<td>
<a href="variable-supports-47.htm">variable-supports-47</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains two adjacent variable references with no intervening white space.
</td>
</tr>
<tr id="variable-supports-48-2.1" class="">
<td>
<a href="variable-supports-48.htm">variable-supports-48</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference with a number of levels of variable reference fallbacks.
</td>
</tr>
<tr id="variable-supports-49-2.1" class="">
<td>
<a href="variable-supports-49.htm">variable-supports-49</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a failing custom property declaration in an @supports rule whose value contains two "!important" priorities.
</td>
</tr>
<tr id="variable-supports-50-2.1" class="">
<td>
<a href="variable-supports-50.htm">variable-supports-50</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference and a CDO token.
</td>
</tr>
<tr id="variable-supports-51-2.1" class="">
<td>
<a href="variable-supports-51.htm">variable-supports-51</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference and a CDC token.
</td>
</tr>
<tr id="variable-supports-52-2.1" class="">
<td>
<a href="variable-supports-52.htm">variable-supports-52</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference and balanced braces and square brackets.
</td>
</tr>
<tr id="variable-supports-53-2.1" class="">
<td>
<a href="variable-supports-53.htm">variable-supports-53</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a failing custom property declaration in an @supports rule whose value contains a variable reference with a top level ';' token in its fallback.
</td>
</tr>
<tr id="variable-supports-54-2.1" class="">
<td>
<a href="variable-supports-54.htm">variable-supports-54</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference and a non-top level ';' token.
</td>
</tr>
<tr id="variable-supports-55-2.1" class="">
<td>
<a href="variable-supports-55.htm">variable-supports-55</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a failing custom property declaration in an @supports rule whose value contains a variable reference and a top level ';' token in its fallback.
</td>
</tr>
<tr id="variable-supports-56-2.1" class="">
<td>
<a href="variable-supports-56.htm">variable-supports-56</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains only a white space token.
</td>
</tr>
<tr id="variable-supports-57-2.1" class="">
<td>
<a href="variable-supports-57.htm">variable-supports-57</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a failing custom property declaration in an @supports rule whose value contains no tokens.
</td>
</tr>
<tr id="variable-supports-65-2.1" class="">
<td>
<a href="variable-supports-65.htm">variable-supports-65</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value is a variable reference with white space surrounding the fallback comma.
</td>
</tr>
</tbody>
<tbody id="s2.1.#animation-tainted">
<!-- 0 tests -->
</tbody>
<tbody id="s2.1.#example-310ea5b9">
<!-- 0 tests -->
</tbody>
<tbody id="s2.1.#example-52aad45a">
<!-- 0 tests -->
</tbody>
<tbody id="s2.1.#example-97d3694f">
<!-- 0 tests -->
</tbody>
<tbody id="s2.1.#example-f8770692">
<!-- 0 tests -->
</tbody>
<tbody id="s2.2">
<tr><th colspan="4" scope="rowgroup">
<a href="#s2.2">+</a>
<a href="https://www.w3.org/TR/css-variables-1/#cycles">2.2 Resolving Dependency Cycles</a></th></tr>
<!-- 6 tests -->
<tr id="variable-declaration-30-2.2" class="">
<td>
<a href="variable-declaration-30.htm">variable-declaration-30</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that contains a variable reference to itself.
</td>
</tr>
<tr id="variable-declaration-48-2.2" class="">
<td>
<a href="variable-declaration-48.htm">variable-declaration-48</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a number of variables in a cycle.
</td>
</tr>
<tr id="variable-declaration-49-2.2" class="">
<td>
<a href="variable-declaration-49.htm">variable-declaration-49</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that is a dependent of a variable involved in a cycle but which itself is not involved in a cycle.
</td>
</tr>
<tr id="variable-declaration-50-2.2" class="">
<td>
<a href="variable-declaration-50.htm">variable-declaration-50</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a number of variables in a chain, where the final element of the chain uses its fallback.
</td>
</tr>
<tr id="variable-reference-39-2.2" class="">
<td>
<a href="variable-reference-39.htm">variable-reference-39</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test declaring a variable that references itself but uses fallback.
</td>
</tr>
<tr id="variable-supports-59-2.2" class="">
<td>
<a href="variable-supports-59.htm">variable-supports-59</a></td>
<td><a href="support/color-green-ref.htm">=</a> </td>
<td></td>
<td>Test a passing custom property declaration in an @supports rule whose value contains a variable reference to itself.
</td>
</tr>
</tbody>
<tbody id="s2.2.#example-87c69525">
<!-- 0 tests -->
</tbody>
<tbody id="s2.2.#example-942ce4d7">
<!-- 0 tests -->
</tbody>
<tbody id="s2.2.#example-cf4602dd">
<!-- 0 tests -->
</tbody>
</table>
</body>
</html>