vscode-phoenix icon indicating copy to clipboard operation
vscode-phoenix copied to clipboard

Consider adding a language services embed for HTML as part of this extension?

Open nicbet opened this issue 1 year ago • 1 comments

First of all: thank you for providing and officially supporting such a fine VSCode extension for the Phoenix framework!

After working with this extension and HEEx templates for a while I noticed that HTML Intellisense behaviour, such as automatic indentation between tags, autocomplete of attributes, etc., was not available when working with HEEx files or inside of ~H sigils.

Out of the box, VSCode only provides the enhanced Intellisense experience for .html files. While we can configure other extensions like emmet or bradlc.vscode-tailwindcss to be enabled in HEEx via user settings, expanding the built-in HTML Intellisense to HEEx appears to be bit more involved.

Microsoft provides a detailed write-up on how this functionality can be accomplished via language extensions at [1] with source code examples at [2], [3]. For instance, the vscode-html-erb extension uses such a language services embed to offer HTML-Intellisense in Ruby (.erb) templates.

Given the similarity of HEEx and ERB syntax, aki77's code with some minor modifications implemented in a quick and dirty prototype showcases that a similar approach could perhaps be viable for HEEx.

Interestingly a language services embed seems to add TMScope to HTML tags in HEEx files, possibly providing an answer to #18.

nicbet avatar Nov 13 '23 12:11 nicbet

https://github.com/microsoft/vscode/pull/146731 added a feature for extensions to enable the builtin html-language extension on their languageId

"extensionDependencies": [
	"vscode.html-language-features"
],
"contributes": {
	"htmlLanguageParticipants": [
		{
			"languageId": "phoenix-heex",
                        "autoInsert": true
		}
	]
}

related: https://github.com/microsoft/vscode/pull/198583

RedCMD avatar Dec 31 '23 12:12 RedCMD