emmetio / sublime-text-plugin

The essential toolkit for web-developers
https://emmet.io
MIT License
255 stars 30 forks source link

Found few bugs #166

Closed kubiqsk closed 2 years ago

kubiqsk commented 3 years ago

Hello, after a long time I decided to try the new version again and I must say, it's really good ;) Here are few issues I'm still struggling with:

(*I'll use this | as a cursor position)

Missing semicolon in expanded values in CSS in @media

It works for code like

#test{
    db|
}

it becomes

#test{
    display: block;
}

but when you're inside @media, then

@media (max-width: 767px){
    #test{
        db|
    }
}

becomes

@media (max-width: 767px){
    #test{
        display: block
    }
}

Missing semicolon means inconsistent behavior and it becomes even worse, when you want to use more attributes like m0+p0 - then there are missing semicolons everywhere

Expand HTML in PHP not working

Again I'm referring to previous version and I'm used to use it this way

<?php
echo 'div.test|';
?>

should became this, when I press [TAB]

<?php
echo '<div class="test">|</div>';
?>

Yes, I know I can use [Ctrl+E], but why not [TAB]? Previously it worked and I would really like to make it works again.

Extra space from config snippets

In my config I have

"config": {
    "css": {
        "snippets": {
            "trr": "transform: rotate(${1:45}deg);",
        }
    }
}

but when this abbreviation expand in the CSS, it looks like this

transform: rotate(45 deg);

the space after 45 is incorrect - it's shouldn't be there

Incorrect color HEX

c#0d4c1d

is expanded to

color: #d04c1d;

so as you can see "d" and "0" switched their positions

kubiqsk commented 3 years ago

Hi @sergeche and @Shakil-Shahadat,

I found another bug (probably)

in old emmet when you enter in CSS

m0-a-10

is expanded to

margin: 0 auto 10px;

but in new emmet version it is

margin: 0 auto -10px;

and for negative value in old emmet you just use

m0-a--10

so I'm not sure if this was intentional or it's just some mistake, but again - i'm used to use it like this and now I was confused what's going on

it's working "correctly" when you use

m0-a10

but that's again some inconsistency as you should separate values by -

sergeche commented 3 years ago

The correct syntax is m0-a10. Emmet recognises transition from letters to numbers as a word bound so a and 10 are separated. As a rule for negative values, you should put - before word bound so a-10 are separated as a and -10.

The only case where - is used as a delimiter is between numbers, e.g. 10-20 is separated as 10 and 20, and 10--20 as 10 and -20

mklusak commented 3 years ago

Hi @sergeche, that issue with (not)adding semicolon after expanded CSS values in media queries drives me crazy. I hope you will look at it soon :-)

charroma commented 3 years ago

+1 for the missing semicolon after expansion in css media query.

kubiqsk commented 2 years ago

I've decided to create separate issues for every item - that's probably the correct way Incorrect color HEX - https://github.com/emmetio/sublime-text-plugin/issues/172 Missing semicolon in expanded values in CSS in @media - https://github.com/emmetio/sublime-text-plugin/issues/173 Expand HTML in PHP not working - https://github.com/emmetio/sublime-text-plugin/issues/174 Extra space from config snippets - https://github.com/emmetio/sublime-text-plugin/issues/175

MelkonSimonyan commented 2 years ago

+1 Missing semicolon in expanded values in CSS in @media