Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Emmet 2.0: every word is being expanded by emmet #30265

Closed
smlombardi opened this issue Jul 7, 2017 · 13 comments
Closed

Emmet 2.0: every word is being expanded by emmet #30265

smlombardi opened this issue Jul 7, 2017 · 13 comments
Assignees
Labels
bug Issue identified by VS Code Team member as probable bug emmet Emmet related issues verified Verification succeeded
Milestone

Comments

@smlombardi
Copy link

smlombardi commented Jul 7, 2017

  • VSCode Version: Code - Insiders 1.14.0-insider (b8cd5b9, 2017-07-06T20:14:49.095Z)
  • OS Version: Darwin x64 16.6.0
  • Extensions:
Extension Author (truncated) Version
ng-template Ang 0.1.4
vscode-markdownlint Dav 0.9.1
code-settings-sync Sha 2.8.2
sort-lines Tyr 1.3.0
Bookmarks ale 0.15.2
project-manager ale 0.18.1
path-intellisense chr 1.4.2
vscode-eslint dba 1.2.11
vscode-html-css ecm 0.1.7
tslint eg2 0.16.0
auto-rename-tag for 0.0.14
Angular2 joh 2.3.3
ecdc mit 0.10.3
HTMLHint mka 0.3.3
vscode-autoprefixer mrm 2.0.0
vscode-stylefmt mrm 2.4.1
angular2-inline nat 0.0.17
stylelint shi 0.26.0
ayu tea 0.4.0
change-case wma 1.0.0

(4 theme extensions excluded)


Steps to Reproduce:

  1. Assume you are trying to type <div class="foo">
  2. Type <div cl. Intellisense offers a completion of cl via Emmet for some reason.
  3. If you choose it, you get <div <cl></cl> which makes no sense.
  4. Shouldn't Emmet suggest class (or at least other attributes with "cl" if there was such a thing)?

jul-07-2017 15-25-53

@vscodebot vscodebot bot added the insiders label Jul 7, 2017
@vscodebot vscodebot bot added the emmet Emmet related issues label Jul 7, 2017
@niichie
Copy link

niichie commented Jul 9, 2017

This seems similar to what I'm having over here.. does your emmet basically suggest any word, whether it's an emmet snippet or not to be used as a tag? It would seem more useful if it only showed an emmet suggestions when it corresponded with an existing emmet snippet. It's pretty annoying inserting a break into a paragraph, only to have the last word turned into a set of tags.

#30277

@smlombardi
Copy link
Author

@niichie I agree, it shouldn't "suggest" completions that aren't real tags.

@ramya-rao-a
Copy link
Contributor

ramya-rao-a commented Jul 9, 2017

Agreed that this and #30277 even more is annoying. I initially let this be as people also wanted the case of div expanding to <div></div>. Here div is not an emmet snippet. But the expectation is to get it expanded to <div></div>

Here is my proposal:

  • Do not show emmet expansion in the suggestion list when the typed text is not a snippet (like img) or an abbreviation (like ul>li*3)
  • If Emmet: Expand Abbreviation is explicitly used, then expand whatever was typed regardless of whether it was a snippet/abbreviation or not.

This way, we do not forcefully push the option of expanding anyrandomthing to <anyrandomthing></anyrandomthing> via suggestion list where it might get expanded when hitting tab. But if the user explicitly runs the Emmet: Expand Abbreviation command, then we trust the judgement of the user and expand without any checks.

@ramya-rao-a ramya-rao-a changed the title Emmet 2.0: tag suggested as completion inside a tag Emmet 2.0: every word is being expanded by emmet Jul 9, 2017
@ramya-rao-a ramya-rao-a added the bug Issue identified by VS Code Team member as probable bug label Jul 9, 2017
@ramya-rao-a ramya-rao-a added this to the July 2017 milestone Jul 9, 2017
@niichie
Copy link

niichie commented Jul 9, 2017

So basically, if the word we typed is an emmet abbreviaton, it will be shown on the suggestion llist, for example:
p = <p></p> or ul>li*3 = <ul> <li>x3 </ul>

If it is not an emmet abbreviation, it will only be shown if Emmet: Expand Abbreviation is explicitly used?

So we will no longer be getting results such as randomword>tab = <randomword></randomword>

This would be a perfect solution, as the current implementation either has me choosing between not having any emmet suggestions at all, or having everything I type be turned into a suggestion.

@ramya-rao-a
Copy link
Contributor

Correct. Except p will not be expanded to <p></p> in the suggestion list
I took the example of img because it is a snippet that expands to <img src="" alt="">

Look at https://github.com/emmetio/snippets/blob/master/html.json for all the emmet snippets.

@niichie
Copy link

niichie commented Jul 9, 2017

This is actually a perfect solution, because in combination with the HTML5 Snippets plugin, you can get both the normal snippets like div, p, h1 as well as the emmet abbreviations. Will we be able to set the emmet abbreviations to take priority when there is a matching snippet?

@ramya-rao-a
Copy link
Contributor

I believe so, but wont be sure until I actually make the change

@ayyash
Copy link

ayyash commented Jul 14, 2017

I'm going to append to this thread because it looks like the same issues around emmet, recently, emmet lorem, generates a "div" tag around it, this is annoying.
Also on ever "enter" the last word is expanded into a tag, which is not what is really intended, the Tab should be enough (if that is configurable, then the default changed, how can I configure back?)

@ramya-rao-a
Copy link
Contributor

emmet lorem, generates a "div" tag around it

That's different. lorem is a valid abbreviation and emmet should have returned without the div. emmetio/atom-plugin#28 is logged as an upstream issue for that.

Also on ever "enter" the last word is expanded into a tag,

This will be covered in this current issue

@ramya-rao-a
Copy link
Contributor

Am back from vacation and conferences, now to some bug fixes :)

@smlombardi @niichie I have pushed a fix to skip emmet suggestions when text is not a known snippet or a form of abbreviation. Emmet: Expand Abbreviation command is not affected by this change.

The change will be out in Wednesday's Insiders (19th July)

Do try it out and let me know how it goes.

@niichie
Copy link

niichie commented Jul 18, 2017

Excited to try this out! Thanks :)

Any idea when the following will be fixed in emmet?
For some reason, the obvious abbreviation is second, even with the full word almost typed out!

capture

@ramya-rao-a
Copy link
Contributor

@niichie That is being tracked in #29473 for which I just pushed a fix. You should be able to see the change in Wednesday's Insiders (19th July)

@ramya-rao-a
Copy link
Contributor

Note to verifier:

  • Typing simple text in html file should trigger emmet suggestions
  • Type simple text and run the Emmet: Expand Abbreviation command and the text should get expanded to html tags
  • Commonly used html tags like div, head, body, ul, p etc should show up in the emmet suggestions
  • lorem, lorem20, lorem2` etc should show up in emmet suggestions

@mjbvz mjbvz added the verified Verification succeeded label Aug 2, 2017
@vscodebot vscodebot bot locked and limited conversation to collaborators Nov 17, 2017
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
bug Issue identified by VS Code Team member as probable bug emmet Emmet related issues verified Verification succeeded
Projects
None yet
Development

No branches or pull requests

5 participants