Merge branch 'master' into vue-pipelinesvue-pipelines

* master: (23 commits)
  Fix container registry navigation menu highlights
  Resolve "Mini pipeline graph + status badge, when updating in real time don't change color and svg icon"
  Refactor group search out of global search
  disables test settings on chat notification services when repository is empty
  Disable initialization table pipeline for new merge request form
  Improves support for long build traces:
  Review changes, used eq instead of match
  Remove lighten blue and add blue-25 for background
  Fixed tests
  29595 Customize experience callout design
  Remove unneeded format block
  Fixed tests
  29595 Customize experience callout design
  Remove issue boards from recent searches
  Updated specs
  Remove helper
  [ci skip] Use favicon full path
  Update phrasing via @jschatz1 comments
  Change heading
  Update index.md
  ...

1 files changed, 17 insertions, 7 deletions

diff --git a/app/assets/javascripts/build.js b/app/assets/javascripts/build.js
index 0aad95c2fe3..97f279e4be4 100644
--- a/app/assets/javascripts/build.js
+++ b/app/assets/javascripts/build.js
@@ -2,6 +2,8 @@
 consistent-return, prefer-rest-params */
 /* global Breakpoints */
 
+import { bytesToKiB } from './lib/utils/number_utils';
+
 const bind = function (fn, me) { return function () { return fn.apply(me, arguments); }; };
 const AUTO_SCROLL_OFFSET = 75;
 const DOWN_BUILD_TRACE = '#down-build-trace';
@@ -20,6 +22,7 @@ window.Build = (function () {
     this.state = this.options.logState;
     this.buildStage = this.options.buildStage;
     this.$document = $(document);
+    this.logBytes = 0;
 
     this.updateDropdown = bind(this.updateDropdown, this);
 
@@ -98,15 +101,22 @@ window.Build = (function () {
 
         if (log.append) {
           $buildContainer.append(log.html);
+          this.logBytes += log.size;
         } else {
           $buildContainer.html(log.html);
-          if (log.truncated) {
-            $('.js-truncated-info-size').html(` ${log.size} `);
-            this.$truncatedInfo.removeClass('hidden');
-            this.initAffixTruncatedInfo();
-          } else {
-            this.$truncatedInfo.addClass('hidden');
-          }
+          this.logBytes = log.size;
+        }
+
+        // if the incremental sum of logBytes we received is less than the total
+        // we need to show a message warning the user about that.
+        if (this.logBytes < log.total) {
+          // size is in bytes, we need to calculate KiB
+          const size = bytesToKiB(this.logBytes);
+          $('.js-truncated-info-size').html(`${size}`);
+          this.$truncatedInfo.removeClass('hidden');
+          this.initAffixTruncatedInfo();
+        } else {
+          this.$truncatedInfo.addClass('hidden');
         }
 
         this.checkAutoscroll();