From 1b31bc05d84c823bac0de461de061a1e1b434dbb Mon Sep 17 00:00:00 2001
From: Alan Agius <alan.agius4@gmail.com>
Date: Thu, 3 Jun 2021 13:18:57 +0200
Subject: [PATCH] fix(@angular-devkit/build-angular): show progress during
 re-builds

With the recent changes in https://github.com/angular/angular-cli/pull/20960 we moved the spinner to be started outside of the progress callback, this causes a side-effect that after `succeed` is called the spinner will stop reporting progress unless it is started again.
---
 .../build_angular/src/utils/spinner.ts        |  7 +++++
 .../src/webpack/configs/common.ts             | 29 ++++++++-----------
 2 files changed, 19 insertions(+), 17 deletions(-)

diff --git a/packages/angular_devkit/build_angular/src/utils/spinner.ts b/packages/angular_devkit/build_angular/src/utils/spinner.ts
index b4b0ded050ed..93fb042dcbb7 100644
--- a/packages/angular_devkit/build_angular/src/utils/spinner.ts
+++ b/packages/angular_devkit/build_angular/src/utils/spinner.ts
@@ -8,12 +8,14 @@
 
 import * as ora from 'ora';
 import { colors } from './color';
+import { isTTY } from './tty';
 
 export class Spinner {
   private readonly spinner: ora.Ora;
 
   /** When false, only fail messages will be displayed. */
   enabled = true;
+  readonly #isTTY = isTTY();
 
   constructor(text?: string) {
     this.spinner = ora({
@@ -22,6 +24,7 @@ export class Spinner {
       // when the underlying process is sync.
       hideCursor: false,
       discardStdin: false,
+      isEnabled: this.#isTTY,
     });
   }
 
@@ -29,6 +32,10 @@ export class Spinner {
     this.spinner.text = text;
   }
 
+  get isSpinning(): boolean {
+    return this.spinner.isSpinning || !this.#isTTY;
+  }
+
   succeed(text?: string): void {
     if (this.enabled) {
       this.spinner.succeed(text);
diff --git a/packages/angular_devkit/build_angular/src/webpack/configs/common.ts b/packages/angular_devkit/build_angular/src/webpack/configs/common.ts
index 8ca100ce3722..72b26ef06ac8 100644
--- a/packages/angular_devkit/build_angular/src/webpack/configs/common.ts
+++ b/packages/angular_devkit/build_angular/src/webpack/configs/common.ts
@@ -72,33 +72,28 @@ export function getCommonConfig(wco: WebpackConfigOptions): Configuration {
     const spinner = new Spinner();
     spinner.start(`Generating ${platform} application bundles (phase: setup)...`);
 
-    let previousPercentage: number | undefined;
     extraPlugins.push(
       new ProgressPlugin({
         handler: (percentage: number, message: string) => {
-          if (previousPercentage === 1 && percentage !== 0) {
-            // In some scenarios in Webpack 5 percentage goes from 1 back to 0.99.
-            // Ex: 0.99 -> 1 -> 0.99 -> 1
-            // This causes the "complete" message to be displayed multiple times.
-
-            return;
-          }
+          const phase = message ? ` (phase: ${message})` : '';
+          spinner.text = `Generating ${platform} application bundles${phase}...`;
 
           switch (percentage) {
             case 1:
-              spinner.succeed(
-                `${platform.replace(/^\w/, (s) =>
-                  s.toUpperCase(),
-                )} application bundle generation complete.`,
-              );
+              if (spinner.isSpinning) {
+                spinner.succeed(
+                  `${platform.replace(/^\w/, (s) =>
+                    s.toUpperCase(),
+                  )} application bundle generation complete.`,
+                );
+              }
               break;
             case 0:
-            default:
-              spinner.text = `Generating ${platform} application bundles (phase: ${message})...`;
+              if (!spinner.isSpinning) {
+                spinner.start();
+              }
               break;
           }
-
-          previousPercentage = percentage;
         },
       }),
     );