Merge branch '30998-add-babel-rewire-plugin' into 'master'

Resolve "Add some way to mock and spy on default ES modules"

Closes #30998

See merge request gitlab-org/gitlab-ce!18116

39 files changed, 115 insertions, 133 deletions

diff --git a/spec/javascripts/.eslintrc b/spec/javascripts/.eslintrc
index 3d922021978..9eb0e732572 100644
--- a/spec/javascripts/.eslintrc
+++ b/spec/javascripts/.eslintrc
@@ -18,6 +18,7 @@
     "sandbox": false,
     "setFixtures": false,
     "setStyleFixtures": false,
+    "spyOnDependency": false,
     "spyOnEvent": false,
     "ClassSpecHelper": false
   },
diff --git a/spec/javascripts/behaviors/quick_submit_spec.js b/spec/javascripts/behaviors/quick_submit_spec.js
index c37c62c63dd..d03836d10f9 100644
--- a/spec/javascripts/behaviors/quick_submit_spec.js
+++ b/spec/javascripts/behaviors/quick_submit_spec.js
@@ -1,7 +1,7 @@
 import $ from 'jquery';
 import '~/behaviors/quick_submit';
 
-describe('Quick Submit behavior', () => {
+describe('Quick Submit behavior', function () {
   const keydownEvent = (options = { keyCode: 13, metaKey: true }) => $.Event('keydown', options);
 
   preloadFixtures('merge_requests/merge_request_with_task_list.html.raw');
diff --git a/spec/javascripts/blob/blob_file_dropzone_spec.js b/spec/javascripts/blob/blob_file_dropzone_spec.js
index 0b1de504435..346f795c3f5 100644
--- a/spec/javascripts/blob/blob_file_dropzone_spec.js
+++ b/spec/javascripts/blob/blob_file_dropzone_spec.js
@@ -1,7 +1,7 @@
 import $ from 'jquery';
 import BlobFileDropzone from '~/blob/blob_file_dropzone';
 
-describe('BlobFileDropzone', () => {
+describe('BlobFileDropzone', function () {
   preloadFixtures('blob/show.html.raw');
 
   beforeEach(() => {
diff --git a/spec/javascripts/comment_type_toggle_spec.js b/spec/javascripts/comment_type_toggle_spec.js
index dfd0810d52e..0ba709298c5 100644
--- a/spec/javascripts/comment_type_toggle_spec.js
+++ b/spec/javascripts/comment_type_toggle_spec.js
@@ -1,5 +1,4 @@
 import CommentTypeToggle from '~/comment_type_toggle';
-import * as dropLabSrc from '~/droplab/drop_lab';
 import InputSetter from '~/droplab/plugins/input_setter';
 
 describe('CommentTypeToggle', function () {
@@ -59,14 +58,14 @@ describe('CommentTypeToggle', function () {
 
       this.droplab = jasmine.createSpyObj('droplab', ['init']);
 
-      spyOn(dropLabSrc, 'default').and.returnValue(this.droplab);
+      this.droplabConstructor = spyOnDependency(CommentTypeToggle, 'DropLab').and.returnValue(this.droplab);
       spyOn(this.commentTypeToggle, 'setConfig').and.returnValue(this.config);
 
       CommentTypeToggle.prototype.initDroplab.call(this.commentTypeToggle);
     });
 
     it('should instantiate a DropLab instance', function () {
-      expect(dropLabSrc.default).toHaveBeenCalled();
+      expect(this.droplabConstructor).toHaveBeenCalled();
     });
 
     it('should set .droplab', function () {
diff --git a/spec/javascripts/commit/pipelines/pipelines_spec.js b/spec/javascripts/commit/pipelines/pipelines_spec.js
index 53820770f3f..819ed7896ca 100644
--- a/spec/javascripts/commit/pipelines/pipelines_spec.js
+++ b/spec/javascripts/commit/pipelines/pipelines_spec.js
@@ -4,7 +4,7 @@ import axios from '~/lib/utils/axios_utils';
 import pipelinesTable from '~/commit/pipelines/pipelines_table.vue';
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
-describe('Pipelines table in Commits and Merge requests', () => {
+describe('Pipelines table in Commits and Merge requests', function () {
   const jsonFixtureName = 'pipelines/pipelines.json';
   let pipeline;
   let PipelinesTable;
diff --git a/spec/javascripts/droplab/hook_spec.js b/spec/javascripts/droplab/hook_spec.js
index 3d39bd0812b..5eed1db2750 100644
--- a/spec/javascripts/droplab/hook_spec.js
+++ b/spec/javascripts/droplab/hook_spec.js
@@ -1,5 +1,4 @@
 import Hook from '~/droplab/hook';
-import * as dropdownSrc from '~/droplab/drop_down';
 
 describe('Hook', function () {
   describe('class constructor', function () {
@@ -10,7 +9,7 @@ describe('Hook', function () {
       this.config = {};
       this.dropdown = {};
 
-      spyOn(dropdownSrc, 'default').and.returnValue(this.dropdown);
+      this.dropdownConstructor = spyOnDependency(Hook, 'DropDown').and.returnValue(this.dropdown);
 
       this.hook = new Hook(this.trigger, this.list, this.plugins, this.config);
     });
@@ -24,7 +23,7 @@ describe('Hook', function () {
     });
 
     it('should call DropDown constructor', function () {
-      expect(dropdownSrc.default).toHaveBeenCalledWith(this.list, this.config);
+      expect(this.dropdownConstructor).toHaveBeenCalledWith(this.list, this.config);
     });
 
     it('should set .type', function () {
diff --git a/spec/javascripts/filtered_search/filtered_search_manager_spec.js b/spec/javascripts/filtered_search/filtered_search_manager_spec.js
index 95d02974bdc..8fcee36beb8 100644
--- a/spec/javascripts/filtered_search/filtered_search_manager_spec.js
+++ b/spec/javascripts/filtered_search/filtered_search_manager_spec.js
@@ -1,5 +1,3 @@
-import * as urlUtils from '~/lib/utils/url_utility';
-import * as recentSearchesStoreSrc from '~/filtered_search/stores/recent_searches_store';
 import RecentSearchesService from '~/filtered_search/services/recent_searches_service';
 import RecentSearchesServiceError from '~/filtered_search/services/recent_searches_service_error';
 import RecentSearchesRoot from '~/filtered_search/recent_searches_root';
@@ -11,7 +9,7 @@ import FilteredSearchDropdownManager from '~/filtered_search/filtered_search_dro
 import FilteredSearchManager from '~/filtered_search/filtered_search_manager';
 import FilteredSearchSpecHelper from '../helpers/filtered_search_spec_helper';
 
-describe('Filtered Search Manager', () => {
+describe('Filtered Search Manager', function () {
   let input;
   let manager;
   let tokensContainer;
@@ -74,18 +72,19 @@ describe('Filtered Search Manager', () => {
 
   describe('class constructor', () => {
     const isLocalStorageAvailable = 'isLocalStorageAvailable';
+    let RecentSearchesStoreSpy;
 
     beforeEach(() => {
       spyOn(RecentSearchesService, 'isAvailable').and.returnValue(isLocalStorageAvailable);
-      spyOn(recentSearchesStoreSrc, 'default');
       spyOn(RecentSearchesRoot.prototype, 'render');
+      RecentSearchesStoreSpy = spyOnDependency(FilteredSearchManager, 'RecentSearchesStore');
     });
 
     it('should instantiate RecentSearchesStore with isLocalStorageAvailable', () => {
       manager = new FilteredSearchManager({ page });
 
       expect(RecentSearchesService.isAvailable).toHaveBeenCalled();
-      expect(recentSearchesStoreSrc.default).toHaveBeenCalledWith({
+      expect(RecentSearchesStoreSpy).toHaveBeenCalledWith({
         isLocalStorageAvailable,
         allowedKeys: FilteredSearchTokenKeys.getKeys(),
       });
@@ -164,7 +163,7 @@ describe('Filtered Search Manager', () => {
     it('should search with a single word', (done) => {
       input.value = 'searchTerm';
 
-      spyOn(urlUtils, 'visitUrl').and.callFake((url) => {
+      spyOnDependency(FilteredSearchManager, 'visitUrl').and.callFake((url) => {
         expect(url).toEqual(`${defaultParams}&search=searchTerm`);
         done();
       });
@@ -175,7 +174,7 @@ describe('Filtered Search Manager', () => {
     it('should search with multiple words', (done) => {
       input.value = 'awesome search terms';
 
-      spyOn(urlUtils, 'visitUrl').and.callFake((url) => {
+      spyOnDependency(FilteredSearchManager, 'visitUrl').and.callFake((url) => {
         expect(url).toEqual(`${defaultParams}&search=awesome+search+terms`);
         done();
       });
@@ -186,7 +185,7 @@ describe('Filtered Search Manager', () => {
     it('should search with special characters', (done) => {
       input.value = '~!@#$%^&*()_+{}:<>,.?/';
 
-      spyOn(urlUtils, 'visitUrl').and.callFake((url) => {
+      spyOnDependency(FilteredSearchManager, 'visitUrl').and.callFake((url) => {
         expect(url).toEqual(`${defaultParams}&search=~!%40%23%24%25%5E%26*()_%2B%7B%7D%3A%3C%3E%2C.%3F%2F`);
         done();
       });
@@ -200,7 +199,7 @@ describe('Filtered Search Manager', () => {
         ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '~bug')}
       `);
 
-      spyOn(urlUtils, 'visitUrl').and.callFake((url) => {
+      spyOnDependency(FilteredSearchManager, 'visitUrl').and.callFake((url) => {
         expect(url).toEqual(`${defaultParams}&label_name[]=bug`);
         done();
       });
diff --git a/spec/javascripts/filtered_search/recent_searches_root_spec.js b/spec/javascripts/filtered_search/recent_searches_root_spec.js
index d8ba6de5f45..1e6272bad0b 100644
--- a/spec/javascripts/filtered_search/recent_searches_root_spec.js
+++ b/spec/javascripts/filtered_search/recent_searches_root_spec.js
@@ -1,11 +1,11 @@
 import RecentSearchesRoot from '~/filtered_search/recent_searches_root';
-import * as vueSrc from 'vue';
 
 describe('RecentSearchesRoot', () => {
   describe('render', () => {
     let recentSearchesRoot;
     let data;
     let template;
+    let VueSpy;
 
     beforeEach(() => {
       recentSearchesRoot = {
@@ -14,7 +14,7 @@ describe('RecentSearchesRoot', () => {
         },
       };
 
-      spyOn(vueSrc, 'default').and.callFake((options) => {
+      VueSpy = spyOnDependency(RecentSearchesRoot, 'Vue').and.callFake((options) => {
         data = options.data;
         template = options.template;
       });
@@ -23,7 +23,7 @@ describe('RecentSearchesRoot', () => {
     });
 
     it('should instantiate Vue', () => {
-      expect(vueSrc.default).toHaveBeenCalled();
+      expect(VueSpy).toHaveBeenCalled();
       expect(data()).toBe(recentSearchesRoot.store.state);
       expect(template).toContain(':is-local-storage-available="isLocalStorageAvailable"');
     });
diff --git a/spec/javascripts/gl_dropdown_spec.js b/spec/javascripts/gl_dropdown_spec.js
index 5393502196e..7f9c4811fba 100644
--- a/spec/javascripts/gl_dropdown_spec.js
+++ b/spec/javascripts/gl_dropdown_spec.js
@@ -1,9 +1,8 @@
 /* eslint-disable comma-dangle, no-param-reassign, no-unused-expressions, max-len */
 
 import $ from 'jquery';
-import '~/gl_dropdown';
+import GLDropdown from '~/gl_dropdown';
 import '~/lib/utils/common_utils';
-import * as urlUtils from '~/lib/utils/url_utility';
 
 describe('glDropdown', function describeDropdown() {
   preloadFixtures('static/gl_dropdown.html.raw');
@@ -138,13 +137,13 @@ describe('glDropdown', function describeDropdown() {
       expect(this.dropdownContainerElement).toHaveClass('open');
       const randomIndex = Math.floor(Math.random() * (this.projectsData.length - 1)) + 0;
       navigateWithKeys('down', randomIndex, () => {
-        spyOn(urlUtils, 'visitUrl').and.stub();
+        const visitUrl = spyOnDependency(GLDropdown, 'visitUrl').and.stub();
         navigateWithKeys('enter', null, () => {
           expect(this.dropdownContainerElement).not.toHaveClass('open');
           const link = $(`${ITEM_SELECTOR}:eq(${randomIndex}) a`, this.$dropdownMenuElement);
           expect(link).toHaveClass('is-active');
           const linkedLocation = link.attr('href');
-          if (linkedLocation && linkedLocation !== '#') expect(urlUtils.visitUrl).toHaveBeenCalledWith(linkedLocation);
+          if (linkedLocation && linkedLocation !== '#') expect(visitUrl).toHaveBeenCalledWith(linkedLocation);
         });
       });
     });
diff --git a/spec/javascripts/groups/components/app_spec.js b/spec/javascripts/groups/components/app_spec.js
index d8428bd0e08..2b92c485f41 100644
--- a/spec/javascripts/groups/components/app_spec.js
+++ b/spec/javascripts/groups/components/app_spec.js
@@ -1,7 +1,6 @@
 import $ from 'jquery';
 import Vue from 'vue';
 
-import * as utils from '~/lib/utils/url_utility';
 import appComponent from '~/groups/components/app.vue';
 import groupFolderComponent from '~/groups/components/group_folder.vue';
 import groupItemComponent from '~/groups/components/group_item.vue';
@@ -177,7 +176,7 @@ describe('AppComponent', () => {
       it('should fetch groups for provided page details and update window state', (done) => {
         spyOn(vm, 'fetchGroups').and.returnValue(returnServicePromise(mockGroups));
         spyOn(vm, 'updateGroups').and.callThrough();
-        spyOn(utils, 'mergeUrlParams').and.callThrough();
+        const mergeUrlParams = spyOnDependency(appComponent, 'mergeUrlParams').and.callThrough();
         spyOn(window.history, 'replaceState');
         spyOn($, 'scrollTo');
 
@@ -193,7 +192,7 @@ describe('AppComponent', () => {
         setTimeout(() => {
           expect(vm.isLoading).toBe(false);
           expect($.scrollTo).toHaveBeenCalledWith(0);
-          expect(utils.mergeUrlParams).toHaveBeenCalledWith({ page: 2 }, jasmine.any(String));
+          expect(mergeUrlParams).toHaveBeenCalledWith({ page: 2 }, jasmine.any(String));
           expect(window.history.replaceState).toHaveBeenCalledWith({
             page: jasmine.any(String),
           }, jasmine.any(String), jasmine.any(String));
diff --git a/spec/javascripts/groups/components/group_item_spec.js b/spec/javascripts/groups/components/group_item_spec.js
index e3c942597a3..49a139855c8 100644
--- a/spec/javascripts/groups/components/group_item_spec.js
+++ b/spec/javascripts/groups/components/group_item_spec.js
@@ -1,5 +1,4 @@
 import Vue from 'vue';
-import * as urlUtils from '~/lib/utils/url_utility';
 import groupItemComponent from '~/groups/components/group_item.vue';
 import groupFolderComponent from '~/groups/components/group_folder.vue';
 import eventHub from '~/groups/event_hub';
@@ -135,13 +134,13 @@ describe('GroupItemComponent', () => {
         const group = Object.assign({}, mockParentGroupItem);
         group.childrenCount = 0;
         const newVm = createComponent(group);
-        spyOn(urlUtils, 'visitUrl').and.stub();
+        const visitUrl = spyOnDependency(groupItemComponent, 'visitUrl').and.stub();
         spyOn(eventHub, '$emit');
 
         newVm.onClickRowGroup(event);
         setTimeout(() => {
           expect(eventHub.$emit).not.toHaveBeenCalled();
-          expect(urlUtils.visitUrl).toHaveBeenCalledWith(newVm.group.relativePath);
+          expect(visitUrl).toHaveBeenCalledWith(newVm.group.relativePath);
           done();
         }, 0);
       });
diff --git a/spec/javascripts/helpers/class_spec_helper_spec.js b/spec/javascripts/helpers/class_spec_helper_spec.js
index 1415ffb7eb3..fa104ae5bcd 100644
--- a/spec/javascripts/helpers/class_spec_helper_spec.js
+++ b/spec/javascripts/helpers/class_spec_helper_spec.js
@@ -2,7 +2,7 @@
 
 import './class_spec_helper';
 
-describe('ClassSpecHelper', () => {
+describe('ClassSpecHelper', function () {
   describe('itShouldBeAStaticMethod', () => {
     beforeEach(() => {
       class TestClass {
diff --git a/spec/javascripts/ide/stores/actions_spec.js b/spec/javascripts/ide/stores/actions_spec.js
index f848f13d429..0d603fac463 100644
--- a/spec/javascripts/ide/stores/actions_spec.js
+++ b/spec/javascripts/ide/stores/actions_spec.js
@@ -1,6 +1,5 @@
-import * as urlUtils from '~/lib/utils/url_utility';
+import actions, { stageAllChanges, unstageAllChanges } from '~/ide/stores/actions';
 import store from '~/ide/stores';
-import * as actions from '~/ide/stores/actions';
 import * as types from '~/ide/stores/mutation_types';
 import router from '~/ide/ide_router';
 import { resetStore, file } from '../helpers';
@@ -17,12 +16,12 @@ describe('Multi-file store actions', () => {
 
   describe('redirectToUrl', () => {
     it('calls visitUrl', done => {
-      spyOn(urlUtils, 'visitUrl');
+      const visitUrl = spyOnDependency(actions, 'visitUrl');
 
       store
         .dispatch('redirectToUrl', 'test')
         .then(() => {
-          expect(urlUtils.visitUrl).toHaveBeenCalledWith('test');
+          expect(visitUrl).toHaveBeenCalledWith('test');
 
           done();
         })
@@ -298,7 +297,7 @@ describe('Multi-file store actions', () => {
       store.state.changedFiles.push(file(), file('new'));
 
       testAction(
-        actions.stageAllChanges,
+        stageAllChanges,
         null,
         store.state,
         [
@@ -316,7 +315,7 @@ describe('Multi-file store actions', () => {
       store.state.stagedFiles.push(file(), file('new'));
 
       testAction(
-        actions.unstageAllChanges,
+        unstageAllChanges,
         null,
         store.state,
         [
diff --git a/spec/javascripts/ide/stores/modules/commit/actions_spec.js b/spec/javascripts/ide/stores/modules/commit/actions_spec.js
index 116967208e0..b2b4b85ca42 100644
--- a/spec/javascripts/ide/stores/modules/commit/actions_spec.js
+++ b/spec/javascripts/ide/stores/modules/commit/actions_spec.js
@@ -1,7 +1,7 @@
+import actions from '~/ide/stores/actions';
 import store from '~/ide/stores';
 import service from '~/ide/services';
 import router from '~/ide/ide_router';
-import * as urlUtils from '~/lib/utils/url_utility';
 import eventHub from '~/ide/eventhub';
 import * as consts from '~/ide/stores/modules/commit/constants';
 import { resetStore, file } from 'spec/ide/helpers';
@@ -307,8 +307,10 @@ describe('IDE commit module actions', () => {
   });
 
   describe('commitChanges', () => {
+    let visitUrl;
+
     beforeEach(() => {
-      spyOn(urlUtils, 'visitUrl');
+      visitUrl = spyOnDependency(actions, 'visitUrl');
 
       document.body.innerHTML += '<div class="flash-container"></div>';
 
@@ -461,7 +463,7 @@ describe('IDE commit module actions', () => {
           store
             .dispatch('commit/commitChanges')
             .then(() => {
-              expect(urlUtils.visitUrl).toHaveBeenCalledWith(
+              expect(visitUrl).toHaveBeenCalledWith(
                 `webUrl/merge_requests/new?merge_request[source_branch]=${
                   store.getters['commit/newBranchName']
                 }&merge_request[target_branch]=master`,
diff --git a/spec/javascripts/issue_show/components/app_spec.js b/spec/javascripts/issue_show/components/app_spec.js
index d5a87b5ce20..bf1f0c822fe 100644
--- a/spec/javascripts/issue_show/components/app_spec.js
+++ b/spec/javascripts/issue_show/components/app_spec.js
@@ -2,7 +2,6 @@ import Vue from 'vue';
 import MockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
 import '~/behaviors/markdown/render_gfm';
-import * as urlUtils from '~/lib/utils/url_utility';
 import issuableApp from '~/issue_show/components/app.vue';
 import eventHub from '~/issue_show/event_hub';
 import setTimeoutPromise from 'spec/helpers/set_timeout_promise_helper';
@@ -174,7 +173,7 @@ describe('Issuable output', () => {
     });
 
     it('does not redirect if issue has not moved', (done) => {
-      spyOn(urlUtils, 'visitUrl');
+      const visitUrl = spyOnDependency(issuableApp, 'visitUrl');
       spyOn(vm.service, 'updateIssuable').and.callFake(() => new Promise((resolve) => {
         resolve({
           data: {
@@ -187,16 +186,13 @@ describe('Issuable output', () => {
       vm.updateIssuable();
 
       setTimeout(() => {
-        expect(
-          urlUtils.visitUrl,
-        ).not.toHaveBeenCalled();
-
+        expect(visitUrl).not.toHaveBeenCalled();
         done();
       });
     });
 
     it('redirects if returned web_url has changed', (done) => {
-      spyOn(urlUtils, 'visitUrl');
+      const visitUrl = spyOnDependency(issuableApp, 'visitUrl');
       spyOn(vm.service, 'updateIssuable').and.callFake(() => new Promise((resolve) => {
         resolve({
           data: {
@@ -209,10 +205,7 @@ describe('Issuable output', () => {
       vm.updateIssuable();
 
       setTimeout(() => {
-        expect(
-          urlUtils.visitUrl,
-        ).toHaveBeenCalledWith('/testing-issue-move');
-
+        expect(visitUrl).toHaveBeenCalledWith('/testing-issue-move');
         done();
       });
     });
@@ -340,7 +333,7 @@ describe('Issuable output', () => {
 
   describe('deleteIssuable', () => {
     it('changes URL when deleted', (done) => {
-      spyOn(urlUtils, 'visitUrl');
+      const visitUrl = spyOnDependency(issuableApp, 'visitUrl');
       spyOn(vm.service, 'deleteIssuable').and.callFake(() => new Promise((resolve) => {
         resolve({
           data: {
@@ -352,16 +345,13 @@ describe('Issuable output', () => {
       vm.deleteIssuable();
 
       setTimeout(() => {
-        expect(
-          urlUtils.visitUrl,
-        ).toHaveBeenCalledWith('/test');
-
+        expect(visitUrl).toHaveBeenCalledWith('/test');
         done();
       });
     });
 
     it('stops polling when deleting', (done) => {
-      spyOn(urlUtils, 'visitUrl');
+      spyOnDependency(issuableApp, 'visitUrl');
       spyOn(vm.poll, 'stop').and.callThrough();
       spyOn(vm.service, 'deleteIssuable').and.callFake(() => new Promise((resolve) => {
         resolve({
@@ -377,7 +367,6 @@ describe('Issuable output', () => {
         expect(
           vm.poll.stop,
         ).toHaveBeenCalledWith();
-
         done();
       });
     });
diff --git a/spec/javascripts/issue_show/components/description_spec.js b/spec/javascripts/issue_show/components/description_spec.js
index d96151a8a3a..889c8545faa 100644
--- a/spec/javascripts/issue_show/components/description_spec.js
+++ b/spec/javascripts/issue_show/components/description_spec.js
@@ -1,7 +1,6 @@
 import $ from 'jquery';
 import Vue from 'vue';
-import descriptionComponent from '~/issue_show/components/description.vue';
-import * as taskList from '~/task_list';
+import Description from '~/issue_show/components/description.vue';
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
 describe('Description component', () => {
@@ -17,7 +16,7 @@ describe('Description component', () => {
   };
 
   beforeEach(() => {
-    DescriptionComponent = Vue.extend(descriptionComponent);
+    DescriptionComponent = Vue.extend(Description);
 
     if (!document.querySelector('.issuable-meta')) {
       const metaData = document.createElement('div');
@@ -82,18 +81,20 @@ describe('Description component', () => {
   });
 
   describe('TaskList', () => {
+    let TaskList;
+
     beforeEach(() => {
       vm = mountComponent(DescriptionComponent, Object.assign({}, props, {
         issuableType: 'issuableType',
       }));
-      spyOn(taskList, 'default');
+      TaskList = spyOnDependency(Description, 'TaskList');
     });
 
     it('re-inits the TaskList when description changed', (done) => {
       vm.descriptionHtml = 'changed';
 
       setTimeout(() => {
-        expect(taskList.default).toHaveBeenCalled();
+        expect(TaskList).toHaveBeenCalled();
         done();
       });
     });
@@ -103,7 +104,7 @@ describe('Description component', () => {
       vm.descriptionHtml = 'changed';
 
       setTimeout(() => {
-        expect(taskList.default).not.toHaveBeenCalled();
+        expect(TaskList).not.toHaveBeenCalled();
         done();
       });
     });
@@ -112,7 +113,7 @@ describe('Description component', () => {
       vm.descriptionHtml = 'changed';
 
       setTimeout(() => {
-        expect(taskList.default).toHaveBeenCalledWith({
+        expect(TaskList).toHaveBeenCalledWith({
           dataType: 'issuableType',
           fieldName: 'description',
           selector: '.detail-page-description',
diff --git a/spec/javascripts/job_spec.js b/spec/javascripts/job_spec.js
index c6bbacf237a..da00b615c9b 100644
--- a/spec/javascripts/job_spec.js
+++ b/spec/javascripts/job_spec.js
@@ -2,7 +2,6 @@ import $ from 'jquery';
 import MockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
 import { numberToHumanSize } from '~/lib/utils/number_utils';
-import * as urlUtils from '~/lib/utils/url_utility';
 import '~/lib/utils/datetime_utility';
 import Job from '~/job';
 import '~/breakpoints';
@@ -22,7 +21,7 @@ describe('Job', () => {
   beforeEach(() => {
     loadFixtures('builds/build-with-artifacts.html.raw');
 
-    spyOn(urlUtils, 'visitUrl');
+    spyOnDependency(Job, 'visitUrl');
 
     response = {};
 
diff --git a/spec/javascripts/lib/utils/csrf_token_spec.js b/spec/javascripts/lib/utils/csrf_token_spec.js
index c484213df8e..81a39a97a84 100644
--- a/spec/javascripts/lib/utils/csrf_token_spec.js
+++ b/spec/javascripts/lib/utils/csrf_token_spec.js
@@ -1,6 +1,6 @@
 import csrf from '~/lib/utils/csrf';
 
-describe('csrf', () => {
+describe('csrf', function () {
   beforeEach(() => {
     this.tokenKey = 'X-CSRF-Token';
     this.token = 'pH1cvjnP9grx2oKlhWEDvUZnJ8x2eXsIs1qzyHkF3DugSG5yTxR76CWeEZRhML2D1IeVB7NEW0t5l/axE4iJpQ==';
diff --git a/spec/javascripts/lib/utils/image_utility_spec.js b/spec/javascripts/lib/utils/image_utility_spec.js
index 75addfcc833..a7eff419fba 100644
--- a/spec/javascripts/lib/utils/image_utility_spec.js
+++ b/spec/javascripts/lib/utils/image_utility_spec.js
@@ -1,4 +1,4 @@
-import * as imageUtility from '~/lib/utils/image_utility';
+import { isImageLoaded } from '~/lib/utils/image_utility';
 
 describe('imageUtility', () => {
   describe('isImageLoaded', () => {
@@ -8,7 +8,7 @@ describe('imageUtility', () => {
         naturalHeight: 100,
       };
 
-      expect(imageUtility.isImageLoaded(element)).toEqual(false);
+      expect(isImageLoaded(element)).toEqual(false);
     });
 
     it('should return false when naturalHeight = 0', () => {
@@ -17,7 +17,7 @@ describe('imageUtility', () => {
         naturalHeight: 0,
       };
 
-      expect(imageUtility.isImageLoaded(element)).toEqual(false);
+      expect(isImageLoaded(element)).toEqual(false);
     });
 
     it('should return true when image.complete and naturalHeight != 0', () => {
@@ -26,7 +26,7 @@ describe('imageUtility', () => {
         naturalHeight: 100,
       };
 
-      expect(imageUtility.isImageLoaded(element)).toEqual(true);
+      expect(isImageLoaded(element)).toEqual(true);
     });
   });
 });
diff --git a/spec/javascripts/merge_request_tabs_spec.js b/spec/javascripts/merge_request_tabs_spec.js
index 79c8cf0ba32..3dbd9756cd2 100644
--- a/spec/javascripts/merge_request_tabs_spec.js
+++ b/spec/javascripts/merge_request_tabs_spec.js
@@ -3,7 +3,6 @@
 import $ from 'jquery';
 import MockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
-import * as urlUtils from '~/lib/utils/url_utility';
 import MergeRequestTabs from '~/merge_request_tabs';
 import '~/commit/pipelines/pipelines_bundle';
 import '~/breakpoints';
@@ -356,7 +355,7 @@ import 'vendor/jquery.scrollTo';
 
         describe('with note fragment hash', () => {
           it('should expand and scroll to linked fragment hash #note_xxx', function (done) {
-            spyOn(urlUtils, 'getLocationHash').and.returnValue(noteId);
+            spyOnDependency(MergeRequestTabs, 'getLocationHash').and.returnValue(noteId);
             this.class.loadDiff('/foo/bar/merge_requests/1/diffs');
 
             setTimeout(() => {
@@ -372,7 +371,7 @@ import 'vendor/jquery.scrollTo';
           });
 
           it('should gracefully ignore non-existant fragment hash', function (done) {
-            spyOn(urlUtils, 'getLocationHash').and.returnValue('note_something-that-does-not-exist');
+            spyOnDependency(MergeRequestTabs, 'getLocationHash').and.returnValue('note_something-that-does-not-exist');
             this.class.loadDiff('/foo/bar/merge_requests/1/diffs');
 
             setTimeout(() => {
@@ -385,7 +384,7 @@ import 'vendor/jquery.scrollTo';
 
         describe('with line number fragment hash', () => {
           it('should gracefully ignore line number fragment hash', function () {
-            spyOn(urlUtils, 'getLocationHash').and.returnValue(noteLineNumId);
+            spyOnDependency(MergeRequestTabs, 'getLocationHash').and.returnValue(noteLineNumId);
             this.class.loadDiff('/foo/bar/merge_requests/1/diffs');
 
             expect(noteLineNumId.length).toBeGreaterThan(0);
@@ -422,7 +421,7 @@ import 'vendor/jquery.scrollTo';
 
         describe('with note fragment hash', () => {
           it('should expand and scroll to linked fragment hash #note_xxx', function (done) {
-            spyOn(urlUtils, 'getLocationHash').and.returnValue(noteId);
+            spyOnDependency(MergeRequestTabs, 'getLocationHash').and.returnValue(noteId);
 
             this.class.loadDiff('/foo/bar/merge_requests/1/diffs');
 
@@ -439,7 +438,7 @@ import 'vendor/jquery.scrollTo';
           });
 
           it('should gracefully ignore non-existant fragment hash', function (done) {
-            spyOn(urlUtils, 'getLocationHash').and.returnValue('note_something-that-does-not-exist');
+            spyOnDependency(MergeRequestTabs, 'getLocationHash').and.returnValue('note_something-that-does-not-exist');
             this.class.loadDiff('/foo/bar/merge_requests/1/diffs');
 
             setTimeout(() => {
@@ -451,7 +450,7 @@ import 'vendor/jquery.scrollTo';
 
         describe('with line number fragment hash', () => {
           it('should gracefully ignore line number fragment hash', function () {
-            spyOn(urlUtils, 'getLocationHash').and.returnValue(noteLineNumId);
+            spyOnDependency(MergeRequestTabs, 'getLocationHash').and.returnValue(noteLineNumId);
             this.class.loadDiff('/foo/bar/merge_requests/1/diffs');
 
             expect(noteLineNumId.length).toBeGreaterThan(0);
diff --git a/spec/javascripts/monitoring/monitoring_store_spec.js b/spec/javascripts/monitoring/monitoring_store_spec.js
index 88aa7659275..08d54946787 100644
--- a/spec/javascripts/monitoring/monitoring_store_spec.js
+++ b/spec/javascripts/monitoring/monitoring_store_spec.js
@@ -1,7 +1,7 @@
 import MonitoringStore from '~/monitoring/stores/monitoring_store';
 import MonitoringMock, { deploymentData } from './mock_data';
 
-describe('MonitoringStore', () => {
+describe('MonitoringStore', function () {
   this.store = new MonitoringStore();
   this.store.storeMetrics(MonitoringMock.data);
 
diff --git a/spec/javascripts/notes_spec.js b/spec/javascripts/notes_spec.js
index ec56ab0e2f0..0952356c2f4 100644
--- a/spec/javascripts/notes_spec.js
+++ b/spec/javascripts/notes_spec.js
@@ -3,7 +3,6 @@ import $ from 'jquery';
 import _ from 'underscore';
 import MockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
-import * as urlUtils from '~/lib/utils/url_utility';
 import 'autosize';
 import '~/gl_form';
 import '~/lib/utils/text_utility';
@@ -222,7 +221,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
       });
 
       it('sets target when hash matches', () => {
-        spyOn(urlUtils, 'getLocationHash').and.returnValue(hash);
+        spyOnDependency(Notes, 'getLocationHash').and.returnValue(hash);
 
         Notes.updateNoteTargetSelector($note);
 
@@ -231,7 +230,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
       });
 
       it('unsets target when hash does not match', () => {
-        spyOn(urlUtils, 'getLocationHash').and.returnValue('note_doesnotexist');
+        spyOnDependency(Notes, 'getLocationHash').and.returnValue('note_doesnotexist');
 
         Notes.updateNoteTargetSelector($note);
 
@@ -239,7 +238,7 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
       });
 
       it('unsets target when there is not a hash fragment anymore', () => {
-        spyOn(urlUtils, 'getLocationHash').and.returnValue(null);
+        spyOnDependency(Notes, 'getLocationHash').and.returnValue(null);
 
         Notes.updateNoteTargetSelector($note);
 
diff --git a/spec/javascripts/pager_spec.js b/spec/javascripts/pager_spec.js
index b09494f0b77..8e1e6af2286 100644
--- a/spec/javascripts/pager_spec.js
+++ b/spec/javascripts/pager_spec.js
@@ -1,7 +1,5 @@
-/* global fixture */
 import MockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
-import * as utils from '~/lib/utils/url_utility';
 import Pager from '~/pager';
 
 describe('pager', () => {
@@ -25,7 +23,7 @@ describe('pager', () => {
 
     it('should use current url if data-href attribute not provided', () => {
       const href = `${gl.TEST_HOST}/some_list`;
-      spyOn(utils, 'removeParams').and.returnValue(href);
+      spyOnDependency(Pager, 'removeParams').and.returnValue(href);
       Pager.init();
       expect(Pager.url).toBe(href);
     });
@@ -39,9 +37,9 @@ describe('pager', () => {
     it('keeps extra query parameters from url', () => {
       window.history.replaceState({}, null, '?filter=test&offset=100');
       const href = `${gl.TEST_HOST}/some_list?filter=test`;
-      spyOn(utils, 'removeParams').and.returnValue(href);
+      const removeParams = spyOnDependency(Pager, 'removeParams').and.returnValue(href);
       Pager.init();
-      expect(utils.removeParams).toHaveBeenCalledWith(['limit', 'offset']);
+      expect(removeParams).toHaveBeenCalledWith(['limit', 'offset']);
       expect(Pager.url).toEqual(href);
     });
   });
diff --git a/spec/javascripts/pages/admin/jobs/index/components/stop_jobs_modal_spec.js b/spec/javascripts/pages/admin/jobs/index/components/stop_jobs_modal_spec.js
index a6fe9fb65e9..b69e5f9a3a0 100644
--- a/spec/javascripts/pages/admin/jobs/index/components/stop_jobs_modal_spec.js
+++ b/spec/javascripts/pages/admin/jobs/index/components/stop_jobs_modal_spec.js
@@ -2,7 +2,6 @@ import Vue from 'vue';
 
 import axios from '~/lib/utils/axios_utils';
 import stopJobsModal from '~/pages/admin/jobs/index/components/stop_jobs_modal.vue';
-import * as urlUtility from '~/lib/utils/url_utility';
 
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
@@ -24,7 +23,7 @@ describe('stop_jobs_modal.vue', () => {
   describe('onSubmit', () => {
     it('stops jobs and redirects to overview page', (done) => {
       const responseURL = `${gl.TEST_HOST}/stop_jobs_modal.vue/jobs`;
-      const redirectSpy = spyOn(urlUtility, 'redirectTo');
+      const redirectSpy = spyOnDependency(stopJobsModal, 'redirectTo');
       spyOn(axios, 'post').and.callFake((url) => {
         expect(url).toBe(props.url);
         return Promise.resolve({
@@ -44,7 +43,7 @@ describe('stop_jobs_modal.vue', () => {
 
     it('displays error if stopping jobs failed', (done) => {
       const dummyError = new Error('stopping jobs failed');
-      const redirectSpy = spyOn(urlUtility, 'redirectTo');
+      const redirectSpy = spyOnDependency(stopJobsModal, 'redirectTo');
       spyOn(axios, 'post').and.callFake((url) => {
         expect(url).toBe(props.url);
         return Promise.reject(dummyError);
diff --git a/spec/javascripts/pages/milestones/shared/components/delete_milestone_modal_spec.js b/spec/javascripts/pages/milestones/shared/components/delete_milestone_modal_spec.js
index 6074e06fcec..94401beb5c9 100644
--- a/spec/javascripts/pages/milestones/shared/components/delete_milestone_modal_spec.js
+++ b/spec/javascripts/pages/milestones/shared/components/delete_milestone_modal_spec.js
@@ -3,7 +3,6 @@ import Vue from 'vue';
 import axios from '~/lib/utils/axios_utils';
 import deleteMilestoneModal from '~/pages/milestones/shared/components/delete_milestone_modal.vue';
 import eventHub from '~/pages/milestones/shared/event_hub';
-import * as urlUtility from '~/lib/utils/url_utility';
 
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
@@ -40,7 +39,7 @@ describe('delete_milestone_modal.vue', () => {
           },
         });
       });
-      const redirectSpy = spyOn(urlUtility, 'redirectTo');
+      const redirectSpy = spyOnDependency(deleteMilestoneModal, 'redirectTo');
 
       vm.onSubmit()
       .then(() => {
@@ -60,7 +59,7 @@ describe('delete_milestone_modal.vue', () => {
         eventHub.$emit.calls.reset();
         return Promise.reject(dummyError);
       });
-      const redirectSpy = spyOn(urlUtility, 'redirectTo');
+      const redirectSpy = spyOnDependency(deleteMilestoneModal, 'redirectTo');
 
       vm.onSubmit()
         .catch((error) => {
diff --git a/spec/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedule_callout_spec.js b/spec/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedule_callout_spec.js
index f95a7cef18a..fb7d2763b49 100644
--- a/spec/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedule_callout_spec.js
+++ b/spec/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedule_callout_spec.js
@@ -6,7 +6,7 @@ const PipelineSchedulesCalloutComponent = Vue.extend(PipelineSchedulesCallout);
 const cookieKey = 'pipeline_schedules_callout_dismissed';
 const docsUrl = 'help/ci/scheduled_pipelines';
 
-describe('Pipeline Schedule Callout', () => {
+describe('Pipeline Schedule Callout', function () {
   beforeEach(() => {
     setFixtures(`
       <div id='pipeline-schedules-callout' data-docs-url=${docsUrl}></div>
diff --git a/spec/javascripts/right_sidebar_spec.js b/spec/javascripts/right_sidebar_spec.js
index 80770a61011..e264b16335f 100644
--- a/spec/javascripts/right_sidebar_spec.js
+++ b/spec/javascripts/right_sidebar_spec.js
@@ -9,8 +9,6 @@ import Sidebar from '~/right_sidebar';
 (function() {
   var $aside, $icon, $labelsIcon, $page, $toggle, assertSidebarState;
 
-  this.sidebar = null;
-
   $aside = null;
 
   $toggle = null;
@@ -43,7 +41,7 @@ import Sidebar from '~/right_sidebar';
       beforeEach(function() {
         loadFixtures(fixtureName);
         mock = new MockAdapter(axios);
-        this.sidebar = new Sidebar();
+        new Sidebar(); // eslint-disable-line no-new
         $aside = $('.right-sidebar');
         $page = $('.layout-page');
         $icon = $aside.find('i');
diff --git a/spec/javascripts/search_autocomplete_spec.js b/spec/javascripts/search_autocomplete_spec.js
index 1a27955983d..4f515f98a7e 100644
--- a/spec/javascripts/search_autocomplete_spec.js
+++ b/spec/javascripts/search_autocomplete_spec.js
@@ -4,7 +4,6 @@ import $ from 'jquery';
 import '~/gl_dropdown';
 import SearchAutocomplete from '~/search_autocomplete';
 import '~/lib/utils/common_utils';
-import * as urlUtils from '~/lib/utils/url_utility';
 
 describe('Search autocomplete dropdown', () => {
   var assertLinks,
@@ -129,9 +128,6 @@ describe('Search autocomplete dropdown', () => {
   beforeEach(function() {
     loadFixtures('static/search_autocomplete.html.raw');
 
-    // Prevent turbolinks from triggering within gl_dropdown
-    spyOn(urlUtils, 'visitUrl').and.returnValue(true);
-
     window.gon = {};
     window.gon.current_user_id = userId;
     window.gon.current_username = userName;
diff --git a/spec/javascripts/shortcuts_dashboard_navigation_spec.js b/spec/javascripts/shortcuts_dashboard_navigation_spec.js
index 888b49004bf..7cb201e01d8 100644
--- a/spec/javascripts/shortcuts_dashboard_navigation_spec.js
+++ b/spec/javascripts/shortcuts_dashboard_navigation_spec.js
@@ -1,24 +1,23 @@
 import findAndFollowLink from '~/shortcuts_dashboard_navigation';
-import * as urlUtility from '~/lib/utils/url_utility';
 
 describe('findAndFollowLink', () => {
   it('visits a link when the selector exists', () => {
     const href = '/some/path';
-    const locationSpy = spyOn(urlUtility, 'visitUrl');
+    const visitUrl = spyOnDependency(findAndFollowLink, 'visitUrl');
 
     setFixtures(`<a class="my-shortcut" href="${href}">link</a>`);
 
     findAndFollowLink('.my-shortcut');
 
-    expect(locationSpy).toHaveBeenCalledWith(href);
+    expect(visitUrl).toHaveBeenCalledWith(href);
   });
 
   it('does not throw an exception when the selector does not exist', () => {
-    const locationSpy = spyOn(urlUtility, 'visitUrl');
+    const visitUrl = spyOnDependency(findAndFollowLink, 'visitUrl');
 
     // this should not throw an exception
     findAndFollowLink('.this-selector-does-not-exist');
 
-    expect(locationSpy).not.toHaveBeenCalled();
+    expect(visitUrl).not.toHaveBeenCalled();
   });
 });
diff --git a/spec/javascripts/shortcuts_issuable_spec.js b/spec/javascripts/shortcuts_issuable_spec.js
index b0d714cbefb..d73608ed0ed 100644
--- a/spec/javascripts/shortcuts_issuable_spec.js
+++ b/spec/javascripts/shortcuts_issuable_spec.js
@@ -4,7 +4,7 @@ import ShortcutsIssuable from '~/shortcuts_issuable';
 
 initCopyAsGFM();
 
-describe('ShortcutsIssuable', () => {
+describe('ShortcutsIssuable', function () {
   const fixtureName = 'merge_requests/diff_comment.html.raw';
   preloadFixtures(fixtureName);
   beforeEach(() => {
diff --git a/spec/javascripts/sidebar/sidebar_mediator_spec.js b/spec/javascripts/sidebar/sidebar_mediator_spec.js
index afa18cc127e..da950258a94 100644
--- a/spec/javascripts/sidebar/sidebar_mediator_spec.js
+++ b/spec/javascripts/sidebar/sidebar_mediator_spec.js
@@ -1,12 +1,11 @@
 import _ from 'underscore';
 import Vue from 'vue';
-import * as urlUtils from '~/lib/utils/url_utility';
 import SidebarMediator from '~/sidebar/sidebar_mediator';
 import SidebarStore from '~/sidebar/stores/sidebar_store';
 import SidebarService from '~/sidebar/services/sidebar_service';
 import Mock from './mock_data';
 
-describe('Sidebar mediator', () => {
+describe('Sidebar mediator', function() {
   beforeEach(() => {
     Vue.http.interceptors.push(Mock.sidebarMockInterceptor);
     this.mediator = new SidebarMediator(Mock.mediator);
@@ -87,12 +86,12 @@ describe('Sidebar mediator', () => {
     const moveToProjectId = 7;
     this.mediator.store.setMoveToProjectId(moveToProjectId);
     spyOn(this.mediator.service, 'moveIssue').and.callThrough();
-    spyOn(urlUtils, 'visitUrl');
+    const visitUrl = spyOnDependency(SidebarMediator, 'visitUrl');
 
     this.mediator.moveIssue()
       .then(() => {
         expect(this.mediator.service.moveIssue).toHaveBeenCalledWith(moveToProjectId);
-        expect(urlUtils.visitUrl).toHaveBeenCalledWith('/root/some-project/issues/5');
+        expect(visitUrl).toHaveBeenCalledWith('/root/some-project/issues/5');
       })
       .then(done)
       .catch(done.fail);
diff --git a/spec/javascripts/sidebar/sidebar_move_issue_spec.js b/spec/javascripts/sidebar/sidebar_move_issue_spec.js
index d8e636cbdf0..a3fb965fbab 100644
--- a/spec/javascripts/sidebar/sidebar_move_issue_spec.js
+++ b/spec/javascripts/sidebar/sidebar_move_issue_spec.js
@@ -7,7 +7,7 @@ import SidebarService from '~/sidebar/services/sidebar_service';
 import SidebarMoveIssue from '~/sidebar/lib/sidebar_move_issue';
 import Mock from './mock_data';
 
-describe('SidebarMoveIssue', () => {
+describe('SidebarMoveIssue', function () {
   beforeEach(() => {
     Vue.http.interceptors.push(Mock.sidebarMockInterceptor);
     this.mediator = new SidebarMediator(Mock.mediator);
diff --git a/spec/javascripts/sidebar/sidebar_store_spec.js b/spec/javascripts/sidebar/sidebar_store_spec.js
index 3591f96ff87..08b112a54ba 100644
--- a/spec/javascripts/sidebar/sidebar_store_spec.js
+++ b/spec/javascripts/sidebar/sidebar_store_spec.js
@@ -31,7 +31,7 @@ const PARTICIPANT_LIST = [
   { ...PARTICIPANT, id: 3 },
 ];
 
-describe('Sidebar store', () => {
+describe('Sidebar store', function () {
   beforeEach(() => {
     this.store = new SidebarStore({
       currentUser: {
diff --git a/spec/javascripts/test_bundle.js b/spec/javascripts/test_bundle.js
index 14bff05e537..bcd15f5eae2 100644
--- a/spec/javascripts/test_bundle.js
+++ b/spec/javascripts/test_bundle.js
@@ -1,4 +1,5 @@
-/* eslint-disable jasmine/no-global-setup */
+/* eslint-disable jasmine/no-global-setup, jasmine/no-unsafe-spy, no-underscore-dangle */
+
 import $ from 'jquery';
 import 'vendor/jasmine-jquery';
 import '~/commons';
@@ -55,6 +56,17 @@ window.addEventListener('unhandledrejection', event => {
   console.error(event.reason.stack || event.reason);
 });
 
+// Add global function to spy on a module's dependencies via rewire
+window.spyOnDependency = (module, name) => {
+  const dependency = module.__GetDependency__(name);
+  const spy = jasmine.createSpy(name, dependency);
+  module.__Rewire__(name, spy);
+  return spy;
+};
+
+// Reset any rewired modules after each test (see babel-plugin-rewire)
+afterEach(__rewire_reset_all__); // eslint-disable-line
+
 // HACK: Chrome 59 disconnects if there are too many synchronous tests in a row
 // because it appears to lock up the thread that communicates to Karma's socket
 // This async beforeEach gets called on every spec and releases the JS thread long
diff --git a/spec/javascripts/todos_spec.js b/spec/javascripts/todos_spec.js
index 898bbb3819b..e74f4bdef7e 100644
--- a/spec/javascripts/todos_spec.js
+++ b/spec/javascripts/todos_spec.js
@@ -1,5 +1,4 @@
 import $ from 'jquery';
-import * as urlUtils from '~/lib/utils/url_utility';
 import Todos from '~/pages/dashboard/todos/index/todos';
 import '~/lib/utils/common_utils';
 
@@ -18,7 +17,7 @@ describe('Todos', () => {
     it('opens the todo url', (done) => {
       const todoLink = todoItem.dataset.url;
 
-      spyOn(urlUtils, 'visitUrl').and.callFake((url) => {
+      spyOnDependency(Todos, 'visitUrl').and.callFake((url) => {
         expect(url).toEqual(todoLink);
         done();
       });
@@ -33,7 +32,7 @@ describe('Todos', () => {
 
       beforeEach(() => {
         metakeyEvent = $.Event('click', { keyCode: 91, ctrlKey: true });
-        visitUrlSpy = spyOn(urlUtils, 'visitUrl').and.callFake(() => {});
+        visitUrlSpy = spyOnDependency(Todos, 'visitUrl').and.callFake(() => {});
         windowOpenSpy = spyOn(window, 'open').and.callFake(() => {});
       });
 
diff --git a/spec/javascripts/u2f/authenticate_spec.js b/spec/javascripts/u2f/authenticate_spec.js
index 39c47a5c06d..d84b13b07c4 100644
--- a/spec/javascripts/u2f/authenticate_spec.js
+++ b/spec/javascripts/u2f/authenticate_spec.js
@@ -3,7 +3,7 @@ import U2FAuthenticate from '~/u2f/authenticate';
 import 'vendor/u2f';
 import MockU2FDevice from './mock_u2f_device';
 
-describe('U2FAuthenticate', () => {
+describe('U2FAuthenticate', function () {
   preloadFixtures('u2f/authenticate.html.raw');
 
   beforeEach((done) => {
diff --git a/spec/javascripts/u2f/register_spec.js b/spec/javascripts/u2f/register_spec.js
index 136b4cad737..d9383314891 100644
--- a/spec/javascripts/u2f/register_spec.js
+++ b/spec/javascripts/u2f/register_spec.js
@@ -3,7 +3,7 @@ import U2FRegister from '~/u2f/register';
 import 'vendor/u2f';
 import MockU2FDevice from './mock_u2f_device';
 
-describe('U2FRegister', () => {
+describe('U2FRegister', function () {
   preloadFixtures('u2f/register.html.raw');
 
   beforeEach((done) => {
diff --git a/spec/javascripts/vue_mr_widget/components/deployment_spec.js b/spec/javascripts/vue_mr_widget/components/deployment_spec.js
index ff8d54c029f..c82ba61a5b1 100644
--- a/spec/javascripts/vue_mr_widget/components/deployment_spec.js
+++ b/spec/javascripts/vue_mr_widget/components/deployment_spec.js
@@ -1,5 +1,4 @@
 import Vue from 'vue';
-import * as urlUtils from '~/lib/utils/url_utility';
 import deploymentComponent from '~/vue_merge_request_widget/components/deployment.vue';
 import MRWidgetService from '~/vue_merge_request_widget/services/mr_widget_service';
 import { getTimeago } from '~/lib/utils/datetime_utility';
@@ -117,13 +116,13 @@ describe('Deployment component', () => {
       it('should show a confirm dialog and call service.stopEnvironment when confirmed', (done) => {
         spyOn(window, 'confirm').and.returnValue(true);
         spyOn(MRWidgetService, 'stopEnvironment').and.returnValue(returnPromise(true));
-        spyOn(urlUtils, 'visitUrl').and.returnValue(true);
+        const visitUrl = spyOnDependency(deploymentComponent, 'visitUrl').and.returnValue(true);
         vm = mockStopEnvironment();
 
         expect(window.confirm).toHaveBeenCalled();
         expect(MRWidgetService.stopEnvironment).toHaveBeenCalledWith(deploymentMockData.stop_url);
         setTimeout(() => {
-          expect(urlUtils.visitUrl).toHaveBeenCalledWith(url);
+          expect(visitUrl).toHaveBeenCalledWith(url);
           done();
         }, 333);
       });
diff --git a/spec/javascripts/vue_mr_widget/components/states/mr_widget_ready_to_merge_spec.js b/spec/javascripts/vue_mr_widget/components/states/mr_widget_ready_to_merge_spec.js
index 300b7882d03..81c16593eb4 100644
--- a/spec/javascripts/vue_mr_widget/components/states/mr_widget_ready_to_merge_spec.js
+++ b/spec/javascripts/vue_mr_widget/components/states/mr_widget_ready_to_merge_spec.js
@@ -1,7 +1,6 @@
 import Vue from 'vue';
 import ReadyToMerge from '~/vue_merge_request_widget/components/states/ready_to_merge.vue';
 import eventHub from '~/vue_merge_request_widget/event_hub';
-import * as simplePoll from '~/lib/utils/simple_poll';
 
 const commitMessage = 'This is the commit message';
 const commitMessageWithDescription = 'This is the commit message description';
@@ -355,9 +354,9 @@ describe('ReadyToMerge', () => {
 
     describe('initiateMergePolling', () => {
       it('should call simplePoll', () => {
-        spyOn(simplePoll, 'default');
+        const simplePoll = spyOnDependency(ReadyToMerge, 'simplePoll');
         vm.initiateMergePolling();
-        expect(simplePoll.default).toHaveBeenCalled();
+        expect(simplePoll).toHaveBeenCalled();
       });
     });
 
@@ -457,11 +456,11 @@ describe('ReadyToMerge', () => {
     describe('initiateRemoveSourceBranchPolling', () => {
       it('should emit event and call simplePoll', () => {
         spyOn(eventHub, '$emit');
-        spyOn(simplePoll, 'default');
+        const simplePoll = spyOnDependency(ReadyToMerge, 'simplePoll');
 
         vm.initiateRemoveSourceBranchPolling();
         expect(eventHub.$emit).toHaveBeenCalledWith('SetBranchRemoveFlag', [true]);
-        expect(simplePoll.default).toHaveBeenCalled();
+        expect(simplePoll).toHaveBeenCalled();
       });
     });
 
@@ -524,18 +523,20 @@ describe('ReadyToMerge', () => {
     });
 
     describe('when user can merge and can delete branch', () => {
+      let customVm;
+
       beforeEach(() => {
-        this.customVm = createComponent({
+        customVm = createComponent({
           mr: { canRemoveSourceBranch: true },
         });
       });
 
       it('isRemoveSourceBranchButtonDisabled should be false', () => {
-        expect(this.customVm.isRemoveSourceBranchButtonDisabled).toBe(false);
+        expect(customVm.isRemoveSourceBranchButtonDisabled).toBe(false);
       });
 
       it('should be enabled in rendered output', () => {
-        const checkboxElement = this.customVm.$el.querySelector('#remove-source-branch-input');
+        const checkboxElement = customVm.$el.querySelector('#remove-source-branch-input');
         expect(checkboxElement).not.toBeNull();
       });
     });