[Bug]: HTML code completion does not work 100% when extension is enabled

[rabol]

Extension Version

1.0.8

PHP Binary

Valet

Operating System

macOS

What happened?

In a blade file, type this:

div.flex

and hit tab, normally that will expand to

but when this extension is enabled that functionality does not work.

One observation: when you start typing div.

you get this:

notice the 'emmet' text at the top

but as soon as you start typing after the dot you get this:

notice that the emmet is gone, which I why the expansion is not working - I think.

Mimimal Code Sample

Create a new empty blade file

start typing div and you can see the issue

[N1ebieski]

It works for me:

My emmet config:

    "emmet.includeLanguages": {
        "blade": "html"
    },

[rabol]

I did not have any emmet configuration and it also works fine for me if I turn off the extension.

But thanks for the hint, now it also works for me.

I still think it some kind of bug or it should be documented that one need extra settings.

[ace-of-aces]

I agree with @rabol, this should work out of the box and not require user configuration because Emmet is core to VS Code IMO.

The popular laravel-blade-snippets-vscode extension provides this exact default behavior described by @N1ebieski since 1.14.2 (see changelog).

Might attempt a PR for this if I find time.

[bakerkretzmar]

I got HTML element completion back (mostly) by adding the Emmet language association but HTML attributes are still broken. Without the extension when I start typing inside an HTML element it'll suggest attributes like class or id, but with the extension enabled:

It doesn't even recognize attributes I type in myself, once I type class= it doesn't add quotes or suggest them (without the plugin enabled it does).

[N1ebieski]

@bakerkretzmar I'm afraid nothing more can be done about it.

if you want html elements/attributes autocompletion you have to change:

"files.associations": {
    "*.blade.php": "html"
}

but then you will lose Laravel Blade autocompletion/highlighting from this extension :/

[ace-of-aces]

@N1ebieski Of course something can be done about it, this works perfectly fine in laravel-blade-snippets-vscode.

Emmet is consumable for extensions via vscode-emmet-helper and can be included in this extension.
It's just a missing core feature that feels like a bug.

[N1ebieski]

@ace-of-aces emmet works fine with this extension with this config. What doesn't work is native VSCode HTML elements/attributes autocompletion, as mentioned by @bakerkretzmar.

laravel-blade-snippets-vscode is another extension, but for me it works without the conflict:

[ace-of-aces]

@N1ebieski Ok yeah, emmet was a misunderstanding on my side. I still think this should work by default and not require user config.

Reading through the other extensions source code a little, my guess is they're providing a doComplete method in an htmlMode via the vscode-html-languageservice (source), while this extension is only using the html language service for formatting and highlighting (code search resullts). Just a quick search tho, so I might be wrong here.