1 files changed, 11 insertions, 9 deletions
diff --git a/spec/frontend/vue_merge_request_widget/components/states/mr_widget_not_allowed_spec.js b/spec/frontend/vue_merge_request_widget/components/states/mr_widget_not_allowed_spec.js
index 63e93074857..c6e7198c678 100644
--- a/spec/frontend/vue_merge_request_widget/components/states/mr_widget_not_allowed_spec.js
+++ b/spec/frontend/vue_merge_request_widget/components/states/mr_widget_not_allowed_spec.js
@@ -1,25 +1,27 @@
-import Vue from 'vue';
-import mountComponent from 'helpers/vue_mount_component_helper';
+import { shallowMount } from '@vue/test-utils';
 import notAllowedComponent from '~/vue_merge_request_widget/components/states/mr_widget_not_allowed.vue';
+import StatusIcon from '~/vue_merge_request_widget/components/mr_widget_status_icon.vue';
 
 describe('MRWidgetNotAllowed', () => {
-  let vm;
+  let wrapper;
+
   beforeEach(() => {
-    const Component = Vue.extend(notAllowedComponent);
-    vm = mountComponent(Component);
+    wrapper = shallowMount(notAllowedComponent);
   });
 
   afterEach(() => {
-    vm.$destroy();
+    wrapper.destroy();
+    wrapper = null;
   });
 
   it('renders success icon', () => {
-    expect(vm.$el.querySelector('.ci-status-icon-success')).not.toBe(null);
+    expect(wrapper.findComponent(StatusIcon).exists()).toBe(true);
+    expect(wrapper.findComponent(StatusIcon).props().status).toBe('success');
   });
 
   it('renders informative text', () => {
-    expect(vm.$el.innerText).toContain('Ready to be merged automatically.');
-    expect(vm.$el.innerText).toContain(
+    expect(wrapper.text()).toContain('Ready to be merged automatically.');
+    expect(wrapper.text()).toContain(
       'Ask someone with write access to this repository to merge this request',
     );
   });