1 files changed, 92 insertions, 17 deletions

diff --git a/spec/frontend/jira_connect/components/groups_list_item_spec.js b/spec/frontend/jira_connect/components/groups_list_item_spec.js
index 77577c53cf4..bb247534aca 100644
--- a/spec/frontend/jira_connect/components/groups_list_item_spec.js
+++ b/spec/frontend/jira_connect/components/groups_list_item_spec.js
@@ -1,27 +1,37 @@
-import { shallowMount } from '@vue/test-utils';
-import { GlAvatar } from '@gitlab/ui';
+import { GlAvatar, GlButton } from '@gitlab/ui';
+import { mount, shallowMount } from '@vue/test-utils';
 import { extendedWrapper } from 'helpers/vue_test_utils_helper';
-import { mockGroup1 } from '../mock_data';
+import waitForPromises from 'helpers/wait_for_promises';
 
+import * as JiraConnectApi from '~/jira_connect/api';
 import GroupsListItem from '~/jira_connect/components/groups_list_item.vue';
+import { mockGroup1 } from '../mock_data';
 
 describe('GroupsListItem', () => {
   let wrapper;
+  const mockSubscriptionPath = 'subscriptionPath';
 
-  const createComponent = () => {
+  const reloadSpy = jest.fn();
+
+  global.AP = {
+    navigator: {
+      reload: reloadSpy,
+    },
+  };
+
+  const createComponent = ({ mountFn = shallowMount } = {}) => {
     wrapper = extendedWrapper(
-      shallowMount(GroupsListItem, {
+      mountFn(GroupsListItem, {
         propsData: {
           group: mockGroup1,
         },
+        provide: {
+          subscriptionsPath: mockSubscriptionPath,
+        },
       }),
     );
   };
 
-  beforeEach(() => {
-    createComponent();
-  });
-
   afterEach(() => {
     wrapper.destroy();
     wrapper = null;
@@ -30,17 +40,82 @@ describe('GroupsListItem', () => {
   const findGlAvatar = () => wrapper.find(GlAvatar);
   const findGroupName = () => wrapper.findByTestId('group-list-item-name');
   const findGroupDescription = () => wrapper.findByTestId('group-list-item-description');
+  const findLinkButton = () => wrapper.find(GlButton);
+  const clickLinkButton = () => findLinkButton().trigger('click');
 
-  it('renders group avatar', () => {
-    expect(findGlAvatar().exists()).toBe(true);
-    expect(findGlAvatar().props('src')).toBe(mockGroup1.avatar_url);
-  });
+  describe('template', () => {
+    beforeEach(() => {
+      createComponent();
+    });
+
+    it('renders group avatar', () => {
+      expect(findGlAvatar().exists()).toBe(true);
+      expect(findGlAvatar().props('src')).toBe(mockGroup1.avatar_url);
+    });
+
+    it('renders group name', () => {
+      expect(findGroupName().text()).toBe(mockGroup1.full_name);
+    });
 
-  it('renders group name', () => {
-    expect(findGroupName().text()).toBe(mockGroup1.full_name);
+    it('renders group description', () => {
+      expect(findGroupDescription().text()).toBe(mockGroup1.description);
+    });
+
+    it('renders Link button', () => {
+      expect(findLinkButton().exists()).toBe(true);
+      expect(findLinkButton().text()).toBe('Link');
+    });
   });
 
-  it('renders group description', () => {
-    expect(findGroupDescription().text()).toBe(mockGroup1.description);
+  describe('on Link button click', () => {
+    let addSubscriptionSpy;
+
+    beforeEach(() => {
+      createComponent({ mountFn: mount });
+
+      addSubscriptionSpy = jest.spyOn(JiraConnectApi, 'addSubscription').mockResolvedValue();
+    });
+
+    it('sets button to loading and sends request', async () => {
+      expect(findLinkButton().props('loading')).toBe(false);
+
+      clickLinkButton();
+
+      await wrapper.vm.$nextTick();
+
+      expect(findLinkButton().props('loading')).toBe(true);
+
+      expect(addSubscriptionSpy).toHaveBeenCalledWith(mockSubscriptionPath, mockGroup1.full_path);
+    });
+
+    describe('when request is successful', () => {
+      it('reloads the page', async () => {
+        clickLinkButton();
+
+        await waitForPromises();
+
+        expect(reloadSpy).toHaveBeenCalled();
+      });
+    });
+
+    describe('when request has errors', () => {
+      const mockErrorMessage = 'error message';
+      const mockError = { response: { data: { error: mockErrorMessage } } };
+
+      beforeEach(() => {
+        addSubscriptionSpy = jest
+          .spyOn(JiraConnectApi, 'addSubscription')
+          .mockRejectedValue(mockError);
+      });
+
+      it('emits `error` event', async () => {
+        clickLinkButton();
+
+        await waitForPromises();
+
+        expect(reloadSpy).not.toHaveBeenCalled();
+        expect(wrapper.emitted('error')[0][0]).toBe(mockErrorMessage);
+      });
+    });
   });
 });