Merge branch...

Merge branch 'migrate_ee_spec_javascripts_vue_mr_widget_components_codequality_issue_body_spec' into 'master'

Migrate ee codequality_issue_body_spec to Jest

See merge request gitlab-org/gitlab!30578

ee/spec/javascripts/vue_mr_widget/components/codequality_issue_body_spec.js → ee/spec/frontend/vue_mr_widget/components/codequality_issue_body_spec.js

-import Vue from 'vue';
+import { shallowMount } from '@vue/test-utils';
 import component from 'ee/vue_merge_request_widget/components/codequality_issue_body.vue';
-import mountComponent from 'spec/helpers/vue_mount_component_helper';
 import { STATUS_FAILED, STATUS_NEUTRAL, STATUS_SUCCESS } from '~/reports/constants';
 
 describe('code quality issue body issue body', () => {
-  let vm;
+  let wrapper;
 
-  const Component = Vue.extend(component);
   const codequalityIssue = {
     name:
       'rubygem-rest-client: session fixation vulnerability via Set-Cookie headers in 30x redirection responses',
@@ -15,52 +13,50 @@ describe('code quality issue body issue body', () => {
     type: 'Issue',
     urlPath: '/Gemfile.lock#L22',
   };
+
+  const mountWithStatus = initialStatus => {
+    wrapper = shallowMount(component, {
+      propsData: {
+        issue: codequalityIssue,
+        status: initialStatus,
+      },
+    });
+  };
+
   afterEach(() => {
-    vm.$destroy();
+    wrapper.destroy();
+    wrapper = null;
   });
 
   describe('with success', () => {
     it('renders fixed label', () => {
-      vm = mountComponent(Component, {
-        issue: codequalityIssue,
-        status: STATUS_SUCCESS,
-      });
+      mountWithStatus(STATUS_SUCCESS);
 
-      expect(vm.$el.textContent.trim()).toContain('Fixed');
+      expect(wrapper.text()).toContain('Fixed');
     });
   });
 
   describe('without success', () => {
     it('renders fixed label', () => {
-      vm = mountComponent(Component, {
-        issue: codequalityIssue,
-        status: STATUS_FAILED,
-      });
+      mountWithStatus(STATUS_FAILED);
 
-      expect(vm.$el.textContent.trim()).not.toContain('Fixed');
+      expect(wrapper.text()).not.toContain('Fixed');
     });
   });
 
   describe('name', () => {
     it('renders name', () => {
-      vm = mountComponent(Component, {
-        issue: codequalityIssue,
-        status: STATUS_NEUTRAL,
-      });
+      mountWithStatus(STATUS_NEUTRAL);
 
-      expect(vm.$el.textContent.trim()).toContain(codequalityIssue.name);
+      expect(wrapper.text()).toContain(codequalityIssue.name);
     });
   });
 
   describe('path', () => {
-    it('renders name', () => {
-      vm = mountComponent(Component, {
-        issue: codequalityIssue,
-        status: STATUS_NEUTRAL,
-      });
+    it('renders the report-link path using the correct code quality issue', () => {
+      mountWithStatus(STATUS_NEUTRAL);
 
-      expect(vm.$el.querySelector('a').getAttribute('href')).toEqual(codequalityIssue.urlPath);
-      expect(vm.$el.querySelector('a').textContent.trim()).toEqual(codequalityIssue.path);
+      expect(wrapper.find('report-link-stub').props('issue')).toBe(codequalityIssue);
     });
   });
 });