Add UI5 Linter Results to the VSCode's Report tab

Description

Currently, the UI5 Linter outputs results in an ESLint-like style to the console. To make these findings transferrable to the VSCode "Reports" tab, we need to adopt VSCode's formatter style.

Steps to Reproduce

Set up VSCode tasks for the project using the following sample code:

// .vscode > tasks.json
{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "UI5 version 2.0 check",
            "type": "shell",
            "command": "npx --yes @ui5/linter@latest",
            "problemMatcher": ["$eslint-stylish"]
        }
    ]
}

Run the task on a Windows machine.

Expected Behavior

The VSCode "Reports" tab should correctly parse the output from the UI5 Linter and display all findings.

Actual Behavior

On Windows machines, the output format is not properly parsed, and not all findings are transferred to the "Reports" tab.

Documentation

For more information on configuring VSCode tasks, refer to the documentation: VSCode Tasks Documentation.

Findings & Possible Solution

Currently, on Windows, when a new row is added by the terminal (not programmatically by the linter), it adds some whitespaces. These whitespaces are interpreted by the "problemMatcher": ["$eslint-stylish"] as a data separator, causing the description to be cut off.

We must find a way to make the problemMatcher treat the description as a whole text. Hint: The issue is not related to the chalk module. It does add some ANSI characters, but the issue is reproducible even without it.

A possible solution is to check ESLint's formatter implementation: ESLint Stylish Formatter. The table module used in the implementation orders the data in columns and rows, and the "divider" is a whitespace, which is likely causing the formatting issue on Windows.

SAP / ui5-linter