1 files changed, 10 insertions, 14 deletions
diff --git a/spec/frontend/vue_shared/components/runner_instructions/runner_instructions_spec.js b/spec/frontend/vue_shared/components/runner_instructions/runner_instructions_spec.js
index 9a95a838291..986d76d2b95 100644
--- a/spec/frontend/vue_shared/components/runner_instructions/runner_instructions_spec.js
+++ b/spec/frontend/vue_shared/components/runner_instructions/runner_instructions_spec.js
@@ -1,6 +1,5 @@
-import { shallowMount } from '@vue/test-utils';
-import { nextTick } from 'vue';
-import { extendedWrapper } from 'helpers/vue_test_utils_helper';
+import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
+import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import RunnerInstructions from '~/vue_shared/components/runner_instructions/runner_instructions.vue';
 import RunnerInstructionsModal from '~/vue_shared/components/runner_instructions/runner_instructions_modal.vue';
 
@@ -11,7 +10,11 @@ describe('RunnerInstructions component', () => {
   const findModal = () => wrapper.findComponent(RunnerInstructionsModal);
 
   const createComponent = () => {
-    wrapper = extendedWrapper(shallowMount(RunnerInstructions));
+    wrapper = shallowMountExtended(RunnerInstructions, {
+      directives: {
+        GlModal: createMockDirective(),
+      },
+    });
   };
 
   beforeEach(() => {
@@ -23,19 +26,12 @@ describe('RunnerInstructions component', () => {
   });
 
   it('should show the "Show runner installation instructions" button', () => {
-    expect(findModalButton().exists()).toBe(true);
     expect(findModalButton().text()).toBe('Show runner installation instructions');
   });
 
-  it('should not render the modal once mounted', () => {
-    expect(findModal().exists()).toBe(false);
-  });
-
-  it('should render the modal once clicked', async () => {
-    findModalButton().vm.$emit('click');
-
-    await nextTick();
+  it('should render the modal', () => {
+    const modalId = getBinding(findModal().element, 'gl-modal');
 
-    expect(findModal().exists()).toBe(true);
+    expect(findModalButton().attributes('modal-id')).toBe(modalId);
   });
 });