1 files changed, 46 insertions, 9 deletions

diff --git a/spec/frontend/runner/group_runners/group_runners_app_spec.js b/spec/frontend/runner/group_runners/group_runners_app_spec.js
index 57d64202219..a17502c7eec 100644
--- a/spec/frontend/runner/group_runners/group_runners_app_spec.js
+++ b/spec/frontend/runner/group_runners/group_runners_app_spec.js
@@ -15,6 +15,7 @@ import { getIdFromGraphQLId } from '~/graphql_shared/utils';
 import { updateHistory } from '~/lib/utils/url_utility';
 import { upgradeStatusTokenConfig } from 'ee_else_ce/runner/components/search_tokens/upgrade_status_token_config';
 
+import RunnerStackedLayoutBanner from '~/runner/components/runner_stacked_layout_banner.vue';
 import RunnerTypeTabs from '~/runner/components/runner_type_tabs.vue';
 import RunnerFilteredSearchBar from '~/runner/components/runner_filtered_search_bar.vue';
 import RunnerList from '~/runner/components/runner_list.vue';
@@ -28,6 +29,9 @@ import {
   CREATED_ASC,
   CREATED_DESC,
   DEFAULT_SORT,
+  I18N_STATUS_ONLINE,
+  I18N_STATUS_OFFLINE,
+  I18N_STATUS_STALE,
   INSTANCE_TYPE,
   GROUP_TYPE,
   PARAM_KEY_PAUSED,
@@ -74,6 +78,7 @@ jest.mock('~/lib/utils/url_utility', () => ({
 describe('GroupRunnersApp', () => {
   let wrapper;
 
+  const findRunnerStackedLayoutBanner = () => wrapper.findComponent(RunnerStackedLayoutBanner);
   const findRunnerStats = () => wrapper.findComponent(RunnerStats);
   const findRunnerActionsCell = () => wrapper.findComponent(RunnerActionsCell);
   const findRegistrationDropdown = () => wrapper.findComponent(RegistrationDropdown);
@@ -122,6 +127,11 @@ describe('GroupRunnersApp', () => {
     wrapper.destroy();
   });
 
+  it('shows the feedback banner', () => {
+    createComponent();
+    expect(findRunnerStackedLayoutBanner().exists()).toBe(true);
+  });
+
   it('shows the runner tabs with a runner count for each type', async () => {
     await createComponent({ mountFn: mountExtended });
 
@@ -153,15 +163,10 @@ describe('GroupRunnersApp', () => {
       groupFullPath: mockGroupFullPath,
     });
 
-    expect(findRunnerStats().text()).toContain(
-      `${s__('Runners|Online runners')} ${mockGroupRunnersCount}`,
-    );
-    expect(findRunnerStats().text()).toContain(
-      `${s__('Runners|Offline runners')} ${mockGroupRunnersCount}`,
-    );
-    expect(findRunnerStats().text()).toContain(
-      `${s__('Runners|Stale runners')} ${mockGroupRunnersCount}`,
-    );
+    const text = findRunnerStats().text();
+    expect(text).toContain(`${I18N_STATUS_ONLINE} ${mockGroupRunnersCount}`);
+    expect(text).toContain(`${I18N_STATUS_OFFLINE} ${mockGroupRunnersCount}`);
+    expect(text).toContain(`${I18N_STATUS_STALE} ${mockGroupRunnersCount}`);
   });
 
   it('shows the runners list', async () => {
@@ -396,4 +401,36 @@ describe('GroupRunnersApp', () => {
       });
     });
   });
+
+  describe('when user has permission to register group runner', () => {
+    beforeEach(() => {
+      createComponent({
+        propsData: {
+          registrationToken: mockRegistrationToken,
+          groupFullPath: mockGroupFullPath,
+          groupRunnersLimitedCount: mockGroupRunnersCount,
+        },
+      });
+    });
+
+    it('shows the register group runner button', () => {
+      expect(findRegistrationDropdown().exists()).toBe(true);
+    });
+  });
+
+  describe('when user has no permission to register group runner', () => {
+    beforeEach(() => {
+      createComponent({
+        propsData: {
+          registrationToken: null,
+          groupFullPath: mockGroupFullPath,
+          groupRunnersLimitedCount: mockGroupRunnersCount,
+        },
+      });
+    });
+
+    it('does not show the register group runner button', () => {
+      expect(findRegistrationDropdown().exists()).toBe(false);
+    });
+  });
 });