pushqrdx / vscode-inline-html

🎨 Adding Syntax Highlighting, Emmet, IntelliSense support for ES6 Template Strings in Visual Studio Code.
https://marketplace.visualstudio.com/items?itemName=pushqrdx.inline-html
GNU General Public License v3.0
54 stars 15 forks source link

No Emmet expansion for same line template literals #4

Open mblais opened 5 years ago

mblais commented 5 years ago

I just installed the extension (thanks! :)

When I create an html inline string, the first tag I add does not get emmet-expanded - I see the emmet popup, but when I hit Enter, it disappears without substituting.

After I manually enter a valid closed tag, all works fine following it.

pushqrdx commented 5 years ago

@mblais I'll have to test this out once i am home. Glad you found it useful though :)

pushqrdx commented 5 years ago

@mblais I can't seem to reproduce this issue on latest VS, Could you please provide more details?

mblais commented 5 years ago

Try it with your cursor at the end of a file.

I just reinstalled it - I'm getting the inline HTML syntax coloring in a .js file, but still no emmet.

My emmet is working in a .html file.

pushqrdx commented 5 years ago

@mblais Could you generate a file with the content that bugs? or record a quick gif. I really want to reproduce this to get it fixed.

mblais commented 5 years ago

Literally anything - I just tried this with same result:

function demo_inline_html ()
{
    var a = /*html*/`div.clas  `     // no emmet for me
    var b = html`div.cla  `     // no emmet here either
}

If you want to insert some debug info in the extension I'd be happy to send you the output.

pushqrdx commented 5 years ago

@mblais I can reproduce it now, For some reason, It's because you have the tilde on the same line. A temporary solution is to just add a new line so instead of

var a = html`div...` // This won't work

do

var a = html`
// Type your code here and emmet will behave correctly.
`

Anyways I'll try to fix this asap.

mblais commented 5 years ago

Unfortunately that doesn't work either.

mblais commented 5 years ago

I think I understand the problem: in order for emmet to work here, a couple things need to be true:

When I get all the conditions correct, it works :-)

But honestly, how is a newbie supposed to guess these restrictions?

pushqrdx commented 5 years ago

@mblais I labeled this as a bug because, indeed, it doesn't have to be like this and this behavior is completely unexpected for the user. Problem is, this has to do more with how VSCode doesn't "officially" support embedded languages. The limitation is a side effect rather than a bug but i'll definitely try to work around it.