2226c8cdbb
This commit adds HTMLTagNameElementMap entries to every web component in the front end. Activating and associating the HTMLTagNamElementMap with its class has enabled [LitAnalyzer](https://github.com/runem/lit-analyzer/tree/master/packages/lit-analyzer) to reveal a *lot* of basic problems within the UI, the most popular of which is "missing import." We usually get away with it because the object being imported was already registered with the browser elsewhere, but it still surprises me that we haven't gotten any complaints over things like: ``` ./src/flow/stages/base.ts Missing import for <ak-form-static> 96: <ak-form-static no-missing-import ``` Given how early and fundamental that seems to be in our code, I'd have expected to hear _something_ about it. I have not enabled most of the possible checks because, well, there are just a ton of warnings when I do. I'd like to get in and fix those. Aside from this, I have also _removed_ `customElement` declarations from anything declared as an `abstract class`. It makes no sense to try and instantiate something that cannot, by definition, be instantiated. If the class is capable of running on its own, it's not abstract, it just needs to be overridden in child classes. Before removing the declaration I did check to make sure no other piece of code was even *trying* to instantiate it, and so far I have detected no failures. Those elements were: - elements/forms/Form.ts - element-/wizard/WizardFormPage.ts The one that blows my mind, though, is this: ``` src/elements/forms/ProxyForm.ts 6-@customElement("ak-proxy-form") 7:export abstract class ProxyForm extends Form<unknown> { ``` Which, despite being `abstract`, is somehow instantiable? ``` src/admin/outposts/ServiceConnectionListPage.ts: <ak-proxy-form src/admin/providers/ProviderListPage.ts: <ak-proxy-form src/admin/sources/SourceWizard.ts: <ak-proxy-form src/admin/sources/SourceListPage.ts: <ak-proxy-form src/admin/providers/ProviderWizard.ts: <ak-proxy-form type=${type.component}></ak-proxy-form> src/admin/stages/StageListPage.ts: <ak-proxy-form ``` I've made a note to investigate. I've started a new folder where all of my one-off tools for *how* a certain PR was run. It has a README describing what it's for, and the first tool, `add-htmlelementtagnamemaps-to-everything`, is its first entry. That tool is also documented internally. ``` Gilbert & Sullivan I've got a little list, I've got a little list, Of all the code that would never be missed, The duplicate code of cute-and-paste, The weak abstractions that lead to waste, The embedded templates-- you get the gist, There ain't none of 'em that will ever be missed, And that's why I've got them on my list! ```
88 lines
2.7 KiB
Python
88 lines
2.7 KiB
Python
#!/opt/homebrew/bin/python3
|
|
|
|
# Run June 25, 2024.
|
|
#
|
|
# A very primitive syntactically-oriented script for adding HTMLElementTagName declarations to files
|
|
# that don't have one. Note that it has a lot of failure conditions; it can only handle files where
|
|
# there is one and only one HTMLElement-derived class, it must be concrete not abstract, and the
|
|
# `extends` clause must be on the same line as the `class` token or it won't find it.
|
|
#
|
|
# Shortcomings aside, there were 360 web components in our system that lacked entries into the
|
|
# HTMLElementTagName global space and about 95% of them were fixed with this pass; the rest were
|
|
# done by hand.
|
|
#
|
|
# Usage:
|
|
#
|
|
# for i in $(rg -l customElement src/); do python add-global $i ; done
|
|
#
|
|
|
|
|
|
import re
|
|
import sys
|
|
|
|
customElement_re = re.compile(r'customElement\("([^"]+)"')
|
|
class_re = re.compile(r'class\s+(\w+)\s+extends')
|
|
tagmap_re = re.compile(r'interface HTMLElementTagNameMap')
|
|
|
|
def inject(fn):
|
|
with open(fn, "r", encoding="utf-8") as elemfile:
|
|
content = list(enumerate(elemfile.readlines()))
|
|
|
|
searchCustomElement = [l for l in content if customElement_re.search(l[1])]
|
|
searchClass = [l for l in content if class_re.search(l[1])]
|
|
searchTag = [l for l in content if tagmap_re.search(l[1])]
|
|
|
|
if len(searchCustomElement) > 1:
|
|
print("Skipping {}, too many custom element declarations".format(fn))
|
|
return
|
|
|
|
if len(searchClass) > 1:
|
|
print("Skipping {}, too many class declarations".format(fn))
|
|
return
|
|
|
|
if len(searchTag) > 0:
|
|
print("Skipping {}, HTMLElementTagNameMap already present".format(fn))
|
|
return
|
|
|
|
if len(searchCustomElement) == 0:
|
|
print("Skipping {}, no custom element found".format(fn))
|
|
return
|
|
|
|
if len(searchClass) == 0:
|
|
print("Skipping {}, no class found after custom element?".format(fn))
|
|
return
|
|
|
|
if (searchCustomElement[0][0] + 1) != searchClass[0][0]:
|
|
print("Skipping {}, customElement Declaration does not immediately precede class declaration".format(fn))
|
|
return
|
|
|
|
ceSearch = customElement_re.search(searchCustomElement[0][1]);
|
|
clSearch = class_re.search(searchClass[0][1]);
|
|
|
|
ceName = ceSearch.group(1)
|
|
clName = clSearch.group(1)
|
|
|
|
text = [l[1] for l in content]
|
|
|
|
text.extend([
|
|
"\n",
|
|
"declare global {\n",
|
|
" interface HTMLElementTagNameMap {\n",
|
|
' "{}": {};\n'.format(ceName, clName),
|
|
" }\n",
|
|
"}\n",
|
|
"\n"
|
|
]);
|
|
|
|
with open(fn, "w", encoding="utf-8") as elemfile:
|
|
elemfile.write("".join(text))
|
|
|
|
|
|
if __name__ == "__main__":
|
|
if len(sys.argv) < 2:
|
|
print("This requires a filename")
|
|
sys.exit(-1)
|
|
|
|
inject(sys.argv[1])
|
|
|