1 # Copyright (c) 2012 The Chromium Authors. All rights reserved. 2 # Use of this source code is governed by a BSD-style license that can be 3 # found in the LICENSE file. 4 5 """Presubmit script for Chromium WebUI resources. 6 7 See http://dev.chromium.org/developers/how-tos/depottools/presubmit-scripts 8 for more details about the presubmit API built into gcl/git cl, and see 9 http://www.chromium.org/developers/web-development-style-guide for the rules 10 we're checking against here. 11 """ 12 13 # TODO(dbeam): Real CSS parser? https://github.com/danbeam/css-py/tree/css3 14 15 class CSSChecker(object): 16 def __init__(self, input_api, output_api, file_filter=None): 17 self.input_api = input_api 18 self.output_api = output_api 19 self.file_filter = file_filter 20 21 def RunChecks(self): 22 # We use this a lot, so make a nick name variable. 23 re = self.input_api.re 24 25 def _collapseable_hex(s): 26 return (len(s) == 6 and s[0] == s[1] and s[2] == s[3] and s[4] == s[5]) 27 28 def _is_gray(s): 29 return s[0] == s[1] == s[2] if len(s) == 3 else s[0:2] == s[2:4] == s[4:6] 30 31 def _remove_all(s): 32 return _remove_grit(_remove_ats(_remove_comments(s))) 33 34 def _remove_ats(s): 35 at_reg = re.compile(r""" 36 @\w+.*?{ # @at-keyword selector junk { 37 (.*{.*?})+ # inner { curly } blocks, rules, and selector junk 38 .*?} # stuff up to the first end curly }""", 39 re.DOTALL | re.VERBOSE) 40 return at_reg.sub('\\1', s) 41 42 def _remove_comments(s): 43 return re.sub(re.compile(r'/\*.*?\*/', re.DOTALL), '', s) 44 45 def _remove_grit(s): 46 grit_reg = re.compile(r""" 47 <if[^>]+>.*?<\s*/\s*if[^>]*>| # <if> contents </if> 48 <include[^>]+> # <include>""", 49 re.DOTALL | re.VERBOSE) 50 return re.sub(grit_reg, '', s) 51 52 def _rgb_from_hex(s): 53 if len(s) == 3: 54 r, g, b = s[0] + s[0], s[1] + s[1], s[2] + s[2] 55 else: 56 r, g, b = s[0:2], s[2:4], s[4:6] 57 return int(r, base=16), int(g, base=16), int(b, base=16) 58 59 def _strip_prefix(s): 60 return re.sub(r'^-(?:o|ms|moz|khtml|webkit)-', '', s) 61 62 def alphabetize_props(contents): 63 errors = [] 64 for rule in re.finditer(r'{(.*?)}', contents, re.DOTALL): 65 semis = map(lambda t: t.strip(), rule.group(1).split(';'))[:-1] 66 rules = filter(lambda r: ': ' in r, semis) 67 props = map(lambda r: r[0:r.find(':')], rules) 68 if props != sorted(props): 69 errors.append(' %s;\n' % (';\n '.join(rules))) 70 return errors 71 72 def braces_have_space_before_and_nothing_after(line): 73 brace_space_reg = re.compile(r""" 74 (?:^|\S){| # selector{ or selector\n{ or 75 {\s*\S+\s* # selector { with stuff after it 76 $ # must be at the end of a line""", 77 re.VERBOSE) 78 return brace_space_reg.search(line) 79 80 def classes_use_dashes(line): 81 # Intentionally dumbed down version of CSS 2.1 grammar for class without 82 # non-ASCII, escape chars, or whitespace. 83 class_reg = re.compile(r""" 84 \.(-?[\w-]+).* # ., then maybe -, then alpha numeric and - 85 [,{]\s*$ # selectors should end with a , or {""", 86 re.VERBOSE) 87 m = class_reg.search(line) 88 if not m: 89 return False 90 class_name = m.group(1) 91 return class_name.lower() != class_name or '_' in class_name 92 93 def close_brace_on_new_line(line): 94 # Ignore single frames in a @keyframe, i.e. 0% { margin: 50px; } 95 frame_reg = re.compile(r""" 96 \s*\d+%\s*{ # 50% { 97 \s*[\w-]+: # rule: 98 (\s*[\w-]+)+\s*; # value; 99 \s*}\s* # }""", 100 re.VERBOSE) 101 return ('}' in line and re.search(r'[^ }]', line) and 102 not frame_reg.match(line)) 103 104 def colons_have_space_after(line): 105 colon_space_reg = re.compile(r""" 106 (?<!data) # ignore data URIs 107 :(?!//) # ignore url(http://), etc. 108 \S[^;]+;\s* # only catch one-line rules for now""", 109 re.VERBOSE) 110 return colon_space_reg.search(line) 111 112 def favor_single_quotes(line): 113 return '"' in line 114 115 # Shared between hex_could_be_shorter and rgb_if_not_gray. 116 hex_reg = re.compile(r""" 117 \#([a-fA-F0-9]{3}|[a-fA-F0-9]{6}) # pound followed by 3 or 6 hex digits 118 (?=[^\w-]|$) # no more alphanum chars or at EOL 119 (?!.*(?:{.*|,\s*)$) # not in a selector""", 120 re.VERBOSE) 121 122 def hex_could_be_shorter(line): 123 m = hex_reg.search(line) 124 return (m and _is_gray(m.group(1)) and _collapseable_hex(m.group(1))) 125 126 def rgb_if_not_gray(line): 127 m = hex_reg.search(line) 128 return (m and not _is_gray(m.group(1))) 129 130 small_seconds_reg = re.compile(r""" 131 (?:^|[^\w-]) # start of a line or a non-alphanumeric char 132 (0?\.[0-9]+)s # 1.0s 133 (?!-?[\w-]) # no following - or alphanumeric chars""", 134 re.VERBOSE) 135 136 def milliseconds_for_small_times(line): 137 return small_seconds_reg.search(line) 138 139 def suggest_ms_from_s(line): 140 ms = int(float(small_seconds_reg.search(line).group(1)) * 1000) 141 return ' (replace with %dms)' % ms 142 143 def no_data_uris_in_source_files(line): 144 return re.search(r'\(\s*\'?\s*data:', line) 145 146 def one_rule_per_line(line): 147 one_rule_reg = re.compile(r""" 148 [\w-](?<!data): # a rule: but no data URIs 149 (?!//)[^;]+; # value; ignoring colons in protocols:// 150 \s*[^ }]\s* # any non-space after the end colon""", 151 re.VERBOSE) 152 return one_rule_reg.search(line) 153 154 def pseudo_elements_double_colon(contents): 155 pseudo_elements = ['after', 156 'before', 157 'calendar-picker-indicator', 158 'color-swatch', 159 'color-swatch-wrapper', 160 'date-and-time-container', 161 'date-and-time-value', 162 'datetime-edit', 163 'datetime-edit-ampm-field', 164 'datetime-edit-day-field', 165 'datetime-edit-hour-field', 166 'datetime-edit-millisecond-field', 167 'datetime-edit-minute-field', 168 'datetime-edit-month-field', 169 'datetime-edit-second-field', 170 'datetime-edit-text', 171 'datetime-edit-week-field', 172 'datetime-edit-year-field', 173 'details-marker', 174 'file-upload-button', 175 'first-letter', 176 'first-line', 177 'inner-spin-button', 178 'input-placeholder', 179 'input-speech-button', 180 'keygen-select', 181 'media-slider-container', 182 'media-slider-thumb', 183 'meter-bar', 184 'meter-even-less-good-value', 185 'meter-inner-element', 186 'meter-optimum-value', 187 'meter-suboptimum-value', 188 'progress-bar', 189 'progress-inner-element', 190 'progress-value', 191 'resizer', 192 'scrollbar', 193 'scrollbar-button', 194 'scrollbar-corner', 195 'scrollbar-thumb', 196 'scrollbar-track', 197 'scrollbar-track-piece', 198 'search-cancel-button', 199 'search-decoration', 200 'search-results-button', 201 'search-results-decoration', 202 'selection', 203 'slider-container', 204 'slider-runnable-track', 205 'slider-thumb', 206 'textfield-decoration-container', 207 'validation-bubble', 208 'validation-bubble-arrow', 209 'validation-bubble-arrow-clipper', 210 'validation-bubble-heading', 211 'validation-bubble-message', 212 'validation-bubble-text-block'] 213 pseudo_reg = re.compile(r""" 214 (?<!:): # a single colon, i.e. :after but not ::after 215 ([a-zA-Z-]+) # a pseudo element, class, or function 216 (?=[^{}]+?{) # make sure a selector, not inside { rules }""", 217 re.MULTILINE | re.VERBOSE) 218 errors = [] 219 for p in re.finditer(pseudo_reg, contents): 220 pseudo = p.group(1).strip().splitlines()[0] 221 if _strip_prefix(pseudo.lower()) in pseudo_elements: 222 errors.append(' :%s (should be ::%s)' % (pseudo, pseudo)) 223 return errors 224 225 def one_selector_per_line(contents): 226 any_reg = re.compile(r""" 227 :(?:-webkit-)?any\(.*?\) # :-webkit-any(a, b, i) selector""", 228 re.DOTALL | re.VERBOSE) 229 multi_sels_reg = re.compile(r""" 230 (?:}\s*)? # ignore 0% { blah: blah; }, from @keyframes 231 ([^,]+,(?=[^{}]+?{) # selector junk {, not in a { rule } 232 .*[,{])\s*$ # has to end with , or {""", 233 re.MULTILINE | re.VERBOSE) 234 errors = [] 235 for b in re.finditer(multi_sels_reg, re.sub(any_reg, '', contents)): 236 errors.append(' ' + b.group(1).strip().splitlines()[-1:][0]) 237 return errors 238 239 def suggest_rgb_from_hex(line): 240 suggestions = ['rgb(%d, %d, %d)' % _rgb_from_hex(h.group(1)) 241 for h in re.finditer(hex_reg, line)] 242 return ' (replace with %s)' % ', '.join(suggestions) 243 244 def suggest_short_hex(line): 245 h = hex_reg.search(line).group(1) 246 return ' (replace with #%s)' % (h[0] + h[2] + h[4]) 247 248 def zero_length_values(contents): 249 hsl_reg = re.compile(r""" 250 hsl\([^\)]* # hsl(<maybe stuff> 251 (?:[, ]|(?<=\()) # a comma or space not followed by a ( 252 (?:0?\.?)?0% # some equivalent to 0%""", 253 re.VERBOSE) 254 zeros_reg = re.compile(r""" 255 ^.*(?:^|[^0-9.]) # start/non-number 256 (?:\.0|0(?:\.0? # .0, 0, or 0.0 257 |px|em|%|in|cm|mm|pc|pt|ex|deg|g?rad|m?s|k?hz)) # a length unit 258 (?:\D|$) # non-number/end 259 (?=[^{}]+?}).*$ # only { rules }""", 260 re.MULTILINE | re.VERBOSE) 261 errors = [] 262 for z in re.finditer(zeros_reg, contents): 263 first_line = z.group(0).strip().splitlines()[0] 264 if not hsl_reg.search(first_line): 265 errors.append(' ' + first_line) 266 return errors 267 268 # NOTE: Currently multi-line checks don't support 'after'. Instead, add 269 # suggestions while parsing the file so another pass isn't necessary. 270 added_or_modified_files_checks = [ 271 { 'desc': 'Alphabetize properties and list vendor specific (i.e. ' 272 '-webkit) above standard.', 273 'test': alphabetize_props, 274 'multiline': True, 275 }, 276 { 'desc': 'Start braces ({) end a selector, have a space before them ' 277 'and no rules after.', 278 'test': braces_have_space_before_and_nothing_after, 279 }, 280 { 'desc': 'Classes use .dash-form.', 281 'test': classes_use_dashes, 282 }, 283 { 'desc': 'Always put a rule closing brace (}) on a new line.', 284 'test': close_brace_on_new_line, 285 }, 286 { 'desc': 'Colons (:) should have a space after them.', 287 'test': colons_have_space_after, 288 }, 289 { 'desc': 'Use single quotes (\') instead of double quotes (") in ' 290 'strings.', 291 'test': favor_single_quotes, 292 }, 293 { 'desc': 'Use abbreviated hex (#rgb) when in form #rrggbb.', 294 'test': hex_could_be_shorter, 295 'after': suggest_short_hex, 296 }, 297 { 'desc': 'Use milliseconds for time measurements under 1 second.', 298 'test': milliseconds_for_small_times, 299 'after': suggest_ms_from_s, 300 }, 301 { 'desc': "Don't use data URIs in source files. Use grit instead.", 302 'test': no_data_uris_in_source_files, 303 }, 304 { 'desc': 'One rule per line (what not to do: color: red; margin: 0;).', 305 'test': one_rule_per_line, 306 }, 307 { 'desc': 'One selector per line (what not to do: a, b {}).', 308 'test': one_selector_per_line, 309 'multiline': True, 310 }, 311 { 'desc': 'Pseudo-elements should use double colon (i.e. ::after).', 312 'test': pseudo_elements_double_colon, 313 'multiline': True, 314 }, 315 { 'desc': 'Use rgb() over #hex when not a shade of gray (like #333).', 316 'test': rgb_if_not_gray, 317 'after': suggest_rgb_from_hex, 318 }, 319 { 'desc': 'Make all zero length terms (i.e. 0px) 0 unless inside of ' 320 'hsl() or part of @keyframe.', 321 'test': zero_length_values, 322 'multiline': True, 323 }, 324 ] 325 326 results = [] 327 affected_files = self.input_api.AffectedFiles(include_deletes=False, 328 file_filter=self.file_filter) 329 files = [] 330 for f in affected_files: 331 # Remove all /*comments*/, @at-keywords, and grit <if|include> tags; we're 332 # not using a real parser. TODO(dbeam): Check alpha in <if> blocks. 333 file_contents = _remove_all('\n'.join(f.NewContents())) 334 files.append((f.LocalPath(), file_contents)) 335 336 # Only look at CSS files for now. 337 for f in filter(lambda f: f[0].endswith('.css'), files): 338 file_errors = [] 339 for check in added_or_modified_files_checks: 340 # If the check is multiline, it receieves the whole file and gives us 341 # back a list of things wrong. If the check isn't multiline, we pass it 342 # each line and the check returns something truthy if there's an issue. 343 if ('multiline' in check and check['multiline']): 344 assert not 'after' in check 345 check_errors = check['test'](f[1]) 346 if len(check_errors) > 0: 347 file_errors.append('- %s\n%s' % 348 (check['desc'], '\n'.join(check_errors).rstrip())) 349 else: 350 check_errors = [] 351 lines = f[1].splitlines() 352 for lnum, line in enumerate(lines): 353 if check['test'](line): 354 error = ' ' + line.strip() 355 if 'after' in check: 356 error += check['after'](line) 357 check_errors.append(error) 358 if len(check_errors) > 0: 359 file_errors.append('- %s\n%s' % 360 (check['desc'], '\n'.join(check_errors))) 361 if file_errors: 362 results.append(self.output_api.PresubmitPromptWarning( 363 '%s:\n%s' % (f[0], '\n\n'.join(file_errors)))) 364 365 if results: 366 # Add your name if you're here often mucking around in the code. 367 authors = ['dbeam (at] chromium.org'] 368 results.append(self.output_api.PresubmitNotifyResult( 369 'Was the CSS checker useful? Send feedback or hate mail to %s.' % 370 ', '.join(authors))) 371 372 return results 373