Fix cluster installation processing spinner (reopened)

2 files changed, 29 insertions, 77 deletions

diff --git a/spec/javascripts/clusters/clusters_bundle_spec.js b/spec/javascripts/clusters/clusters_bundle_spec.js
index 880b469284b..7928feeadfa 100644
--- a/spec/javascripts/clusters/clusters_bundle_spec.js
+++ b/spec/javascripts/clusters/clusters_bundle_spec.js
@@ -1,10 +1,5 @@
 import Clusters from '~/clusters/clusters_bundle';
-import {
-  REQUEST_LOADING,
-  REQUEST_SUCCESS,
-  REQUEST_FAILURE,
-  APPLICATION_STATUS,
-} from '~/clusters/constants';
+import { REQUEST_SUBMITTED, REQUEST_FAILURE, APPLICATION_STATUS } from '~/clusters/constants';
 import getSetTimeoutPromise from 'spec/helpers/set_timeout_promise_helper';
 
 describe('Clusters', () => {
@@ -196,67 +191,43 @@ describe('Clusters', () => {
   });
 
   describe('installApplication', () => {
-    it('tries to install helm', done => {
+    it('tries to install helm', () => {
       spyOn(cluster.service, 'installApplication').and.returnValue(Promise.resolve());
 
       expect(cluster.store.state.applications.helm.requestStatus).toEqual(null);
 
       cluster.installApplication({ id: 'helm' });
 
-      expect(cluster.store.state.applications.helm.requestStatus).toEqual(REQUEST_LOADING);
+      expect(cluster.store.state.applications.helm.requestStatus).toEqual(REQUEST_SUBMITTED);
       expect(cluster.store.state.applications.helm.requestReason).toEqual(null);
       expect(cluster.service.installApplication).toHaveBeenCalledWith('helm', undefined);
-
-      getSetTimeoutPromise()
-        .then(() => {
-          expect(cluster.store.state.applications.helm.requestStatus).toEqual(REQUEST_SUCCESS);
-          expect(cluster.store.state.applications.helm.requestReason).toEqual(null);
-        })
-        .then(done)
-        .catch(done.fail);
     });
 
-    it('tries to install ingress', done => {
+    it('tries to install ingress', () => {
       spyOn(cluster.service, 'installApplication').and.returnValue(Promise.resolve());
 
       expect(cluster.store.state.applications.ingress.requestStatus).toEqual(null);
 
       cluster.installApplication({ id: 'ingress' });
 
-      expect(cluster.store.state.applications.ingress.requestStatus).toEqual(REQUEST_LOADING);
+      expect(cluster.store.state.applications.ingress.requestStatus).toEqual(REQUEST_SUBMITTED);
       expect(cluster.store.state.applications.ingress.requestReason).toEqual(null);
       expect(cluster.service.installApplication).toHaveBeenCalledWith('ingress', undefined);
-
-      getSetTimeoutPromise()
-        .then(() => {
-          expect(cluster.store.state.applications.ingress.requestStatus).toEqual(REQUEST_SUCCESS);
-          expect(cluster.store.state.applications.ingress.requestReason).toEqual(null);
-        })
-        .then(done)
-        .catch(done.fail);
     });
 
-    it('tries to install runner', done => {
+    it('tries to install runner', () => {
       spyOn(cluster.service, 'installApplication').and.returnValue(Promise.resolve());
 
       expect(cluster.store.state.applications.runner.requestStatus).toEqual(null);
 
       cluster.installApplication({ id: 'runner' });
 
-      expect(cluster.store.state.applications.runner.requestStatus).toEqual(REQUEST_LOADING);
+      expect(cluster.store.state.applications.runner.requestStatus).toEqual(REQUEST_SUBMITTED);
       expect(cluster.store.state.applications.runner.requestReason).toEqual(null);
       expect(cluster.service.installApplication).toHaveBeenCalledWith('runner', undefined);
-
-      getSetTimeoutPromise()
-        .then(() => {
-          expect(cluster.store.state.applications.runner.requestStatus).toEqual(REQUEST_SUCCESS);
-          expect(cluster.store.state.applications.runner.requestReason).toEqual(null);
-        })
-        .then(done)
-        .catch(done.fail);
     });
 
-    it('tries to install jupyter', done => {
+    it('tries to install jupyter', () => {
       spyOn(cluster.service, 'installApplication').and.returnValue(Promise.resolve());
 
       expect(cluster.store.state.applications.jupyter.requestStatus).toEqual(null);
@@ -265,19 +236,11 @@ describe('Clusters', () => {
         params: { hostname: cluster.store.state.applications.jupyter.hostname },
       });
 
-      expect(cluster.store.state.applications.jupyter.requestStatus).toEqual(REQUEST_LOADING);
+      expect(cluster.store.state.applications.jupyter.requestStatus).toEqual(REQUEST_SUBMITTED);
       expect(cluster.store.state.applications.jupyter.requestReason).toEqual(null);
       expect(cluster.service.installApplication).toHaveBeenCalledWith('jupyter', {
         hostname: cluster.store.state.applications.jupyter.hostname,
       });
-
-      getSetTimeoutPromise()
-        .then(() => {
-          expect(cluster.store.state.applications.jupyter.requestStatus).toEqual(REQUEST_SUCCESS);
-          expect(cluster.store.state.applications.jupyter.requestReason).toEqual(null);
-        })
-        .then(done)
-        .catch(done.fail);
     });
 
     it('sets error request status when the request fails', done => {
@@ -289,7 +252,7 @@ describe('Clusters', () => {
 
       cluster.installApplication({ id: 'helm' });
 
-      expect(cluster.store.state.applications.helm.requestStatus).toEqual(REQUEST_LOADING);
+      expect(cluster.store.state.applications.helm.requestStatus).toEqual(REQUEST_SUBMITTED);
       expect(cluster.store.state.applications.helm.requestReason).toEqual(null);
       expect(cluster.service.installApplication).toHaveBeenCalled();
 
diff --git a/spec/javascripts/clusters/components/application_row_spec.js b/spec/javascripts/clusters/components/application_row_spec.js
index 45d56514930..d1f4a1cebb4 100644
--- a/spec/javascripts/clusters/components/application_row_spec.js
+++ b/spec/javascripts/clusters/components/application_row_spec.js
@@ -1,11 +1,6 @@
 import Vue from 'vue';
 import eventHub from '~/clusters/event_hub';
-import {
-  APPLICATION_STATUS,
-  REQUEST_LOADING,
-  REQUEST_SUCCESS,
-  REQUEST_FAILURE,
-} from '~/clusters/constants';
+import { APPLICATION_STATUS, REQUEST_SUBMITTED, REQUEST_FAILURE } from '~/clusters/constants';
 import applicationRow from '~/clusters/components/application_row.vue';
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
 import { DEFAULT_APPLICATION_STATE } from '../services/mock_data';
@@ -57,6 +52,12 @@ describe('Application Row', () => {
       expect(vm.installButtonLabel).toBeUndefined();
     });
 
+    it('has install button', () => {
+      const installationBtn = vm.$el.querySelector('.js-cluster-application-install-button');
+
+      expect(installationBtn).not.toBe(null);
+    });
+
     it('has disabled "Install" when APPLICATION_STATUS.NOT_INSTALLABLE', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
@@ -101,6 +102,18 @@ describe('Application Row', () => {
       expect(vm.installButtonDisabled).toEqual(true);
     });
 
+    it('has loading "Installing" when REQUEST_SUBMITTED', () => {
+      vm = mountComponent(ApplicationRow, {
+        ...DEFAULT_APPLICATION_STATE,
+        status: APPLICATION_STATUS.INSTALLABLE,
+        requestStatus: REQUEST_SUBMITTED,
+      });
+
+      expect(vm.installButtonLabel).toEqual('Installing');
+      expect(vm.installButtonLoading).toEqual(true);
+      expect(vm.installButtonDisabled).toEqual(true);
+    });
+
     it('has disabled "Installed" when APPLICATION_STATUS.INSTALLED', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
@@ -134,30 +147,6 @@ describe('Application Row', () => {
       expect(vm.installButtonDisabled).toEqual(false);
     });
 
-    it('has loading "Install" when REQUEST_LOADING', () => {
-      vm = mountComponent(ApplicationRow, {
-        ...DEFAULT_APPLICATION_STATE,
-        status: APPLICATION_STATUS.INSTALLABLE,
-        requestStatus: REQUEST_LOADING,
-      });
-
-      expect(vm.installButtonLabel).toEqual('Install');
-      expect(vm.installButtonLoading).toEqual(true);
-      expect(vm.installButtonDisabled).toEqual(true);
-    });
-
-    it('has disabled "Install" when REQUEST_SUCCESS', () => {
-      vm = mountComponent(ApplicationRow, {
-        ...DEFAULT_APPLICATION_STATE,
-        status: APPLICATION_STATUS.INSTALLABLE,
-        requestStatus: REQUEST_SUCCESS,
-      });
-
-      expect(vm.installButtonLabel).toEqual('Install');
-      expect(vm.installButtonLoading).toEqual(false);
-      expect(vm.installButtonDisabled).toEqual(true);
-    });
-
     it('has enabled "Install" when REQUEST_FAILURE (so you can try installing again)', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,