Merge pull request #5311 from christophe-g:cg-remove-unecessary-progress-animation

PiperOrigin-RevId: 594013260

Author: copybara-github

progress/internal/_linear-progress.scss

@@ -114,6 +114,12 @@ $_indeterminate-duration: 2s;
     z-index: -1; // Place behind tracks for Safari
   }
 
+  // dots are hidden when indeterminate or when there is no visible buffer to
+  // prevent infinite invisible animation.
+  .dots[hidden] {
+    display: none;
+  }
+
   // indeterminate
   .indeterminate .bar {
     transition: none;
@@ -131,10 +137,6 @@ $_indeterminate-duration: 2s;
     display: block;
   }
 
-  .indeterminate .dots {
-    display: none;
-  }
-
   .indeterminate .primary-bar {
     animation: linear infinite $_indeterminate-duration;
     animation-name: primary-indeterminate-translate;

progress/internal/linear-progress.ts

@@ -34,8 +34,12 @@ export class LinearProgress extends Progress {
       }%)`,
     };
 
+    // Only display dots when visible - this prevents invisible infinite
+    // animation.
+    const hideDots =
+      this.indeterminate || this.buffer >= this.max || this.value >= this.max;
     return html`
-      <div class="dots"></div>
+      <div class="dots" ?hidden=${hideDots}></div>
       <div class="inactive-track" style=${styleMap(dotStyles)}></div>
       <div class="bar primary-bar" style=${styleMap(progressStyles)}>
         <div class="bar-inner"></div>