web_dev_style: ignore --css-vars from alphabetical ordering requirement

chrome/browser/web_dev_style/css_checker_test.py

 #!/usr/bin/env python
 # Copyright 2015 The Chromium Authors. All rights reserved.
 # Use of this source code is governed by a BSD-style license that can be
 # found in the LICENSE file.
 
 import css_checker
 from os import path as os_path
 import re
 from sys import path as sys_path
 import unittest
@@ skipping 122 matching lines @@
   def testCssAlphaWithLongerDashedProps(self):
     self.VerifyContentsProducesOutput("""
 div {
   border-left: 5px;  /* A hopefully removed comment. */
   border: 5px solid red;
 }""", """
 - Alphabetize properties and list vendor specific (i.e. -webkit) above standard.
     border-left: 5px;
     border: 5px solid red;""")
 
+  def testCssAlphaWithVariables(self):
+    self.VerifyContentIsValid("""
+#id {
+  --zzyxx-xylophone: 3px;
+  --aardvark-animal: var(--zzyxz-xylophone);
+}
+""")
+
   def testCssBracesHaveSpaceBeforeAndNothingAfter(self):
     self.VerifyContentsProducesOutput("""
 /* Hello! */div/* Comment here*/{
   display: block;
 }
 
 blah /* hey! */
 {
   rule: value;
 }
 
 .mixed-in {
   display: none;
   --css-mixin: {
     color: red;

[dschuyler, 2016/09/19 21:23:28]

Adding more elements to this test should
show the error in not stripping the mixins.
e.g.
    color: red;
    zebra: animal;
    cow: dog;

Currently it would leave the "};" which
doesn't generate an error.

[Dan Beam, 2016/09/22 02:13:26]

Done.

   };  /* This should be ignored. */
 }
 
 .this.is { /* allowed */
   rule: value;
 }""", """
 - Start braces ({) end a selector, have a space before them and no rules after.
     div{
     {""")
 
@@ skipping 310 matching lines @@
   </style>
 </head>
 </html>""", """
 - Colons (:) should have a space after them.
     flex-direction:column;
 """, filename='test.html')
 
 
 if __name__ == '__main__':
   unittest.main()