vscode-jest icon indicating copy to clipboard operation
vscode-jest copied to clipboard

Coloured output

Open jackfranklin opened this issue 8 years ago • 20 comments

Is it possible to have the output coloured as it would be if Jest ran in the terminal? Or is this a limitation of VSCode? I'm quite happy to have a crack at a PR if it's possible & someone can nudge me in the right direction :)

PS: thank you for your work on this plugin, it's incredible! 🎉

jackfranklin avatar Jun 06 '17 11:06 jackfranklin

This comment seems to suggest it might be possible: https://github.com/Microsoft/vscode/issues/243#issuecomment-284247045

jackfranklin avatar Jun 06 '17 11:06 jackfranklin

Hi - thanks

I was thinking a bit about this today actually. As it annoys me + others on my team. Really, we want to be running Jest inside the vscode terminal - then you get colours and clickable links.

Which actually means decoupling it from the jest-editor-support package for handling watch notifications maybe, which is a bit of a drastic change. Not one I'm opposed to if we can get colour

orta avatar Jun 06 '17 13:06 orta

Right now as a workaround, I simply run jest in the integrated terminal too

Haroenv avatar Jul 05 '17 12:07 Haroenv

Im using Output Colorizer and it seems to work great.

cgatian avatar Jul 05 '17 16:07 cgatian

@cgatian Was there anything you had to do to make it actually work? Jest output is still not coloured for me.

alloy avatar Jul 12 '17 11:07 alloy

@alloy no. I would verify your other output panels emit color. For example, TypeScript: image

cgatian avatar Jul 12 '17 12:07 cgatian

@cgatian Was there anything you had to do to make it actually work? Jest output is still not coloured for me.

Do you have Python or another extension installed that might override output colouring? If so, you must disable them.

0nse avatar Aug 25 '17 07:08 0nse

To elaborate on this a bit, the API to create a new Output Panel doesn't let you specify the language. If we wanted to apply syntax highlighting, we'd join these other extensions that would be matching the x-code-output MIME type. In addition to the syntax, it'd be useful to fix Microsoft/vscode#11005.

seanpoulter avatar Nov 14 '17 19:11 seanpoulter

Microsoft/vscode#11005 has been closed since it won't be implemented in the next 6-12 months. :confused:

seanpoulter avatar Jan 08 '18 06:01 seanpoulter

@0nse Is there an easy way to find out which of my extensions may do this? I don't get output colorized, despite having the colorizer installed, for any of these:

image

batjko avatar Jan 17 '18 20:01 batjko

@batjko unfortunately, I don't know of any. Your best bet might be to manually disable extensions in a binary search fashion. Report back, what extension caused your problem (:

0nse avatar Jan 18 '18 19:01 0nse

For anyone experiencing no color with Output Colorizer, its seems like it doesn't work while the Quokka.js extension is enabled. After disabling, got colors to work. @0nse was right about checking extensions.

darrenbutcher avatar Feb 21 '18 21:02 darrenbutcher

This one is no longer blocked as of the Jan 2018 release of VS Code (v1.20). Seems to me like we just need to find or write a grammar for the Jest output.

Here's the release notes about the syntax highlighting.

seanpoulter avatar Feb 28 '18 02:02 seanpoulter

Any updates on this? Looking forward to having colored output out-of-the-box :)

fmaiabatista avatar Jun 25 '19 14:06 fmaiabatista

I haven't seen anything in the VS Code release notes about adding color support to the output panels. Would you be able to try a quick proof of concept @fmaiabatista?

seanpoulter avatar Jun 25 '19 14:06 seanpoulter

Oh, I thought that'd been taken care of after your comment from 27th Feb last year... I'm afraid I can't help because I wouldn't even know where to begin... 🤕

fmaiabatista avatar Jun 25 '19 14:06 fmaiabatista

Ah, right ... I forgot about the syntax highlighting.

Plan A: I was thinking if VS Code (finally) supported colored output in the output panels, then we wouldn't need to use syntax highlighting. We're actually stripping out the colored output that we get from Jest.

To see if the output supports colors, I'd start by:

  • Reviewing the release notes
  • Reviewing the GitHub issues for VS Code

I had a quick look for "output panel color" and found: * https://github.com/microsoft/vscode/issues/571 * https://github.com/microsoft/vscode/issues/72021

The output panel still doesn't support colored output or these issues haven't been closed. 😭 Back to Plan B.

--

Plan B: We're back to using Output Colorizer. I'd start with their docs to see how to write some syntax highlighting.

seanpoulter avatar Jun 25 '19 15:06 seanpoulter

So it would be great if vscode-jest not only retained Jest's built-in console colors, but also I'd really like it if it could also retain my own colored console logs. Sometimes I like to use chalk to make various console output stand out, to help me identify patterns, etc.

jrnail23 avatar May 30 '20 08:05 jrnail23

Me too. I don't want to point fingers, but I think we're still blocked until Code supports coloured output. Would you be willing to review microsoft/vscode#571 and the related tickets to see if anything has changed?

seanpoulter avatar May 30 '20 21:05 seanpoulter