Merge remote-tracking branch 'upstream/master' into 27377-preload-pipeline-entity27377-preload-pipeline-entity

* upstream/master: (2534 commits)
  Update VERSION to 9.3.0-pre
  Update CHANGELOG.md for 9.2.0
  removes unnecessary redundacy in usage ping doc
  Respect the typo as rubocop said
  Add a test to ensure this works on MySQL
  Change pipelines schedules help page path
  change domain to hostname in usage ping doc
  Fixes broken MySQL migration for retried
  Show password field mask while editing service settings
  Add notes for supported schedulers and cloud providers
  Move environment monitoring to environments doc
  Add docs for change of Cache/Artifact restore order"
  Avoid resource intensive login checks if password is not provided
  Change translation for 'coding' by 'desarrollo' for Spanish
  Add to docs: issues multiple assignees
  rename "Add emoji" and "Award emoji" to "Add reaction" where appropriate
  Add project and group notification settings info
  32570 Fix border-bottom for project activity tab
  Add users endpoint to frontend API class
  Rename users on mysql
  ...

1 files changed, 140 insertions, 53 deletions

diff --git a/spec/javascripts/build_spec.js b/spec/javascripts/build_spec.js
index 549c7af8ea8..8ec96bdb583 100644
--- a/spec/javascripts/build_spec.js
+++ b/spec/javascripts/build_spec.js
@@ -1,11 +1,11 @@
 /* eslint-disable no-new */
 /* global Build */
-
-require('~/lib/utils/datetime_utility');
-require('~/lib/utils/url_utility');
-require('~/build');
-require('~/breakpoints');
-require('vendor/jquery.nicescroll');
+import { bytesToKiB } from '~/lib/utils/number_utils';
+import '~/lib/utils/datetime_utility';
+import '~/lib/utils/url_utility';
+import '~/build';
+import '~/breakpoints';
+import 'vendor/jquery.nicescroll';
 
 describe('Build', () => {
   const BUILD_URL = `${gl.TEST_HOST}/frontend-fixtures/builds-project/builds/1`;
@@ -64,54 +64,33 @@ describe('Build', () => {
       });
     });
 
