fix: not incrementing in multi progress bars

Author: Thanga-Ganapathy

.changeset/wicked-carrots-scream.md

@@ -0,0 +1,5 @@
+---
+'@opentf/cli-pbar': minor
+---
+
+Fixed not incrementing bars in multi progress bars.

README.md

@@ -95,7 +95,7 @@ multiPBar.stop();
 ```
 
 > [!TIP]
-> It is recommended to use `MEDIUM` sized bars in multi progress bars for better visuals.
+> It is recommended to use the `MEDIUM` sized bars in multi progress bars for better visuals.
 
 ## Examples
 

__tests__/progressBar.spec.js

@@ -41,6 +41,12 @@ async function run(cb, options = {}, isTTY = true) {
   return await outputPromise;
 }
 
+function getBarsStr(n, done = false) {
+  return style(
+    `$${done ? 'g' : 'gr'}.${done ? 'bol' : 'dim'}{${DEFAULT_BAR_CHAR}}`
+  ).repeat(n);
+}
+
 function getBars(complete = 0, percent = 0, opt = {}) {
   const options = {
     width: 30,
@@ -190,4 +196,18 @@ describe('Single Progress Bar', () => {
     const bars = getBars(0, 0, { prefix: 'SUFFIX', suffix: 'SUFFIX' });
     expect(output[0].trim()).toMatch(bars.trim());
   });
+
+  it('renders with no precent & with count', async () => {
+    const output = await run(
+      async (pBar) => {
+        pBar.start({ total: 3 });
+        pBar.inc();
+        pBar.inc();
+        pBar.stop();
+      },
+      { showPercent: false, width: 3, showCount: true }
+    );
+    const outBars = getBarsStr(1, true) + getBarsStr(2) + ' [2/3]';
+    expect(output[2]).toStrictEqual(outBars);
+  });
 });

src/ProgressBar.ts

@@ -106,9 +106,9 @@ class ProgressBar {
   }
 
   /** Starts rendering of the progress bars. */
-  start(obj?: Partial<Bar>) {
-    if (typeof obj === 'object') {
-      this._bars.push({ ...obj, progress: true } as Bar);
+  start(bar?: Partial<Bar>) {
+    if (isObj(bar)) {
+      this._bars.push({ ...bar, progress: true } as Bar);
     }
     this._render();
   }
@@ -132,35 +132,36 @@ class ProgressBar {
   }
 
   /** Update the current progress bar */
-  update(obj: Partial<Bar>, id?: number) {
+  update(bar: Partial<Bar>, id?: number) {
     if (!id) {
-      this._bars[0] = { ...(this._bars[0] as Bar), ...obj } as Bar;
+      this._bars[0] = { ...(this._bars[0] as Bar), ...bar } as Bar;
     } else {
       const index = this._bars.findIndex((b) => isObj(b) && b.id === id);
-      this._bars[index] = { ...(this._bars[index] as Bar), ...obj } as Bar;
+      this._bars[index] = { ...(this._bars[index] as Bar), ...bar } as Bar;
     }
     this._options.stream.moveCursor(0, -(this._bars.length - 1));
     this._render();
   }
 
   /** Adds a new progress bar to the rendering stack. */
-  add(obj: Partial<Bar>) {
-    if (isObj(obj)) {
-      const id = this._bars.length + 1;
-      const barInstance = { progress: true, ...obj, id } as Bar;
-      this._bars.push(barInstance);
-      if (this._bars.length > 2) {
-        this._options.stream.moveCursor(0, -(this._bars.length - 2));
-      }
-      this._render();
-      return {
-        update: (obj: Partial<Bar>) => {
-          this.update(obj, id);
-        },
-      };
+  add(bar: Partial<Bar>) {
+    const id = this._bars.length + 1;
+    const barInstance = { progress: true, ...bar, id } as Bar;
+    this._bars.push(barInstance);
+    if (this._bars.length > 2) {
+      this._options.stream.moveCursor(0, -(this._bars.length - 2));
     }
-
-    return null;
+    this._render();
+    return {
+      update: (bar: Partial<Bar>) => {
+        this.update(bar, id);
+      },
+      inc: (bar?: Partial<Bar>, val = 1) => {
+        const curBar = this._bars.find((b) => b.id === id);
+        const n = curBar?.value || 0;
+        this.update({ ...bar, value: n + val }, id);
+      },
+    };
   }
 
   /** Increment the value + 1, optionally with the provided value. */