microsoft / vscode

Visual Studio Code
https://code.visualstudio.com
MIT License
164.32k stars 29.31k forks source link

Adopt formalized DAP ANSI styling support #227728

Closed connor4312 closed 2 months ago

connor4312 commented 2 months ago

Tracks adoption of https://github.com/microsoft/debug-adapter-protocol/issues/500

connor4312 commented 1 month ago

To verify:

  1. Use js-debug nightly https://github.com/microsoft/vscode-js-debug/?tab=readme-ov-file#nightly-extension
  2. Debug a node.js file like this:
const redText = '\x1b[31m%s\x1b[0m';
const greenText = '\x1b[32m%s\x1b[0m';
const yellowText = '\x1b[33m%s\x1b[0m';
const blueText = '\x1b[34m%s\x1b[0m';
const magentaText = '\x1b[35m%s\x1b[0m';
const cyanText = '\x1b[36m%s\x1b[0m';
const whiteText = '\x1b[37m%s\x1b[0m';

console.log(redText, 'This is red text');
console.log(greenText, 'This is green text');
console.log(yellowText, 'This is yellow text');
console.log(blueText, 'This is blue text');
console.log(magentaText, 'This is magenta text');
console.log(cyanText, 'This is cyan text');
console.log(whiteText, 'This is white text');
debugger;
  1. Verify the colors are correct when logged debug console
  2. Verify that the Variables view, variable hovers, and value when a variable is entered in the REPL it shows the actual string values (without styling)
  3. Now, Debug: Open Link and open https://code.visualstudio.com
  4. Enter const x = document.body; debugger; in the REPL
  5. Verify the HTML elements are colored when you look at x and its childrens in the debug hover, Variables view, and debug console
csgka1 commented 1 month ago

To verify:

  1. Use js-debug nightly https://github.com/microsoft/vscode-js-debug/?tab=readme-ov-file#nightly-extension
  2. Debug a node.js file like this:
const redText = '\x1b[31m%s\x1b[0m';
const greenText = '\x1b[32m%s\x1b[0m';
const yellowText = '\x1b[33m%s\x1b[0m';
const blueText = '\x1b[34m%s\x1b[0m';
const magentaText = '\x1b[35m%s\x1b[0m';
const cyanText = '\x1b[36m%s\x1b[0m';
const whiteText = '\x1b[37m%s\x1b[0m';

console.log(redText, 'This is red text');
console.log(greenText, 'This is green text');
console.log(yellowText, 'This is yellow text');
console.log(blueText, 'This is blue text');
console.log(magentaText, 'This is magenta text');
console.log(cyanText, 'This is cyan text');
console.log(whiteText, 'This is white text');
debugger;
  1. Verify the colors are correct when logged debug console
  2. Verify that the Variables view, variable hovers, and value when a variable is entered in the REPL it shows the actual string values (without styling)
  3. Now, Debug: Open Link and open https://code.visualstudio.com
  4. Enter const x = document.body; debugger; in the REPL
  5. Verify the HTML elements are colored when you look at x and its childrens in the debug hover, Variables view, and debug console

Hello, I encountered a problem in Node.js. When I input console.log('\x1b[31m%s\x1b[0m', 'This is red text'); (red text), it shows red texts correctly; but when I input console.log('\x1b[31mThis is red text\x1b[0m'); directly in the debug console, it was not colorized. same thing happens with log4js library. Is it a bug, or I have made any mistake? If needed, I can provide logs about that.