CSS, LESS, SCSS preferences

[angelozerr]

CSS, LESS, SCSS preferences

Signed-off-by: azerr azerr@redhat.com

[angelozerr]

This PR provides preferences for CSS, LESS, and SCSS files:

This PR enables too the CSS, LESS, SCSS formatting (you can do Ctrl+Shift+F), BUT even this PR format page, I uncomment it in plugin.xml because of limitation of LSP4E which cannot customize FormattingOptions, the CSS language server expect that.

I created an issue at microsoft/vscode#164772, hope vscode will fix it, otherwise if we want to have preferences for CSS format, LSP4E should give the capability to customize FormattingOption. Here the vscode trace:

[Trace - 05:20:41] Sending request 'textDocument/rangeFormatting - (291)'.
Params: {
    "textDocument": {
        "uri": "file:///c%3A/Users/azerr/Downloads/vscode-xml-catalog-test/test.scss"
    },
    "range": {
        "start": {
            "line": 0,
            "character": 0
        },
        "end": {
            "line": 11,
            "character": 3
        }
    },
    "options": {
        "tabSize": 4,
        "insertSpaces": false,
        "trimTrailingWhitespace": true,
        "newlineBetweenSelectors": true,
        "newlineBetweenRules": true,
        "spaceAroundSelectorSeparator": false,
        "braceStyle": "collapse",
        "preserveNewLines": true
    }
}

You can see that newlineBetweenSelectors which is a custom CSS format setting is filled in FormattingOption.

This PR will fix for instance #719 by setting this validation setting to ignore

[angelozerr]

Please note those CSS preferences works too in HTML file when you declare embeded style.

[angelozerr]

@vrubezhny @akurtakov is it possible for you to review this PR please. There are a lot of code but very basic. Thanks!

[akurtakov]

I guess vscode handles that through some kind of json file , right? I also wonder doesn't it also make sense to embed json file editor and handle it that way instead of all the widgets. If we go that path we would allow direct usage of new options as soon as LS is updated to new version instead of a developer having to add few more options.
P.S. I know this is not how Eclipse used to do things but it sounds as better option given current manpower.

[angelozerr]

I guess vscode handles that through some kind of json file , right?

Yes with package.json

I also wonder doesn't it also make sense to embed json file editor and handle it that way instead of all the widgets. If we go that path we would allow direct usage of new options as soon as LS is updated to new version instead of a developer having to add few more options.

At first I did that for HTML preferences which has been merged. Your idea is to build dynamicly the UI according to the package.json content. Dynamic UI is very nice when you implement it but can become a nightmare when it doesn't work or you need to manage custom behavior.

If you wish I do that it means that we must redo the HTML preferences too. In my case I wrote a little generator (not perfect to generate Messages, preferences constant, etc, for instance it doesn't generate UI)

[angelozerr]

Dynamic UI is very nice when you implement it but can become a nightmare when it doesn't work or you need to manage custom behavior.

A sample is with label which can b every long. To fix that I followed suggestion from @vrubezhny by adding at hand some \n in the proper location. With dynamic strategy it is very hard to set those \n

[angelozerr]

Dynamic UI is very nice when you implement it but can become a nightmare when it doesn't work or you need to manage custom behavior.

Another sample is if you want to improve UI by grouping some preferences in some tabs for instance, it is very hard to do that too.

[akurtakov]

Well, my idea is to not have any UI but rather the whole preference page being directly editor for package.json file. Aka smth like what was tried back in the days https://wiki.eclipse.org/Eclipse4/CSS.
Just to be clear, I'm not interested in generated UI but rather in less UI if possible.

[angelozerr]

Ok I understand what you mean, you would like to have a JSON editor which edit package.json more exactly a portion of package.json https://github.com/microsoft/vscode/blob/9ad069358e9f09d1f49a90db36b73c953505438a/extensions/css-language-features/package.json#L41 but it will require to manage a JSON editor light with completion, validation, I'm not sure that LSP4e can provide this feature without GenericEditor (or perhaps it means that preference page should embed a GenereicEditor instance).

In other words you want to edit settings exactly like vscode does. I think it is not a trivial task and to be honnest with you I will not have time to do that. My goal was to provide CSS preferences to be competitive with WTP CSS editor. Many people complains about those CSS preferences missing compare to WTP and WWD should improve that. This PR should fix (or almost fixed) those issues:

• CSS Format support #38
• WebTools code formatting options not used by Wild Web Developer #240
• I'd like to disable the css warning 'do not use empty rulesets' #719
• Custom CSS Properties and Warnings in Editor #638
• SCSS formatter #237 (without preferences)

The only thing which will miss is the customization of tabs / spaces but it is an another story which requires a big change on Platform Text.

IMHO I think we could start with those preferences (like HTML, XML already does) and like WTP does too, and we could in the future to the idea of JSON editor to edit settings.

[akurtakov]

Sure, I defer to @vrubezhny for actual code review of this patch. Opened #926 for further discussion on my suggestion.