Support for self-closing tags

[TheComputerM]

As of Svelte v3.24.0, support has been added for self-closing tags: sveltejs/svelte#5080.

However when implementing this, a syntax error is shown, the build is working just fine.

I do not know if this is the correct place to file this bug, or prettier-plugin-svelte so please guide me.

Thanks

[jasonlyu123]

The parser(parse5) we use doesn't recognize the self-closing style tag. probably because it's not valid HTML. Need to find a way to work around it.

language-tools/packages/svelte2tsx/src/htmlxparser.ts

Line 22 in 16cece2

const doc = parse5.parseFragment(htmlx, parseOpts) as DefaultTreeDocumentFragment;

[dummdidumm]

If it's only about finding the script and styles tag there, we could do the same as in extractTag in svelte-language-server and use the parser of the html-language-server which supports this I think.

[jasonlyu123]

@dummdidumm what about we also use the preprocess regex in the compiler to remove style in svelte2tsx for now.
https://github.com/sveltejs/svelte/blob/a62d7362150bacc6c84fe8c813ba9b8849216763/src/compiler/preprocess/index.ts#L117
The html-language-service approach also has some problem that needs to be taking care of.

[dummdidumm]

Good idea! It's only about blanking them out, finding the top level script is done elsewhere.

[dummdidumm]

I started implementing this for svelte2tsx.parseHtmlx but now found that we actually have more to do than just parse it differently: The support was implemented for preprocessors, not the compiler itself. So that means svelte.compile('<style />') will still throw an error. For us this means we would somehow have to transform /> to ></style while at the same time keeping the source mappings correct. EDIT: Maybe we could just blank the tag out completely then.