Angular CLI can't tell when stdout isn't a TTY, always outputs ANSI

[ocket8888]

🐞 Bug report

Command (mark with an x)

• new
• build
• serve
• test
• e2e
• generate
• add
• update
• lint
• xi18n
• run
• config
• help
• version
• doc

Is this a regression?

No

Description

The Angular CLI always outputs ANSI control codes to colorize output, regardless of whether or not the process's STDOUT is a TTY, and offers no option to forcibly override that behavior. This makes the output difficult/impossible (depending on the command) to parse without passing it through a filter to first strip out all of the ANSI characters.

I'm opening this as a bug - not a feature request - because #6478 has been closed without a "wontfix" label, indicating the intended behavior is that this problem has been solved.

🔬 Minimal Reproduction

Run any command in any environment with any passed option-arguments or "flags", observe colorized output.

🔥 Exception or Error

Here's some sample output when an ng build results in an error - thus producing a lot of colorized output:

chunk {main} main.js, main.js.map (main) 628 bytes [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 122 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 11 kB [initial] [rendered]
Date: 2020-02-22T20:31:55.400Z - Hash: f4ca5d6cd60b894262e5 - Time: 5043ms

ERROR in �[96msrc/app/app.component.ts�[0m:�[93m28�[0m:�[93m50�[0m - �[91merror�[0m�[90m TS2339: �[0mProperty 'entities' does not exist on type 'EntitiesService'.

�[7m28�[0m  	const id = `${Object.keys(this.entitiesService.entities).length}-${(new Date()).getTime()}`;
�[7m  �[0m �[91m 	                                               ~~~~~~~~�[0m
�[96msrc/app/app.component.ts�[0m:�[93m29�[0m:�[93m24�[0m - �[91merror�[0m�[90m TS2339: �[0mProperty 'entities' does not exist on type 'EntitiesService'.

🌍 Your Environment

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 8.3.23
Node: 13.7.0
OS: linux x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... platform-server, router

Package                                    Version
--------------------------------------------------------------------
@angular-devkit/architect                  0.803.23
@angular-devkit/build-angular              0.803.23
@angular-devkit/build-optimizer            0.803.23
@angular-devkit/build-webpack              0.803.23
@angular-devkit/core                       8.3.23
@angular-devkit/schematics                 8.3.23
@angular/cli                               8.3.23
@ngtools/webpack                           8.3.23
@nguniversal/express-engine                8.2.6
@nguniversal/module-map-ngfactory-loader   8.2.6
@schematics/angular                        8.3.23
@schematics/update                         0.803.23
rxjs                                       6.5.4
typescript                                 3.5.3
webpack                                    4.39.2

I can't imagine why this would matter, but find enclosed my system information

██████████████████  ████████     bwilli415@manjaro

██████████████████  ████████     OS: Manjaro 18.1.5 Juhraya

██████████████████  ████████     Kernel: x86_64 Linux 5.3.18-1-MANJARO

██████████████████  ████████     Uptime: 21d 20h 9m

████████            ████████     Packages: 1440

████████  ████████  ████████     Shell: zsh 5.7.1

████████  ████████  ████████     Resolution: 1920x1080

████████  ████████  ████████     DE: GNOME 3.34.2

████████  ████████  ████████     WM: Mutter

████████  ████████  ████████     WM Theme: Matcha-sea

████████  ████████  ████████     GTK Theme: Matcha-dark-sea [GTK2/3]

████████  ████████  ████████     Icon Theme: Papirus-Dark-Maia

████████  ████████  ████████     Font: Noto Sans 11

████████  ████████  ████████     Disk: 211G / 399G (56%)

CPU: Intel Core i7-7600U @ 4x 3.9GHz [53.0°C]

GPU: Mesa DRI Intel(R) HD Graphics 620 (Kaby Lake GT2)

RAM: 5669MiB / 15893MiB

Anything else relevant?
I have some recommendations on how to solve this.

I'd recommend the widely used --color/--no-color mutually exclusive option-arguments be added to the base ng command, so that it'd be immediately supported by all sub-commands and making it trivial to set alias ng="ng --color" or alias ng="ng --no-color" in environments where that's desirable.

I'd also suggest that support be added for the NO_COLOR environment variable which has found some wide adoption in recent years.

Finally, the default behavior when no overriding option-arguments or execution environment variables should be to display colors if and only if it can be determined that STDOUT refers to a TTY.

[clydin]

The Angular CLI itself does perform checks to ensure that stdout is a terminal and that it supports the use of color. It defers to Node.js for these checks. The logic for Node.js 13 can be found here and supports the NO_COLOR environment variable.

The issue here, however, is with some Angular CLI package dependencies writing color codes to log messages combined with a recent update to a dependency that rendered the color removal code in these cases void. The referenced PR corrects the color removal issue.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}