-    describe('initial build trace', () => {
-      beforeEach(() => {
-        new Build();
-      });
-
-      it('displays the initial build trace', () => {
-        expect($.ajax.calls.count()).toBe(1);
-        const [{ url, dataType, success, context }] = $.ajax.calls.argsFor(0);
-        expect(url).toBe(`${BUILD_URL}.json`);
-        expect(dataType).toBe('json');
-        expect(success).toEqual(jasmine.any(Function));
-
-        success.call(context, { trace_html: '<span>Example</span>', status: 'running' });
-
-        expect($('#build-trace .js-build-output').text()).toMatch(/Example/);
-      });
-
-      it('removes the spinner', () => {
-        const [{ success, context }] = $.ajax.calls.argsFor(0);
-        success.call(context, { trace_html: '<span>Example</span>', status: 'success' });
-
-        expect($('.js-build-refresh').length).toBe(0);
-      });
-    });
-
     describe('running build', () => {
       beforeEach(function () {
-        $('.js-build-options').data('buildStatus', 'running');
         this.build = new Build();
-        spyOn(this.build, 'location').and.returnValue(BUILD_URL);
       });
 
       it('updates the build trace on an interval', function () {
+        spyOn(gl.utils, 'visitUrl');
+
         jasmine.clock().tick(4001);
 
-        expect($.ajax.calls.count()).toBe(2);
-        let [{ url, dataType, success, context }] = $.ajax.calls.argsFor(1);
-        expect(url).toBe(
-          `${BUILD_URL}/trace.json?state=`,
-        );
-        expect(dataType).toBe('json');
-        expect(success).toEqual(jasmine.any(Function));
+        expect($.ajax.calls.count()).toBe(1);
+
+        // We have to do it this way to prevent Webpack to fail to compile
+        // when destructuring assignments and reusing
+        // the same variables names inside the same scope
+        let args = $.ajax.calls.argsFor(0)[0];
 
-        success.call(context, {
+        expect(args.url).toBe(`${BUILD_URL}/trace.json`);
+        expect(args.dataType).toBe('json');
+        expect(args.success).toEqual(jasmine.any(Function));
+
+        args.success.call($, {
           html: '<span>Update<span>',
           status: 'running',
           state: 'newstate',
           append: true,
+          complete: false,
         });
 
         expect($('#build-trace .js-build-output').text()).toMatch(/Update/);
@@ -120,16 +99,19 @@ describe('Build', () => {
         jasmine.clock().tick(4001);
 
         expect($.ajax.calls.count()).toBe(3);
-        [{ url, dataType, success, context }] = $.ajax.calls.argsFor(2);
-        expect(url).toBe(`${BUILD_URL}/trace.json?state=newstate`);
-        expect(dataType).toBe('json');
-        expect(success).toEqual(jasmine.any(Function));
 
-        success.call(context, {
+        args = $.ajax.calls.argsFor(2)[0];
+        expect(args.url).toBe(`${BUILD_URL}/trace.json`);
+        expect(args.dataType).toBe('json');
+        expect(args.data.state).toBe('newstate');
+        expect(args.success).toEqual(jasmine.any(Function));
+
+        args.success.call($, {
           html: '<span>More</span>',
           status: 'running',
           state: 'finalstate',
           append: true,
+          complete: true,
         });
 
         expect($('#build-trace .js-build-output').text()).toMatch(/UpdateMore/);
@@ -137,19 +119,22 @@ describe('Build', () => {
       });
 
       it('replaces the entire build trace', () => {
+        spyOn(gl.utils, 'visitUrl');
+
         jasmine.clock().tick(4001);
-        let [{ success, context }] = $.ajax.calls.argsFor(1);
-        success.call(context, {
+        let args = $.ajax.calls.argsFor(0)[0];
+        args.success.call($, {
           html: '<span>Update</span>',
           status: 'running',
-          append: true,
+          append: false,
+          complete: false,
         });
 
         expect($('#build-trace .js-build-output').text()).toMatch(/Update/);
 
         jasmine.clock().tick(4001);
-        [{ success, context }] = $.ajax.calls.argsFor(2);
-        success.call(context, {
+        args = $.ajax.calls.argsFor(2)[0];
+        args.success.call($, {
           html: '<span>Different</span>',
           status: 'running',
           append: false,
@@ -163,15 +148,117 @@ describe('Build', () => {
         spyOn(gl.utils, 'visitUrl');
 
         jasmine.clock().tick(4001);
-        const [{ success, context }] = $.ajax.calls.argsFor(1);
-        success.call(context, {
+        const [{ success }] = $.ajax.calls.argsFor(0);
+        success.call($, {
           html: '<span>Final</span>',
           status: 'passed',
           append: true,
+          complete: true,
         });
 
         expect(gl.utils.visitUrl).toHaveBeenCalledWith(BUILD_URL);
       });
+
+      describe('truncated information', () => {
+        describe('when size is less than total', () => {
+          it('shows information about truncated log', () => {
+            jasmine.clock().tick(4001);
+            const [{ success }] = $.ajax.calls.argsFor(0);
+
+            success.call($, {
+              html: '<span>Update</span>',
+              status: 'success',
+              append: false,
+              size: 50,
+              total: 100,
+            });
+
+            expect(document.querySelector('.js-truncated-info').classList).not.toContain('hidden');
+          });
+
+          it('shows the size in KiB', () => {
+            jasmine.clock().tick(4001);
+            const [{ success }] = $.ajax.calls.argsFor(0);
+            const size = 50;
+
+            success.call($, {
+              html: '<span>Update</span>',
+              status: 'success',
+              append: false,
+              size,
+              total: 100,
+            });
+
+            expect(
+              document.querySelector('.js-truncated-info-size').textContent.trim(),
+            ).toEqual(`${bytesToKiB(size)}`);
+          });
+
+          it('shows incremented size', () => {
+            jasmine.clock().tick(4001);
+            let args = $.ajax.calls.argsFor(0)[0];
+            args.success.call($, {
+              html: '<span>Update</span>',
+              status: 'success',
+              append: false,
+              size: 50,
+              total: 100,
+            });
+
+            expect(
+              document.querySelector('.js-truncated-info-size').textContent.trim(),
+            ).toEqual(`${bytesToKiB(50)}`);
+
+            jasmine.clock().tick(4001);
+            args = $.ajax.calls.argsFor(2)[0];
+            args.success.call($, {
+              html: '<span>Update</span>',
+              status: 'success',
+              append: true,
+              size: 10,
+              total: 100,
+            });
+
+            expect(
+              document.querySelector('.js-truncated-info-size').textContent.trim(),
+            ).toEqual(`${bytesToKiB(60)}`);
+          });
+
+          it('renders the raw link', () => {
+            jasmine.clock().tick(4001);
+            const [{ success }] = $.ajax.calls.argsFor(0);
+
+            success.call($, {
+              html: '<span>Update</span>',
+              status: 'success',
+              append: false,
+              size: 50,
+              total: 100,
+            });
+
+            expect(
+              document.querySelector('.js-raw-link').textContent.trim(),
+            ).toContain('Complete Raw');
+          });
+        });
+
+        describe('when size is equal than total', () => {
+          it('does not show the trunctated information', () => {
+            jasmine.clock().tick(4001);
+            const [{ success }] = $.ajax.calls.argsFor(0);
+
+            success.call($, {
+              html: '<span>Update</span>',
+              status: 'success',
+              append: false,
+              size: 100,
+              total: 100,
+            });
+
+            expect(document.querySelector('.js-truncated-info').classList).toContain('hidden');
+          });
+        });
+      });
     });
   });
 });