remove methods property in all unit tests

methods property is deprecated and will be removed (see : vuejs/vue-test-utils#1541) + some refactoring because of warnings in unit tests
nassimerrahoui · Jul 30, 2020 · 845e5ed · 845e5ed
1 parent fa6c25a
commit 845e5ed
Show file tree

Hide file tree

Showing 5 changed files with 38 additions and 40 deletions.
diff --git a/src/test/javascript/spec/app/applications/configuration/configuration.component.spec.ts b/src/test/javascript/spec/app/applications/configuration/configuration.component.spec.ts
@@ -1,4 +1,5 @@
 import { createLocalVue, Wrapper, shallowMount } from '@vue/test-utils';
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
 import ConfigurationService, { Bean, PropertySource } from '@/applications/configuration/configuration.service';
 import ConfigurationClass from '@/applications/configuration/configuration.component';
 import Configuration from '@/applications/configuration/configuration.vue';
@@ -21,6 +22,7 @@ import {
 
 const localVue = createLocalVue();
 const mockedAxios: any = axios;
+localVue.component('font-awesome-icon', FontAwesomeIcon);
 config.initVueApp(localVue);
 const store = config.initVueXStore(localVue);
 
@@ -39,6 +41,8 @@ jest.mock('axios', () => ({
   post: jest.fn(),
 }));
 
+const resetError = jest.fn();
+
 describe('Configuration Component', () => {
   let wrapper: Wrapper<ConfigurationClass>;
   let configuration: ConfigurationClass;
@@ -53,8 +57,8 @@ describe('Configuration Component', () => {
         instanceConfigurationService: () => instanceConfigurationService,
         routesService: () => routesService,
       },
-      methods: {
-        resetError: () => jest.fn(),
+      mocks: {
+        resetError,
       },
     });
     configuration = wrapper.vm;
@@ -66,7 +70,8 @@ describe('Configuration Component', () => {
 
   it('when component is mounted', async () => {
     mockedAxios.get.mockReturnValue(Promise.resolve({ data: jhcc_route }));
-    const refreshActiveRouteBeans = jest.fn();
+    const subscribeRouteChanged = jest.spyOn(routesService.routeChanged$, 'subscribe');
+    const subscribeRoutesChanged = jest.spyOn(routesService.routesChanged$, 'subscribe');
     const wrapperToTestMounted = shallowMount<ConfigurationClass>(Configuration, {
       store,
       localVue,
@@ -75,17 +80,15 @@ describe('Configuration Component', () => {
         instanceConfigurationService: () => instanceConfigurationService,
         routesService: () => routesService,
       },
-      methods: {
-        refreshActiveRouteBeans,
-      },
     });
     const configurationToTestMounted = wrapperToTestMounted.vm;
     await configurationToTestMounted.$nextTick();
 
+    expect(subscribeRouteChanged).toHaveBeenCalled();
+    expect(subscribeRoutesChanged).toHaveBeenCalled();
     expect(configurationToTestMounted.beansFilter).toBe('');
     expect(configurationToTestMounted.orderProp).toBe('name');
     expect(configurationToTestMounted.beansAscending).toBe(true);
-    expect(refreshActiveRouteBeans).toHaveBeenCalledTimes(1);
   });
 
   it('should refresh beans and property sources of active route', async () => {

diff --git a/src/test/javascript/spec/app/applications/health/health-modal.component.spec.ts b/src/test/javascript/spec/app/applications/health/health-modal.component.spec.ts
@@ -72,10 +72,6 @@ describe('Health Modal Component for diskSpace', () => {
     healthModal = wrapper.vm;
   });
 
-  it('should be a Vue instance', () => {
-    expect(wrapper.isVueInstance()).toBeTruthy();
-  });
-
   describe('readableValue should transform data', () => {
     it('to GB when needed', () => {
       const result = healthModal.readableValue(2147483648);

diff --git a/src/test/javascript/spec/app/applications/health/health.component.spec.ts b/src/test/javascript/spec/app/applications/health/health.component.spec.ts
@@ -32,6 +32,8 @@ jest.mock('axios', () => ({
   post: jest.fn(),
 }));
 
+const resetError = jest.fn();
+
 describe('Health Component', () => {
   let wrapper: Wrapper<HealthClass>;
   let health: HealthClass;
@@ -48,8 +50,8 @@ describe('Health Component', () => {
         instanceHealthService: () => instanceHealthService,
         routesService: () => routesService,
       },
-      methods: {
-        resetError: () => jest.fn(),
+      mocks: {
+        resetError,
       },
     });
     health = wrapper.vm;
@@ -61,7 +63,8 @@ describe('Health Component', () => {
 
   it('when component is mounted', async () => {
     mockedAxios.get.mockReturnValue(Promise.resolve({}));
-    const refreshActiveRouteHealth = jest.fn();
+    const subscribeRouteChanged = jest.spyOn(routesService.routeChanged$, 'subscribe');
+    const subscribeRoutesChanged = jest.spyOn(routesService.routesChanged$, 'subscribe');
     const wrapperToTestMounted = shallowMount<HealthClass>(Health, {
       store,
       localVue,
@@ -72,14 +75,12 @@ describe('Health Component', () => {
         instanceHealthService: () => instanceHealthService,
         routesService: () => routesService,
       },
-      methods: {
-        refreshActiveRouteHealth,
-      },
     });
     const healthToTestMounted = wrapperToTestMounted.vm;
     await healthToTestMounted.$nextTick();
 
-    expect(refreshActiveRouteHealth).toHaveBeenCalled();
+    expect(subscribeRouteChanged).toHaveBeenCalled();
+    expect(subscribeRoutesChanged).toHaveBeenCalled();
     expect(healthToTestMounted.activeRoute).toBe(jhcc_route);
     expect(healthToTestMounted.routes).toBe(routes);
   });

diff --git a/src/test/javascript/spec/app/applications/instance/instance.component.spec.ts b/src/test/javascript/spec/app/applications/instance/instance.component.spec.ts
@@ -1,4 +1,4 @@
-import { createLocalVue, Wrapper, mount } from '@vue/test-utils';
+import { createLocalVue, Wrapper, mount, shallowMount } from '@vue/test-utils';
 import axios from 'axios';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
 import * as config from '@/shared/config/config';
@@ -13,12 +13,11 @@ import { inst, instanceList, instancesRoute, stubbedModal } from '../../../fixtu
 
 const localVue = createLocalVue();
 const mockedAxios: any = axios;
-
-config.initVueApp(localVue);
 localVue.component('font-awesome-icon', FontAwesomeIcon);
 localVue.component('instance-modal', InstanceModal);
 localVue.directive('b-modal', {});
 localVue.use(BootstrapVue);
+config.initVueApp(localVue);
 
 const store = config.initVueXStore(localVue);
 const instanceService = new InstanceService();
@@ -56,10 +55,8 @@ describe('Instance Component', () => {
   });
 
   it('when component is mounted', async () => {
-    const refreshInstancesData = jest.fn();
-    const refreshInstancesRoute = jest.fn();
-
-    mount<InstanceClass>(InstanceVue, {
+    const subscribeRefreshReload = jest.spyOn(refreshService.refreshReload$, 'subscribe');
+    shallowMount<InstanceClass>(InstanceVue, {
       localVue,
       stubs: {
         bModal: stubbedModal,
@@ -68,14 +65,8 @@ describe('Instance Component', () => {
         instanceService: () => instanceService,
         refreshService: () => refreshService,
       },
-      methods: {
-        refreshInstancesData,
-        refreshInstancesRoute,
-      },
     });
-
-    expect(refreshInstancesData).toHaveBeenCalledTimes(2);
-    expect(refreshInstancesRoute).toHaveBeenCalledTimes(2);
+    expect(subscribeRefreshReload).toHaveBeenCalled();
   });
 
   it('should refresh instances list', async () => {

diff --git a/src/test/javascript/spec/app/applications/logfile/logfile.component.spec.ts b/src/test/javascript/spec/app/applications/logfile/logfile.component.spec.ts
@@ -1,4 +1,4 @@
-import { shallowMount, createLocalVue, Wrapper } from '@vue/test-utils';
+import { shallowMount, createLocalVue, Wrapper, mount } from '@vue/test-utils';
 import * as config from '@/shared/config/config';
 import axios from 'axios';
 import RoutesService from '@/shared/routes/routes.service';
@@ -29,6 +29,8 @@ jest.mock('axios', () => ({
   post: jest.fn(),
 }));
 
+const resetError = jest.fn();
+
 describe('Logfile Component', () => {
   let wrapper: Wrapper<LogfileClass>;
   let logfile: LogfileClass;
@@ -43,16 +45,21 @@ describe('Logfile Component', () => {
         refreshService: () => refreshService,
         routesService: () => routesService,
       },
-      methods: {
-        resetError: () => jest.fn(),
+      mocks: {
+        resetError,
       },
     });
     logfile = wrapper.vm;
   });
 
+  afterAll(() => {
+    logfile.beforeDestroy();
+  });
+
   it('when component is mounted', async () => {
     mockedAxios.get.mockReturnValue(Promise.resolve({}));
-    const refreshActiveRouteLog = jest.fn();
+    const subscribeRouteChanged = jest.spyOn(routesService.routeChanged$, 'subscribe');
+    const subscribeRoutesChanged = jest.spyOn(routesService.routesChanged$, 'subscribe');
     const wrapperToTestMounted = shallowMount<LogfileClass>(Logfile, {
       store,
       localVue,
@@ -61,16 +68,16 @@ describe('Logfile Component', () => {
         refreshService: () => refreshService,
         routesService: () => routesService,
       },
-      methods: {
-        refreshActiveRouteLog,
-      },
     });
     const logfileToTestMounted = wrapperToTestMounted.vm;
     await logfileToTestMounted.$nextTick();
 
-    expect(refreshActiveRouteLog).toHaveBeenCalled();
+    expect(subscribeRouteChanged).toHaveBeenCalled();
+    expect(subscribeRoutesChanged).toHaveBeenCalled();
     expect(logfileToTestMounted.activeRoute).toBe(jhcc_route);
     expect(logfileToTestMounted.routes).toBe(routes);
+    subscribeRouteChanged.mockRestore();
+    subscribeRoutesChanged.mockRestore();
   });
 
   it('should refresh logFileContent of selected route', async () => {