ST4 align-items, align-self ... not reconized as a properties

[artik]

align-items or align-self properties is not reconized as a property, when justify-content is. Demo:

https://i.imgur.com/klCldih.gif

[braver]

And what happens if you add the : after align-items? Because SCSS is nested, it needs a little help to find out that you're typing a property and not a selector.

[jfcherng]

btw,

---

fix: https://github.com/braver/SublimeSass/blob/4ee59a5be9257d5b220c1448000321fc6babd672/Syntaxes/Sass.sublime-syntax#L383

-    - match: '\s*({{custom_elements}})(?![-:])'
+    - match: '\s*({{custom_elements}})(?!-|\s*:)'

[artik]

@braver Yes, it then appears as a property when i add :, but .css files aren't affected by this behavior:

And works, adding automatically the : ;

[artik]

Fixed! thanks @jfcherng

[braver]

Good catch @jfcherng, implemented your suggested fix.

[artik]

Re-opening the issue, I'm affected by the same bug once again. Using ST4 and Sass.sublime-packagev2.5.3. In my package file, the fix is here:

But the bug still occurs:

[jfcherng]

Well, LGTM. It think you can use align-items as a custom tag in HTML5. If you add :, then that's what you want. But : can be a starting of pseudo selectors too.

<align-items>
    some other HTML codes
</align-items>

---

My another finding is I would say this is wrong.

[artik]

I have another detail on this bug, it affects some scss files, not all:

[jfcherng]

I have another detail on this bug, it affects some scss files, not all:

I believe I've answered that.

Well, LGTM. It think you can use align-items as a custom tag in HTML5. If you add :, then that's what you want.

[artik]

I have another detail on this bug, it affects some scss files, not all:

I believe I've answered that.

Well, LGTM. It think you can use align-items as a custom tag in HTML5. If you add :, then that's what you want.

Understood, but it doesn't tell me why in one file it's properly displayed, not in the other. I'm having 2 different behaviors that mix me a bit when fast coding, really would love to know why and fix it to have the same behavior everywhere.

[jfcherng]

Understood, but it doesn't tell me why in one file it's properly displayed, not in the other. I'm having 2 different behaviors that mix me a bit when fast coding, really would love to know why and fix it to have the same behavior everywhere.

I was just to answer that the your new question about autocompletion is not relevant to the issue. So re-open this issue is doubtful to me.

[artik]

Found something useful. When I write it in one line, it works:

[jfcherng]

There are probably 3 kinds of autocompletion involved in.

1. The one without kind info. Probably comes from ST's word completion or outdated plugin.

   

2. The one with kind info (i.e., the prefixed pink p). Probably comes from ST's symbol index or modern plugin like LSP-css.

   

3. The green background one, which comes from Emmet.

   

---

But I don't know what's going on here and don't know how to fix it.

[artik]

All clearer, thanks. I'll try to deactivate plugins and investigate. If I can't find I'll post on ST forums.

[artik]

Interesting answer from Deathaxe https://forum.sublimetext.com/t/bug-st4-auto-completion-doesnt-work-properly-in-scss-files/60386/8?u=artik

This issue is a package issue only for sure.

Sass package provides its own sass_completions.py plugin which provides those completions.

The default css_completions.py which ships with ST’s CSS syntax package, does not handle SCSS at all. It just returns “I have nothing to add here”. So this one is not to blame.

ST correctly calls on_query_completions in both illustrated situations. So it’s not a core issue either.

It’s SASS’s sass_completions.py which returns nothing in your second example, because as soon as you type a character, it is scoped meta.selector, which causes the completions plugin to return None at line 644 as it doesn’t handle them.

https://github.com/braver/SublimeSass/blob/d3d94046409db6fbbc9d51dea52b589ecc9d3d48/sass_completions.py#L632-L633

[braver]

Probably it's that without further information the syntax cannot decide if align-items is a custom selector or a property key, and therefore cannot provide you with suggestions. I'm not 100% sure it can be solved completely, but let's keep this open and see what happens.

[artik]

But the fact that in one line it works, I don't understand why when it's intended it doesn't, and shouldn't be different : https://github.com/braver/SublimeSass/issues/80#issuecomment-904563611

I also think most devs would prefer by default a property completion (and removing the : if they want a selector). Quite tricky to name a selector align-items.

If this cannot be commited in the git, maybe you can tell me wich part to the sass_completions.py I can change to force the completion? It would be amazing as this property drives me crazy everytimes I use it during the day :)

[braver]

A 3.0 beta release is out now, check the readme on how to get the early builds to take advantage of the improvements and help out improving the package before we ship it to the world.

[artik]

Woaw, looks fixed in beta! Back to fast coding again, thanks for your work. I'll try it deeper in the coming days. I switch this one to close, and re-open a new issue if I find one.