I'm working on a Pug template in VS Code and whenever I try to use the emmet abbreviation input:text (or any input for that matter), it resolves to input#(type="text", name="").
It's not the end of the world, but it's driving me crazy, and I can't figure out why it's doing so or how to change it.
I guess my question is: is there any way to change this behavior or any place that I can draw attention to this?
The problem is the treatment of the attributes id and class for indent-based syntaxes (Slim, Pug, etc.).
For some reason it removes the attribute from its current position and pushes to the front the strings # for id and . for class.
This is controlled with 2 regex statements near line 3297 in
C:\Program Files\Microsoft.VS.Code\resources\app\extensions\emmet\node_modules\vscode-emmet-helper\out\expand\expand-full.js
Change
const reId = /^id$/i;
const reClass = /^class$/i;
to
const reId = /^Xid$/i;
const reClass = /^Xclass$/i;
You must also remove the cached version of this file in the directory
C:\Users\__username__\AppData\Roaming\Code\CachedData\__some_hex_value__
Restart VSC and it should work.
For linux systems you have to find the location of these files.
I finally understand why this is happening, and that my confusion was basically a misunderstanding of proper form creation.
All text inputs should have an id associated with them, so Emmet is expecting an ID in the shorthand. So this:
input:text#user
resolves to
input#user(type="text", name="")
Which works great! Too bad it took me months of confusion to I realized how daft I am!