build-compute-kind-widget-fallback-props.py (5302B)
1 #!/usr/bin/env python3 2 import os, shutil 3 4 target_dir = os.path.dirname(os.path.dirname(os.path.abspath(__file__))) + "/compute-kind-widget-generated" 5 6 props_grouped = [ 7 [ 8 u"background-color", 9 u"background-image", 10 ], 11 [ 12 u"background-attachment", 13 u"background-position", 14 u"background-clip", 15 u"background-origin", 16 u"background-size", 17 ], 18 [ 19 u"border-top-color", 20 u"border-right-color", 21 u"border-bottom-color", 22 u"border-left-color", 23 ], 24 [ 25 u"border-top-style", 26 u"border-right-style", 27 u"border-bottom-style", 28 u"border-left-style", 29 ], 30 [ 31 u"border-top-width", 32 u"border-right-width", 33 u"border-bottom-width", 34 u"border-left-width", 35 ], 36 [ 37 u"border-block-start-color", 38 u"border-block-end-color", 39 u"border-inline-start-color", 40 u"border-inline-end-color", 41 ], 42 [ 43 u"border-block-start-style", 44 u"border-block-end-style", 45 u"border-inline-start-style", 46 u"border-inline-end-style", 47 ], 48 [ 49 u"border-block-start-width", 50 u"border-block-end-width", 51 u"border-inline-start-width", 52 u"border-inline-end-width", 53 ], 54 [ 55 u"border-image-source", 56 u"border-image-slice", 57 u"border-image-width", 58 u"border-image-outset", 59 u"border-image-repeat", 60 ], 61 [ 62 u"border-top-left-radius", 63 u"border-top-right-radius", 64 u"border-bottom-right-radius", 65 u"border-bottom-left-radius", 66 u"border-start-start-radius", 67 u"border-start-end-radius", 68 u"border-end-start-radius", 69 u"border-end-end-radius", 70 ], 71 ] 72 73 els = [ 74 [u'link', u'<a id="link">a</a>'], 75 [u'button', u'<button id="button">button</button>'], 76 [u'input-button', u'<input id="button-input" type="button" value="input-button">'], 77 [u'input-submit', u'<input id="submit-input" type="submit" value="input-submit">'], 78 [u'input-reset', u'<input id="reset-input" type="reset" value="input-reset">'], 79 [u'input-text', u'<input id="text-input" type="text" value="input-text">'], 80 [u'input-search-text', u'<input id="search-text-input" type="search" value="input-search-text">'], 81 [u'input-search', u'<input id="search-input" type="search" value="input-search">'], 82 [u'range', u'<input id="range-input" type="range">'], 83 [u'checkbox-input', u'<input id="checkbox-input" type="checkbox">'], 84 [u'radio-input', u'<input id="radio-input" type="radio">'], 85 [u'color-input', u'<input id="color-input" type="color">'], 86 [u'textarea', u'<textarea id="textarea">textarea</textarea>'], 87 [u'select-listbox', u'<select multiple id="select-listbox"><option>select-listbox</option></select>'], 88 [u'select-dropdown-box', u'<select id="select-dropdown-box"><option>select-dropdown-box</option></select>'], 89 [u'select-menulist-button', u'<select id="select-menulist-button"><option>select-menulist-button</option></select>'], 90 [u'meter', u'<meter id="meter" value=0.5></meter>'], 91 [u'progress', u'<progress id="progress" value=0.5></progress>'], 92 ] 93 94 all_els = "" 95 for el_id, el_markup in els: 96 all_els += el_markup + "\n " 97 all_els = all_els.rstrip() 98 99 template = u"""<!-- DO NOT EDIT. This file has been generated. Source: 100 ../tools/build-compute-kind-widget-fallback-props.py 101 --> 102 <!DOCTYPE html> 103 <meta charset="utf-8"> 104 <title>CSS Basic User Interface Test: Compute kind of widget: {props} maybe disables native appearance for {el_id}</title> 105 <link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-disabling-properties"> 106 <link rel="help" href="https://html.spec.whatwg.org/#widgets"> 107 <meta name="assert" content="appropriate widget is used when props includes {props}."> 108 <link rel="match" href="../compute-kind-widget-fallback-{el_id}-ref.html"> 109 <style> 110 #container {{ width: 500px; }} 111 /* NOTE: This rule is only used in the search-text-input tests: */ 112 #container > #search-text-input {{ appearance: textfield; }} 113 /* NOTE: This rule is only used in the select-menulist-button tests: */ 114 #container > #select-menulist-button {{ appearance: none; appearance: menulist-button; }} 115 </style> 116 117 <div id="container"> 118 {el_markup} 119 </div> 120 121 <script> 122 // Set author-level CSS that matches UA style, but don't use the 'revert' value. 123 const elements = document.querySelectorAll('#container > *'); 124 const props = "{props}".split(","); 125 for (const el of elements) {{ 126 for (const prop of props) {{ 127 el.style.setProperty(prop, getComputedStyle(el).getPropertyValue(prop)); 128 }} 129 }} 130 </script> 131 """ 132 133 # Generate tests 134 135 # wipe target_dir 136 if os.path.isdir(target_dir): 137 shutil.rmtree(target_dir) 138 139 def write_file(path, content): 140 path = os.path.join(target_dir, path) 141 os.makedirs(os.path.dirname(path), exist_ok=True) 142 file = open(os.path.join(target_dir, path), 'w') 143 file.write(content) 144 file.close() 145 146 def generate_tests(prop, el_id, el_markup): 147 test = template.format(props=prop, el_id=el_id, el_markup=el_markup) 148 write_file(f"kind-of-widget-fallback-{el_id}-{prop}-001.html", test) 149 150 def generate_grouped_tests(group): 151 test = template.format(props=",".join(group), el_id="all-elements", el_markup=all_els) 152 write_file(f"grouped-kind-of-widget-fallback-{group[0]}-001.html", test) 153 154 for group in props_grouped: 155 generate_grouped_tests(group) 156 for prop in group: 157 for el_id, el_markup in els: 158 generate_tests(prop, el_id, el_markup)