1 files changed, 95 insertions, 28 deletions
diff --git a/spec/javascripts/releases/components/app_index_spec.js b/spec/javascripts/releases/components/app_index_spec.js
index 83b0652d59b..020937d07e5 100644
--- a/spec/javascripts/releases/components/app_index_spec.js
+++ b/spec/javascripts/releases/components/app_index_spec.js
@@ -13,6 +13,7 @@ import {
   releases,
 } from '../mock_data';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
+import waitForPromises from 'spec/helpers/wait_for_promises';
 
 describe('Releases App ', () => {
   const Component = Vue.extend(app);
@@ -22,7 +23,7 @@ describe('Releases App ', () => {
 
   const props = {
     projectId: 'gitlab-ce',
-    documentationLink: 'help/releases',
+    documentationPath: 'help/releases',
     illustrationPath: 'illustration/path',
   };
 
@@ -51,9 +52,9 @@ describe('Releases App ', () => {
       expect(vm.$el.querySelector('.js-success-state')).toBeNull();
       expect(vm.$el.querySelector('.gl-pagination')).toBeNull();
 
-      setTimeout(() => {
-        done();
-      }, 0);
+      waitForPromises()
+        .then(done)
+        .catch(done.fail);
     });
   });
 
@@ -66,14 +67,16 @@ describe('Releases App ', () => {
     });
 
     it('renders success state', done => {
-      setTimeout(() => {
-        expect(vm.$el.querySelector('.js-loading')).toBeNull();
-        expect(vm.$el.querySelector('.js-empty-state')).toBeNull();
-        expect(vm.$el.querySelector('.js-success-state')).not.toBeNull();
-        expect(vm.$el.querySelector('.gl-pagination')).toBeNull();
-
-        done();
-      }, 0);
+      waitForPromises()
+        .then(() => {
+          expect(vm.$el.querySelector('.js-loading')).toBeNull();
+          expect(vm.$el.querySelector('.js-empty-state')).toBeNull();
+          expect(vm.$el.querySelector('.js-success-state')).not.toBeNull();
+          expect(vm.$el.querySelector('.gl-pagination')).toBeNull();
+
+          done();
+        })
+        .catch(done.fail);
     });
   });
 
@@ -86,14 +89,16 @@ describe('Releases App ', () => {
     });
 
     it('renders success state', done => {
-      setTimeout(() => {
-        expect(vm.$el.querySelector('.js-loading')).toBeNull();
-        expect(vm.$el.querySelector('.js-empty-state')).toBeNull();
-        expect(vm.$el.querySelector('.js-success-state')).not.toBeNull();
-        expect(vm.$el.querySelector('.gl-pagination')).not.toBeNull();
-
-        done();
-      }, 0);
+      waitForPromises()
+        .then(() => {
+          expect(vm.$el.querySelector('.js-loading')).toBeNull();
+          expect(vm.$el.querySelector('.js-empty-state')).toBeNull();
+          expect(vm.$el.querySelector('.js-success-state')).not.toBeNull();
+          expect(vm.$el.querySelector('.gl-pagination')).not.toBeNull();
+
+          done();
+        })
+        .catch(done.fail);
     });
   });
 
@@ -104,14 +109,76 @@ describe('Releases App ', () => {
     });
 
     it('renders empty state', done => {
-      setTimeout(() => {
-        expect(vm.$el.querySelector('.js-loading')).toBeNull();
-        expect(vm.$el.querySelector('.js-empty-state')).not.toBeNull();
-        expect(vm.$el.querySelector('.js-success-state')).toBeNull();
-        expect(vm.$el.querySelector('.gl-pagination')).toBeNull();
-
-        done();
-      }, 0);
+      waitForPromises()
+        .then(() => {
+          expect(vm.$el.querySelector('.js-loading')).toBeNull();
+          expect(vm.$el.querySelector('.js-empty-state')).not.toBeNull();
+          expect(vm.$el.querySelector('.js-success-state')).toBeNull();
+          expect(vm.$el.querySelector('.gl-pagination')).toBeNull();
+
+          done();
+        })
+        .catch(done.fail);
+    });
+  });
+
+  describe('"New release" button', () => {
+    const findNewReleaseButton = () => vm.$el.querySelector('.js-new-release-btn');
+
+    beforeEach(() => {
+      spyOn(api, 'releases').and.returnValue(Promise.resolve({ data: [], headers: {} }));
+    });
+
+    const factory = additionalProps => {
+      vm = mountComponentWithStore(Component, {
+        props: {
+          ...props,
+          ...additionalProps,
+        },
+        store,
+      });
+    };
+
+    describe('when the user is allowed to create a new Release', () => {
+      const newReleasePath = 'path/to/new/release';
+
+      beforeEach(() => {
+        factory({ newReleasePath });
+      });
+
+      it('renders the "New release" button', done => {
+        waitForPromises()
+          .then(() => {
+            expect(findNewReleaseButton()).not.toBeNull();
+
+            done();
+          })
+          .catch(done.fail);
+      });
+
+      it('renders the "New release" button with the correct href', done => {
+        waitForPromises()
+          .then(() => {
+            expect(findNewReleaseButton().getAttribute('href')).toBe(newReleasePath);
+
+            done();
+          })
+          .catch(done.fail);
+      });
+    });
+
+    describe('when the user is not allowed to create a new Release', () => {
+      beforeEach(() => factory());
+
+      it('does not render the "New release" button', done => {
+        waitForPromises()
+          .then(() => {
+            expect(findNewReleaseButton()).toBeNull();
+
+            done();
+          })
+          .catch(done.fail);
+      });
     });
   });
 });