1 files changed, 32 insertions, 7 deletions

diff --git a/spec/frontend/runner/components/cells/runner_summary_cell_spec.js b/spec/frontend/runner/components/cells/runner_summary_cell_spec.js
index 1c9282e0acd..b6d957d27ea 100644
--- a/spec/frontend/runner/components/cells/runner_summary_cell_spec.js
+++ b/spec/frontend/runner/components/cells/runner_summary_cell_spec.js
@@ -1,5 +1,6 @@
-import { mount } from '@vue/test-utils';
+import { mountExtended } from 'helpers/vue_test_utils_helper';
 import RunnerSummaryCell from '~/runner/components/cells/runner_summary_cell.vue';
+import { INSTANCE_TYPE, PROJECT_TYPE } from '~/runner/constants';
 
 const mockId = '1';
 const mockShortSha = '2P6oDVDm';
@@ -8,13 +9,17 @@ const mockDescription = 'runner-1';
 describe('RunnerTypeCell', () => {
   let wrapper;
 
-  const createComponent = (options) => {
-    wrapper = mount(RunnerSummaryCell, {
+  const findLockIcon = () => wrapper.findByTestId('lock-icon');
+
+  const createComponent = (runner, options) => {
+    wrapper = mountExtended(RunnerSummaryCell, {
       propsData: {
         runner: {
           id: `gid://gitlab/Ci::Runner/${mockId}`,
           shortSha: mockShortSha,
           description: mockDescription,
+          runnerType: INSTANCE_TYPE,
+          ...runner,
         },
       },
       ...options,
@@ -33,6 +38,23 @@ describe('RunnerTypeCell', () => {
     expect(wrapper.text()).toContain(`#${mockId} (${mockShortSha})`);
   });
 
+  it('Displays the runner type', () => {
+    expect(wrapper.text()).toContain('shared');
+  });
+
+  it('Does not display the locked icon', () => {
+    expect(findLockIcon().exists()).toBe(false);
+  });
+
+  it('Displays the locked icon for locked runners', () => {
+    createComponent({
+      runnerType: PROJECT_TYPE,
+      locked: true,
+    });
+
+    expect(findLockIcon().exists()).toBe(true);
+  });
+
   it('Displays the runner description', () => {
     expect(wrapper.text()).toContain(mockDescription);
   });
@@ -40,11 +62,14 @@ describe('RunnerTypeCell', () => {
   it('Displays a custom slot', () => {
     const slotContent = 'My custom runner summary';
 
-    createComponent({
-      slots: {
-        'runner-name': slotContent,
+    createComponent(
+      {},
+      {
+        slots: {
+          'runner-name': slotContent,
+        },
       },
-    });
+    );
 
     expect(wrapper.text()).toContain(slotContent);
   });