gencer/SCSS-Everywhere

Extension doesn't detect IDs from css

minkir014 opened this issue ยท 20 comments

I have bootstrap 4 remote stylesheet. I set first set this in settings.json
"html-css-class-completion.remoteStyleSheets": [ "https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" ]
Although, it seems that some classes isn't working in completion.

Can you be more specific?

So you say, remote css works but some classes not listed, right? If so can you gave me an example or at least few classes that doesn't get listed.

Also, which language are you trying to get auto-complete? *.scss/*.sass, *.css or else?

I try to get bootstrap classes completion in html elements.I'll show you an example.

ds

It must show text-danger class and text-dark but it doesn't show the both.

I've reproduced this issue. Some classes get listed but some of them not. Like you said, text-danger and similar classes are not in the list.

Will try to fix as soon as possible.

Thank you for help.

I also noticed a new problem. I installed the bootstrap file inside my project and I noticed that any class under media queries isn't recognized by the extension.
Like this. It must have have shown p-lg- then any number from 0 to 5 but this is what happens.

min

and when I searched the bootstrap file I found that it's under media query

mina

Yes, parsing regex has problems. I am working on better regex pattern. If I can't do in one pass, I will add secondary check for such scenarios.

I noticed another problem. Your extension doesn't detect IDs anymore. See this. This is a CSS file with an ID and class

kk

When I type the class. Completion works.

kk1

but when I type the ID. Completion breaks.

kk2

@gencer where are you??

I'm looking for something on another extension. There is a delay but I will publish new version soon. Sorry for the delay.

For last bug (ID), I am not able to test it at the moment as im out of home. I will try to reproduce and report back to you.

Okay. When you reproduce the issue or not. Please tell me the results.

See this extension. It has nice completion for IDs and classes but its problem is that it has a problem with updating changes. It doesn't understand changes until restarting vs code.

https://github.com/ecmel/vscode-html-css

When will you push the next release??

@minkir014, Please try this build. You can install vsix file (inside the zip) via extension manager on VSCode.

1.5.16: html-slim-scss-css-class-completion-1.5.16.zip

Note that, This build only fixes missing classes. I will fix ID issue on next build. ID's are actually for slim files. I will make it work for HTML too.

Hey @minkir014, Try this new build for ID support. Let me know how it works.

1.5.17: html-slim-scss-css-class-completion-1.5.17.zip

The build 1.5.16 works for all classes but only when the css file is not remote. If it's remote. It still doesn't complete things but if it's local, it works perfectly.

The build 1.5.17 works fine for both classes an IDs but the problem of remote stylesheets still continues but it does its work for local styleshhets for both IDs and classes. Very Good. Continue working.

Any idea about why extension doesn't recognize all classes in remote stylesheets.

On my tests, remote works. I get the classes you mentioned in first post. Can you share settings.json part of this extension?

Oh. Very Good when I tried again. It worked as expected. When will you push that release to the marketplace?

@minkir014. Pushed it now. Will be available at marketplace in a few minutes.