1.13.0 | New Emmet expansion suggestions don't honor emmet.syntaxProfiles setting

[zackkrida]

• VSCode Version: 1.13.0
• OS Version: OSX 10.12.5

Steps to Reproduce:

1. Add new setting "emmet.useNewEmmet": true,
2. Enter a php file and type any HTML tag
3. The expansion suggestions do not appear

[blukai]

The same with vue,
With emmet.useNewEmmet set to true it doesn't work.

"emmet.syntaxProfiles": {
  "vue-html": "html",
  "vue": "html"
}

[hleon57]

@blukai yea happened to me too 😢

[ramya-rao-a]

Thanks for reporting this.

The feature of mapping a non emmet supported language to emmet supported language is not yet implemented in the new emmet model.

I have added this to the June plan for emmet.

For now, you will have to turn emmet.useNewEmmet off to get emmet expansions in any file that is not among the below

'html', 'xml', 'xsl', 'jsx', 'js', 'pug', 'slim', 'haml', 'css', 'sass', 'scss', 'less', 'sss', 'stylus'

[ramya-rao-a]

With 1809bb2 the emmet.syntaxProfiles setting works as before in the new emmet

This will be out in the coming Wednesday's (21st June) Insiders build

[nanaasumadu]

@ramya-rao-a

Can PHP with embedded HTML be added to the supported language list?

[ramya-rao-a]

@nanaasumadu Doesnt the below work for you?

"php: "html"
}
``

[ramya-rao-a]

After enabling the use of emmet.syntaxProfiles for both Emmet: Expand Abbreviation command and the emmet suggestions, we have seen issues where the suggestions pop up in irrelevant places and tend to get either noisy or are of incorrect syntax (eg: gives html suggestions inside a style block in a vue file)

See #29318 #29185 and #29114

This is because the emmet extension is not aware of embedded languages (case of style blocks in vue files or js code in jsx files) and wrong locations (like <? in php)

Therefore, its best that we leave the decision to trigger emmet suggestions to language specific extensions who know better.

Conclusion:

• You can still use emmet.syntaxProfiles to get Emmet: Expand Abbreviation command to give you emmet abbreviation expansions. Bind a keyboard shortcut to it (just not Tab)
• Emmet suggestions will not be showing up for languages which have been emmet enabled using emmet.syntaxProfiles
• Language extensions can easily trigger emmet completions by using the vscode-emmet-helper module. See Enable language extensions to call emmet completion provider #29114 (comment)

Thanks to everyone who provided feedback!

[nanaasumadu]

@ramya-rao-a

Emmet: Expand Abbreviation has stoped working for php files in the vscode-insiders build 2017-06-26T05:03:31.319Z. It was working fine in the build on 2017-06-23.

I still have the following in my settings.json file:

"emmet.useNewEmmet": true,
"emmet.syntaxProfiles" : {
"php": "html"
}

[ramya-rao-a]

@nanaasumadu I was pretty happy when I saw your comment on emmet working again for you after re-installing the Insiders.

Looks like we are back to square one.

The command Emmet: Expand Abbreviation continues to work for me in php files

@jens1o Can you give it a try?

[nanaasumadu]

@ramya-rao-a Yes, it was all working until I install the latest build of vscode-insider yesterday. Is there any way of reverting to the previous build for testing?? I am certain something has changed in the latest build that is causing that.

I have tried on two different Macs with the same result.

[ramya-rao-a]

@nanaasumadu I don't think we can go back to a previous version of Insiders.

• Are you referring to the emmet auto complete in php or the command Emmet: Expand Abbreviation?
• Does it work with emmet.useNewEmmet: false?
• Set emmet.useNewEmmet back to true. Open your dev tools (Developer: Toggle Developer Tools). Go to Sources open the file emmetAction.ts and add a breakpoint as shown below and run the Emmet: Expand Abbreviation command again. Does it hit the breakpoint? What is the value of syntax?

[jens1o]

Timezones...

@ramya-rao-a It works for me:

However, it is bound to Tab, but I do not set it to it, nor Tab actually executes the command. (found the issue: #27611)

[nanaasumadu]

@ramya-rao-a After setting "emmet.useNewEmmet" to "false" and "true" again, Emmet: Expand Abbreviation" works in my php file. As mentioned above, tab completion doesn't work.

If I, however, set "emmet.useNewEmmet" to false, tab completion works.

Emmet auto complete in php doesn't work now when "emmet.useNewEmmet" is set to true. It was working fine in vscode-insider build on 23/06/17.

Any ideas??

[nanaasumadu]

@ramya-rao-a

I think this issue may be what I am experiencing. I didn't realise that emmet suggestions has been disabled for php and responsibility passed on to the language specific extensions.

Is there a fallback until the extension authors can make their extensions "emmet" aware to call emmet completion provider instead of the emmet extension itself trying to suggest ?

I think if you can provide a user setting such "emmet.useLanguageExtension" which can be set to true or false as fallback will be good.

Alternatively, are you able to provide vscode-emmet-helper as a VSIX and provide an option for a user to set which language such as "emmet.autocompleteSuggestion": "php" ?

Some of us find the emmet suggestions and completions very useful when working in PHP/HTML mixed environment.

[ramya-rao-a]

@jens1o Thanks!

We are definitely moving away from binding Tab to Emmet. See https://code.visualstudio.com/updates/v1_13#_emmet-abbreviation-expansion-in-suggestion-list for more on this.

@nanaasumadu Let's use #29532 to track the option to allow suggestions to show up when the language is not a pure markup or stylesheet.

Meanwhile, please look at #29678 and add your thoughts there.
It is about using a different setting than emmet.syntaxProfiles to enable emmet abbreviation in languages other than the ones that are supported by default.

[nanaasumadu]

@ramya-rao-a
I have tested the new setting

"emmet.includeLanguages": { "php": "html" },
but emmet suggestion does not work.

html file

php file

"Emmet: Expand Abbrevation", however works.

[jens1o]

As far as I interpreted the code, this is by design.

[ramya-rao-a]

@nanaasumadu Am using #29532 to track the emmet suggestions for languages that are not pure markup or stylesheet

[nanaasumadu]

@ramya-rao-a Sorry about that. I have copied my comments to #29532 for completeness.

[ramya-rao-a]

No problem at all