Fix(@inquirer/core): Delay showing any loader by 300ms to avoid spinn…

…er flickering. Ref #1407
SBoudrias · Jun 19, 2024 · c7583fc · c7583fc
1 parent 3d15d50
commit c7583fc
Showing 1 changed file with 15 additions and 8 deletions.
diff --git a/packages/core/src/lib/use-prefix.mts b/packages/core/src/lib/use-prefix.mts
@@ -16,16 +16,23 @@ export function usePrefix({
 
   useEffect((): void | (() => unknown) => {
     if (isLoading) {
+      let tickInterval: NodeJS.Timeout | undefined;
       let inc = -1;
-      const interval = setInterval(
-        AsyncResource.bind(() => {
-          inc = inc + 1;
-          setTick(inc % spinner.frames.length);
-        }),
-        spinner.interval,
-      );
+      // Delay displaying spinner by 300ms, to avoid flickering
+      const delayTimeout = setTimeout(() => {
+        tickInterval = setInterval(
+          AsyncResource.bind(() => {
+            inc = inc + 1;
+            setTick(inc % spinner.frames.length);
+          }),
+          spinner.interval,
+        );
+      }, 300);
 
-      return () => clearInterval(interval);
+      return () => {
+        clearTimeout(delayTimeout);
+        clearInterval(tickInterval);
+      };
     }
   }, [isLoading]);