fix: multiple css lint warnings should all list on hover

Author: abose

src/editor/EditorManager.js

@@ -825,4 +825,5 @@ define(function (require, exports, module) {
     exports.focusEditor                   = focusEditor;
     exports.getCurrentlyViewedPath        = getCurrentlyViewedPath;
     exports.setEditorHolder               = setEditorHolder;
+    window.ed = exports;
 });

src/language/CodeInspection.js

@@ -394,21 +394,7 @@ define(function (require, exports, module) {
             console.warn("CodeInspector: Invalid error position: ", error);
             return false;
         }
-        // now we only apply a style if there is not already a higher priority style applied to it.
-        // Ie. If an error style is applied, we don't apply an info style over it as error takes precedence.
-        let markings = editor.findMarksAt(error.pos, CODE_MARK_TYPE_INSPECTOR);
-        let MarkToApplyPriority = _getMarkTypePriority(error.type);
-        let shouldMark = true;
-        for(let mark of markings){
-            let markTypePriority = _getMarkTypePriority(mark.type);
-            if(markTypePriority<=MarkToApplyPriority){
-                mark.clear();
-            } else {
-                // there's something with a higher priority marking the token
-                shouldMark = false;
-            }
-        }
-        return shouldMark;
+        return true;
     }
 
     /**
@@ -498,7 +484,7 @@ define(function (require, exports, module) {
             let codeInspectionMarks = editor.findMarksAt(pos, CODE_MARK_TYPE_INSPECTOR) || [];
             let hoverMessage = '';
             for(let mark of codeInspectionMarks){
-                hoverMessage = `${hoverMessage}${mark.message}\n`;
+                hoverMessage = `${hoverMessage}${mark.message}<br/>`;
             }
             if(hoverMessage){
                 resolve({

src/styles/brackets.less

@@ -125,6 +125,10 @@ html, body {
     }
 }
 
+.code-inspection-item {
+    text-align: left;
+}
+
 .editor-text-fragment-hover{
     text-decoration-style: solid;
     text-decoration-line: underline;
@@ -151,13 +155,17 @@ html, body {
     border-right: 2px @bc-primary-btn-border solid;
 }
 
-.editor-text-fragment-error{
+// error class has highest visual precedence, followed by warning, spell error and info.
+// .error.error: This selector has 4x the class name, which increases its specificity compared to single class
+// selectors like .warning or .info. Even if error, warning, and info are used on the same div in any order,
+// the style for .error.error will take precedence due to its higher specificity.
+.editor-text-fragment-error.editor-text-fragment-error.editor-text-fragment-error.editor-text-fragment-error{
     border-bottom:2px dotted @error-underline-text;
     display: inline-block;
     position: relative;
 }
 
-.editor-text-fragment-error:after{
+.editor-text-fragment-error.editor-text-fragment-error.editor-text-fragment-error.editor-text-fragment-error:after{
     content: '';
     width: 100%;
     border-bottom:2px dotted @error-underline-text;
@@ -167,13 +175,13 @@ html, body {
     left: 2px;
 }
 
-.editor-text-fragment-warn{
+.editor-text-fragment-warn.editor-text-fragment-warn.editor-text-fragment-warn{
     border-bottom:2px dotted @warn-underline-text;
     display: inline-block;
     position: relative;
 }
 
-.editor-text-fragment-warn:after{
+.editor-text-fragment-warn.editor-text-fragment-warn.editor-text-fragment-warn:after{
     content: '';
     width: 100%;
     border-bottom:2px dotted @warn-underline-text;
@@ -199,13 +207,13 @@ html, body {
     left: 2px;
 }
 
-.editor-text-fragment-spell-error{
+.editor-text-fragment-spell-error.editor-text-fragment-spell-error{
     border-bottom:2px dotted @spell-underline-text;
     display: inline-block;
     position: relative;
 }
 
-.editor-text-fragment-spell-error:after{
+.editor-text-fragment-spell-error.editor-text-fragment-spell-error:after{
     content: '';
     width: 100%;
     border-bottom:2px dotted @spell-underline-text;

test/spec/Extn-CSSCodeHints-integ-test.js

@@ -144,6 +144,11 @@ define(function (require, exports, module) {
                 await checkCSSWarningAtPos("@font-face rule must define 'src' and 'font-family' properties (fontFaceProperties)",
                     39, 8);
             });
+
+            it("Should show unknown vendor prefix warning", async function () {
+                await checkCSSWarningAtPos("Unknown vendor specific property. (unknownVendorSpecificProperties)Also define the standard property 'border-radius' for compatibility (vendorPrefix)",
+                    43, 8);
+            });
         });
 
     });