Merge branch 'fix-karma-test-utils-master-overflow' into 'master'

CE Move serverless karma specs to jest

Closes #60154

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

spec/javascripts/serverless/components/area_spec.js → spec/frontend/serverless/components/area_spec.js

@@ -16,6 +16,7 @@ describe('Area component', () => {
       slots: {
         default: mockWidgets,
       },
+      sync: false,
     });
   });
 
@@ -67,7 +68,7 @@ describe('Area component', () => {
       const mockWidth = 233;
 
       beforeEach(() => {
-        spyOn(Element.prototype, 'getBoundingClientRect').and.callFake(() => ({
+        jest.spyOn(Element.prototype, 'getBoundingClientRect').mockImplementation(() => ({
           width: mockWidth,
         }));
         areaChart.vm.onResize();

spec/javascripts/serverless/components/environment_row_spec.js → spec/frontend/serverless/components/environment_row_spec.js

@@ -5,7 +5,7 @@ import { mockServerlessFunctions, mockServerlessFunctionsDiffEnv } from '../mock
 import { translate } from '~/serverless/utils';
 
 const createComponent = (localVue, env, envName) =>
-  shallowMount(environmentRowComponent, { localVue, propsData: { env, envName } }).vm;
+  shallowMount(environmentRowComponent, { localVue, propsData: { env, envName }, sync: false }).vm;
 
 describe('environment row component', () => {
   describe('default global cluster case', () => {

spec/javascripts/serverless/components/function_details_spec.js → spec/frontend/serverless/components/function_details_spec.js

@@ -41,6 +41,7 @@ describe('functionDetailsComponent', () => {
           clustersPath: '/clusters',
           helpPath: '/help',
         },
+        sync: false,
       });
 
       expect(
@@ -68,6 +69,7 @@ describe('functionDetailsComponent', () => {
           clustersPath: '/clusters',
           helpPath: '/help',
         },
+        sync: false,
       });
 
       expect(component.vm.$el.querySelector('p').innerHTML.trim()).toContain('1 pod in use');
@@ -85,6 +87,7 @@ describe('functionDetailsComponent', () => {
           clustersPath: '/clusters',
           helpPath: '/help',
         },
+        sync: false,
       });
 
       expect(component.vm.$el.querySelector('p').innerHTML.trim()).toContain('3 pods in use');
@@ -102,6 +105,7 @@ describe('functionDetailsComponent', () => {
           clustersPath: '/clusters',
           helpPath: '/help',
         },
+        sync: false,
       });
 
       expect(

spec/javascripts/serverless/components/function_row_spec.js → spec/frontend/serverless/components/function_row_spec.js

@@ -3,7 +3,8 @@ import { shallowMount } from '@vue/test-utils';
 
 import { mockServerlessFunction } from '../mock_data';
 
-const createComponent = func => shallowMount(functionRowComponent, { propsData: { func } }).vm;
+const createComponent = func =>
+  shallowMount(functionRowComponent, { propsData: { func }, sync: false }).vm;
 
 describe('functionRowComponent', () => {
   it('Parses the function details correctly', () => {

spec/javascripts/serverless/components/functions_spec.js → spec/frontend/serverless/components/functions_spec.js

 import Vuex from 'vuex';
-
+import AxiosMockAdapter from 'axios-mock-adapter';
+import axios from '~/lib/utils/axios_utils';
 import functionsComponent from '~/serverless/components/functions.vue';
 import { createLocalVue, shallowMount } from '@vue/test-utils';
 import { createStore } from '~/serverless/store';
@@ -79,15 +80,19 @@ describe('functionsComponent', () => {
     );
   });
 
-  it('should render the functions list', () => {
+  fit('should render the functions list', () => {
+    const statusPath = 'statusPath';
+    const axiosMock = new AxiosMockAdapter(axios);
+    axiosMock.onGet(statusPath).reply(200);
+
     component = shallowMount(functionsComponent, {
       localVue,
       store,
       propsData: {
         installed: true,
-        clustersPath: '',
-        helpPath: '',
-        statusPath: '',
+        clustersPath: 'clustersPath',
+        helpPath: 'helpPath',
+        statusPath,
       },
       sync: false,
     });

spec/javascripts/serverless/components/missing_prometheus_spec.js → spec/frontend/serverless/components/missing_prometheus_spec.js

@@ -8,6 +8,7 @@ const createComponent = missingData =>
       helpPath: '/help',
       missingData,
     },
+    sync: false,
   }).vm;
 
 describe('missingPrometheusComponent', () => {

spec/javascripts/serverless/components/pod_box_spec.js → spec/frontend/serverless/components/pod_box_spec.js

@@ -6,6 +6,7 @@ const createComponent = count =>
     propsData: {
       count,
     },
+    sync: false,
   }).vm;
 
 describe('podBoxComponent', () => {

spec/javascripts/serverless/components/url_spec.js → spec/frontend/serverless/components/url_spec.js

@@ -7,6 +7,7 @@ const createComponent = uri =>
     propsData: {
       uri,
     },
+    sync: false,
   }).vm;
 
 describe('urlComponent', () => {

spec/javascripts/serverless/store/actions_spec.js → spec/frontend/serverless/store/actions_spec.js

@@ -32,7 +32,9 @@ describe('ServerlessActions', () => {
     it('should successfully retry', done => {
       const endpoint = '/functions';
       const mock = new MockAdapter(axios);
-      mock.onGet(endpoint).reply(statusCodes.NO_CONTENT);
+      mock
+        .onGet(endpoint)
+        .reply(() => new Promise(resolve => setTimeout(() => resolve(200), Infinity)));
 
       testAction(
         fetchFunctions,