Renders empty states in the Vue app in Job page

1 files changed, 92 insertions, 0 deletions

diff --git a/spec/javascripts/jobs/store/getters_spec.js b/spec/javascripts/jobs/store/getters_spec.js
index 63ef4135d83..160b2f4b34a 100644
--- a/spec/javascripts/jobs/store/getters_spec.js
+++ b/spec/javascripts/jobs/store/getters_spec.js
@@ -99,12 +99,14 @@ describe('Job Store Getters', () => {
         expect(getters.hasEnvironment(localState)).toEqual(false);
       });
     });
+
     describe('with an empty object for `deployment_status`', () => {
       it('returns false', () => {
         localState.job.deployment_status = {};
         expect(getters.hasEnvironment(localState)).toEqual(false);
       });
     });
+
     describe('when `deployment_status` is defined and not empty', () => {
       it('returns true', () => {
         localState.job.deployment_status = {
@@ -118,4 +120,94 @@ describe('Job Store Getters', () => {
       });
     });
   });
+
+  describe('hasTrace', () => {
+    describe('when has_trace is true', () => {
+      it('returns true', () => {
+        localState.job.has_trace = true;
+        localState.job.status = {};
+
+        expect(getters.hasTrace(localState)).toEqual(true);
+      });
+    });
+
+    describe('when job is running', () => {
+      it('returns true', () => {
+        localState.job.has_trace = false;
+        localState.job.status = { group: 'running' };
+
+        expect(getters.hasTrace(localState)).toEqual(true);
+      });
+    });
+
+    describe('when has_trace is false and job is not running', () => {
+      it('returns false', () => {
+        localState.job.has_trace = false;
+        localState.job.status = { group: 'pending' };
+
+        expect(getters.hasTrace(localState)).toEqual(false);
+      });
+    });
+  });
+
+  describe('emptyStateIllustration', () => {
+    describe('with defined illustration', () => {
+      it('returns the state illustration object', () => {
+        localState.job.status = {
+          illustration: {
+            path: 'foo',
+          },
+        };
+
+        expect(getters.emptyStateIllustration(localState)).toEqual({ path: 'foo' });
+      });
+    });
+
+    describe('when illustration is not defined', () => {
+      it('returns an empty object', () => {
+        expect(getters.emptyStateIllustration(localState)).toEqual({});
+      });
+    });
+  });
+
+  describe('isJobStuck', () => {
+    describe('when job is pending and runners are not available', () => {
+      it('returns true', () => {
+        localState.job.status = {
+          group: 'pending',
+        };
+        localState.job.runners = {
+          available: false,
+        };
+
+        expect(getters.isJobStuck(localState)).toEqual(true);
+      });
+    });
+
+    describe('when job is not pending', () => {
+      it('returns false', () => {
+        localState.job.status = {
+          group: 'running',
+        };
+        localState.job.runners = {
+          available: false,
+        };
+
+        expect(getters.isJobStuck(localState)).toEqual(false);
+      });
+    });
+
+    describe('when runners are available', () => {
+      it('returns false', () => {
+        localState.job.status = {
+          group: 'pending',
+        };
+        localState.job.runners = {
+          available: true,
+        };
+
+        expect(getters.isJobStuck(localState)).toEqual(false);
+      });
+    });
+  });
 });