Wrap with abbreviation in real time

[okram69]

A very useful feature to add to VS Code would be adding emmet wrap with abbreviation in real time.
That I'm aware today it is possible to do that bindings the command "editor.emmet.action.wrapWithAbbreviation" to a shortcut key and it works, but non in real time, you only see the result of your editing when you press Enter

[ramya-rao-a]

So you are saying that you'd like to see the result as you type the abbreviation?

[okram69]

Exactly. It's something that I was used to on my former code editor and would be indeed a really helpful functionality to have.

[ZeroVa]

This would be very helpful.

[ramya-rao-a]

@okram69 Can you provide a gif how this worked in your former code editor? Or share which editor was it

[okram69]

And by the way, the code editor was Sublime Text.

[ramya-rao-a]

Thanks! I'll take a look

[KristjanTammekivi]

+1, emmet live preview in sublime is the only thing I miss

[ramya-rao-a]

Currently there is no way to listen to events from the input box where you would type the abbreviation.
Once #426 is implemented, we will have the required plumbing to get the "Wrap with abbreviation in real time" feature

[ZeroVa]

+1
Hoping that happens soon! :) This would help speed up many small tasks. Fixing up my configs recently got Emmet and JSX to play nicely, and it's the happiest I've been with VSCode so far.

[burkeholland]

Great feature idea! Also requested here https://css-tricks.com/can-vs-code-emmet

[jaegz]

+1
One of the most powerful features of ST2/3 + Emmet - this is a must for VS Code!

[ramya-rao-a]

Turns out we dont need #426 to do this. One of the options passed when creating the input box is a callback that returns the typed text. This can be used to expand the abbreviation in real time.

[usernamehw]

Wrap Individual Lines with Abbreviation is not covered by live preview.

[ramya-rao-a]

@usernamehw Yes, that's why this issue is not closed yet :) We will include live preview for Wrap Individual Lines with Abbreviation for the March release

Until then, please try out the live preview for the Wrap with Abbreviation command and share feedback