fix(core): fix terminal message alignment on errors (#22189)

nrwl · Mar 7, 2024 · 002d2ce · 002d2ce
1 parent c028e5a
commit 002d2ce
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 20 deletions.
diff --git a/packages/nx/src/tasks-runner/life-cycles/dynamic-run-many-terminal-output-life-cycle.ts b/packages/nx/src/tasks-runner/life-cycles/dynamic-run-many-terminal-output-life-cycle.ts
@@ -10,8 +10,9 @@ import { prettyTime } from './pretty-time';
 import { formatFlags, formatTargetsAndProjects } from './formatting-utils';
 import { viewLogsFooterRows } from './view-logs-utils';
 
-const LEFT_PAD = `  `;
-const EXTENDED_LEFT_PAD = `    `;
+const LEFT_PAD = `   `;
+const SPACER = `  `;
+const EXTENDED_LEFT_PAD = `      `;
 
 /**
  * The following function is responsible for creating a life cycle with dynamic
@@ -122,7 +123,7 @@ export async function createRunManyDynamicOutputRenderer({
         writeCompletedTaskResultLine(
           `${
             output.colors.green(figures.tick) +
-            '  ' +
+            SPACER +
             output.formatCommand(task.id)
           }  ${output.dim('[local cache]')}`
         );
@@ -134,7 +135,7 @@ export async function createRunManyDynamicOutputRenderer({
         writeCompletedTaskResultLine(
           `${
             output.colors.green(figures.tick) +
-            '  ' +
+            SPACER +
             output.formatCommand(task.id)
           }  ${output.dim('[existing outputs match the cache, left as is]')}`
         );
@@ -146,7 +147,7 @@ export async function createRunManyDynamicOutputRenderer({
         writeCompletedTaskResultLine(
           `${
             output.colors.green(figures.tick) +
-            '  ' +
+            SPACER +
             output.formatCommand(task.id)
           }  ${output.dim('[remote cache]')}`
         );
@@ -160,7 +161,7 @@ export async function createRunManyDynamicOutputRenderer({
         );
         writeCompletedTaskResultLine(
           output.colors.green(figures.tick) +
-            '  ' +
+            SPACER +
             output.formatCommand(task.id) +
             output.dim(` (${timeTakenText})`)
         );
@@ -170,10 +171,11 @@ export async function createRunManyDynamicOutputRenderer({
         break;
       }
       case 'failure':
+        output.addNewline();
         output.addNewline();
         writeCompletedTaskResultLine(
           output.colors.red(figures.cross) +
-            '  ' +
+            SPACER +
             output.formatCommand(output.colors.red(task.id))
         );
         writeCommandOutputBlock(tasksToTerminalOutputs[task.id]);
@@ -197,7 +199,9 @@ export async function createRunManyDynamicOutputRenderer({
     if (runningTasks.length > 0) {
       additionalFooterRows.push(
         output.dim(
-          `${LEFT_PAD}${output.colors.cyan(figures.arrowRight)}    Executing ${
+          `${LEFT_PAD}${output.colors.cyan(
+            figures.arrowRight
+          )}${SPACER}Executing ${
             runningTasks.length
           }/${remainingTasks} remaining tasks${
             runningTasks.length > 1 ? ' in parallel' : ''
@@ -209,7 +213,7 @@ export async function createRunManyDynamicOutputRenderer({
         additionalFooterRows.push(
           `${LEFT_PAD}${output.dim.cyan(
             dots.frames[currentFrame]
-          )}    ${output.formatCommand(runningTask.task.id)}`
+          )}${SPACER}${output.formatCommand(runningTask.task.id)}`
         );
       }
       /**
@@ -241,7 +245,7 @@ export async function createRunManyDynamicOutputRenderer({
       additionalFooterRows.push(
         `${LEFT_PAD}${output.colors.green(
           figures.tick
-        )}    ${totalSuccessfulTasks}${`/${totalCompletedTasks}`} succeeded ${output.dim(
+        )}${SPACER}${totalSuccessfulTasks}${`/${totalCompletedTasks}`} succeeded ${output.dim(
           `[${totalCachedTasks} read from cache]`
         )}`
       );
@@ -251,7 +255,7 @@ export async function createRunManyDynamicOutputRenderer({
       additionalFooterRows.push(
         `${LEFT_PAD}${output.colors.red(
           figures.cross
-        )}    ${totalFailedTasks}${`/${totalCompletedTasks}`} failed`
+        )}${SPACER}${totalFailedTasks}${`/${totalCompletedTasks}`} failed`
       );
     }
 
@@ -385,14 +389,15 @@ export async function createRunManyDynamicOutputRenderer({
         output.dim(
           `${LEFT_PAD}${output.dim(
             figures.tick
-          )}    ${totalSuccessfulTasks}${`/${totalCompletedTasks}`} succeeded ${output.dim(
+          )}${SPACER}${totalSuccessfulTasks}${`/${totalCompletedTasks}`} succeeded ${output.dim(
             `[${totalCachedTasks} read from cache]`
           )}`
         ),
         '',
         `${LEFT_PAD}${output.colors.red(
           figures.cross
-        )}    ${totalFailedTasks}${`/${totalCompletedTasks}`} targets failed, including the following:`,
+        )}${SPACER}${totalFailedTasks}${`/${totalCompletedTasks}`} targets failed, including the following:`,
+        '',
         `${failedTasksForPrinting
           .map(
             (t) =>

diff --git a/packages/nx/src/tasks-runner/life-cycles/dynamic-run-one-terminal-output-life-cycle.ts b/packages/nx/src/tasks-runner/life-cycles/dynamic-run-one-terminal-output-life-cycle.ts
@@ -9,8 +9,9 @@ import { Task } from '../../config/task-graph';
 import { formatFlags, formatTargetsAndProjects } from './formatting-utils';
 import { viewLogsFooterRows } from './view-logs-utils';
 
-const LEFT_PAD = `  `;
-const EXTENDED_LEFT_PAD = `    `;
+const LEFT_PAD = `   `;
+const SPACER = `  `;
+const EXTENDED_LEFT_PAD = `      `;
 
 /**
  * As tasks are completed the overall state moves from:
@@ -138,7 +139,7 @@ export async function createRunOneDynamicOutputRenderer({
           linesToRender.push(
             `${LEFT_PAD}${output.colors.cyan(
               dots.frames[dependentTargetsCurrentFrame]
-            )}    ${output.dim(
+            )}${SPACER}${output.dim(
               `Nx is waiting on ${remainingDependentTasksNotFromInitiatingProject} dependent project tasks before running tasks from`
             )} ${initiatingProject}${output.dim('...')}`
           );
@@ -154,7 +155,7 @@ export async function createRunOneDynamicOutputRenderer({
         output.colors.red.dim(
           `${LEFT_PAD}${output.colors.red(
             figures.cross
-          )}    ${totalFailedTasks}${`/${totalCompletedTasks}`} dependent project tasks failed (see below)`
+          )}${SPACER}${totalFailedTasks}${`/${totalCompletedTasks}`} dependent project tasks failed (see below)`
         )
       );
     }
@@ -164,7 +165,7 @@ export async function createRunOneDynamicOutputRenderer({
         output.dim(
           `${LEFT_PAD}${output.dim(
             figures.tick
-          )}    ${totalSuccessfulTasks}${`/${totalCompletedTasks}`} dependent project tasks succeeded ${output.dim(
+          )}${SPACER}${totalSuccessfulTasks}${`/${totalCompletedTasks}`} dependent project tasks succeeded ${output.dim(
             `[${totalCachedTasks} read from cache]`
           )}`
         )
@@ -344,10 +345,10 @@ export async function createRunOneDynamicOutputRenderer({
           '',
           `${LEFT_PAD}${output.colors.red(
             figures.cross
-          )}    ${totalFailedTasks}${`/${totalCompletedTasks}`} failed`,
+          )}${SPACER}${totalFailedTasks}${`/${totalCompletedTasks}`} failed`,
           `${LEFT_PAD}${output.dim(
             figures.tick
-          )}    ${totalSuccessfulTasks}${`/${totalCompletedTasks}`} succeeded ${output.dim(
+          )}${SPACER}${totalSuccessfulTasks}${`/${totalCompletedTasks}`} succeeded ${output.dim(
             `[${totalCachedTasks} read from cache]`
           )}`,
           ...viewLogs,