1 files changed, 35 insertions, 0 deletions
diff --git a/tests/wpt/css-tests/css-variables-1_dev/xhtml1/css-vars-custom-property-case-sensitive-001.xht b/tests/wpt/css-tests/css-variables-1_dev/xhtml1/css-vars-custom-property-case-sensitive-001.xht
new file mode 100644
index 00000000000..809531004fe
--- /dev/null
+++ b/tests/wpt/css-tests/css-variables-1_dev/xhtml1/css-vars-custom-property-case-sensitive-001.xht
@@ -0,0 +1,35 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml"><head>
+    <title>CSS Variables Test: custom property names start with "var-" in lower case</title>
+    <meta charset="UTF-8" />
+    <link href="mailto:noahcollins@gmail.com" rel="author" title="Noah Collins" />
+    <link href="http://www.w3.org/TR/css-variables-1/#using-variables" rel="help" />
+    <meta content="Custom property names start with var- which must be lower case" name="assert" />
+    <link href="reference/css-vars-custom-property-case-sensitive-ref.xht" rel="match" />
+    <style type="text/css">
+        :root {
+            /* these should be VALID custom property names */
+            var-veryblue:   #22e;
+            var-AlsoBlue:   #22e;
+
+            /* these should be INVALID custom property names */
+            VAR-veryred:   #f00;
+            Var-AlsoRed:   #f00;
+        }
+
+        .blue-good-1  { color: var(veryblue); }
+        .blue-good-2  { color: var(AlsoBlue); }
+        .red-bad-1    { color: var(veryred);  }
+        .red-bad-2    { color: var(AlsoRed);  }
+    </style>
+</head>
+<body>
+    <h2 class="blue-good-1">Valid CSS Variable Names</h2>
+    <p class="blue-good-1">This paragraph is styled using a valid CSS Variable name. It should be blue.</p>
+    <p class="blue-good-2">This paragraph is styled using a valid CSS Variable name. It should be blue.</p>
+    <br />
+    <h2 class="red-bad-1">Invalid CSS Variable Names</h2>
+    <p class="red-bad-1">This paragraph is styled using an invalid CSS Variable name. Fail if red.</p>
+    <p class="red-bad-2">This paragraph is styled using an invalid CSS Variable name. Fail if red.</p>
+
+</body></html>
+\ No newline at end of file