chore: add new css language service with less/scss style lint

Author: abose

package-lock.json

@@ -91,7 +91,7 @@
         "@fortawesome/fontawesome-free": "^6.1.2",
         "@highlightjs/cdn-assets": "^11.5.1",
         "@phcode/fs": "^3.0.0",
-        "@phcode/language-support": "^1.0.6",
+        "@phcode/language-support": "^1.0.7",
         "@pixelbrackets/gfm-stylesheet": "^1.1.0",
         "@prettier/plugin-php": "^0.22.2",
         "@uiw/file-icons": "^1.3.2",

package.json

@@ -29,6 +29,8 @@ define(function (require, exports, module) {
     // Load dependent modules
     const CodeInspection     = brackets.getModule("language/CodeInspection"),
         Strings            = brackets.getModule("strings"),
+        LanguageManager = brackets.getModule("language/LanguageManager"),
+        StringUtils           = brackets.getModule("utils/StringUtils"),
         IndexingWorker     = brackets.getModule("worker/IndexingWorker");
 
     IndexingWorker.loadScriptInWorker(`${module.uri}/../worker/css-worker.js`);
@@ -41,15 +43,27 @@ define(function (require, exports, module) {
         }
     }
 
+    const cssMode = {
+        css: "CSS",
+        less: "LESS",
+        scss: "SCSS"
+    };
+
     /**
      * Run JSLint on the current document. Reports results to the main UI. Displays
      * a gold star when no errors are found.
      */
     async function lintOneFile(text, fullPath) {
         return new Promise((resolve)=>{
+            const languageId = LanguageManager.getLanguageForPath(fullPath).getId();
+            if(!cssMode[languageId]){
+                console.error("Unknown language id to lint: ", languageId, fullPath);
+                resolve();
+                return;
+            }
             IndexingWorker.execPeer("cssLint", {
                 text,
-                cssMode: "CSS",
+                cssMode: cssMode[languageId],
                 filePath: fullPath
             }).then(lintResult =>{
                 if (lintResult && lintResult.length) {
@@ -70,8 +84,11 @@ define(function (require, exports, module) {
     }
 
     // Register for JS files
-    CodeInspection.register("css", {
-        name: Strings.CSS_LINT_NAME,
-        scanFileAsync: lintOneFile
-    });
+    const supportedLanguages = ["css", "less", "scss"];
+    for(let language of supportedLanguages){
+        CodeInspection.register(language, {
+            name: StringUtils.format(Strings.CSS_LINT_NAME, cssMode[language]),
+            scanFileAsync: lintOneFile
+        });
+    }
 });

src/extensions/default/CSSCodeHints/css-lint.js

@@ -22,7 +22,11 @@
 
 (function () {
     function cssLint(params) {
-        return  CSSLanguageService.validateCSS(params.text, params.cssMode, params.filePath, {
+        const cssMode = CSSLanguageService.CSS_MODES[params.cssMode];
+        if(!cssMode) {
+            throw new Error("Language mode not supported "+ params.cssMode);
+        }
+        return  CSSLanguageService.validateCSS(params.text, cssMode, params.filePath, {
             duplicateProperties: "warning",
             zeroUnits: "warning",
             emptyRules: "warning",

src/extensions/default/CSSCodeHints/worker/css-worker.js

@@ -877,7 +877,7 @@ define({
     "JSHINT_NAME": "JSHint",
 
     // extension css code hints
-    "CSS_LINT_NAME": "CSS Lint",
+    "CSS_LINT_NAME": "{0} Lint",
 
     // Features/QuickView and quick view extensions
     "CMD_ENABLE_QUICK_VIEW": "Quick View on Hover",

src/nls/root/strings.js

@@ -25,17 +25,19 @@ importScripts('../thirdparty/no-minify/language-worker.js');
 
 (function () {
     function CSSGetAllSymbols({text, cssMode, filePath}) {
-        if(!CSSLanguageService.CSS_MODES[cssMode]) {
+        const cssModeID = CSSLanguageService.CSS_MODES[cssMode];
+        if(!cssModeID) {
             throw new Error("Language mode not supported "+ cssMode);
         }
-        return CSSLanguageService.getAllSymbols(text, cssMode, filePath);
+        return CSSLanguageService.getAllSymbols(text, cssModeID, filePath);
     }
 
     function htmlGetAllLinks({text, htmlMode, filePath}) {
-        if(!HTMLLanguageService.HTML_MODES[htmlMode]) {
+        const htmlModeID = HTMLLanguageService.HTML_MODES[htmlMode];
+        if(!htmlModeID) {
             throw new Error("Language mode not supported "+ htmlMode);
         }
-        return HTMLLanguageService.getAllDocumentLinks(text, htmlMode, filePath);
+        return HTMLLanguageService.getAllDocumentLinks(text, htmlModeID, filePath);
     }
 
     WorkerComm.setExecHandler("css_getAllSymbols", CSSGetAllSymbols);