@webitel/ui-sdk 3.1.66 → 3.1.68

package/src/modules/QueryFilters/components/__tests__/filter-from-to.spec.js

@@ -1,20 +1,20 @@
-import { createLocalVue, shallowMount } from '@vue/test-utils';
-import VueRouter from 'vue-router';
-import Vuex from 'vuex';
+import { shallowMount } from '@vue/test-utils';
+import { createStore } from 'vuex';
+import { createRouter, createWebHistory } from 'vue-router';
 import BaseFilterSchema from '../../classes/BaseFilterSchema';
 import baseFilterMixin from '../../mixins/baseFilterMixin/baseFilterMixin';
 import FilterFromTo from '../filter-from-to.vue';
 
-const localVue = createLocalVue();
-localVue.use(Vuex);
-localVue.use(VueRouter);
-const router = new VueRouter();
+const router = createRouter({
+  history: createWebHistory(),
+  routes: [{ path: '/', name: 'jest' }],
+});
 
 describe('FilterFromTo Filter', () => {
   const namespace = 'jest';
   const filterQuery = 'jest';
   const filterSchema = new BaseFilterSchema();
-  const store = new Vuex.Store({
+  const store = createStore({
     modules: {
       [namespace]: {
         namespaced: true,
@@ -26,9 +26,7 @@ describe('FilterFromTo Filter', () => {
   });
 
   const mountOptions = {
-    localVue,
-    store,
-    router,
+    global: { plugins: [store, router] },
     props: {
       namespace,
       filterQuery,

package/src/modules/QueryFilters/components/__tests__/filter-search.spec.js

@@ -1,20 +1,20 @@
-import { shallowMount, createLocalVue } from '@vue/test-utils';
-import Vuex from 'vuex';
-import VueRouter from 'vue-router';
+import { shallowMount } from '@vue/test-utils';
+import { createStore } from 'vuex';
+import { createRouter, createWebHistory } from 'vue-router';
 import SearchFilter from '../filter-search.vue';
 import BaseFilterSchema from '../../classes/BaseFilterSchema';
 import baseFilterMixin from '../../mixins/baseFilterMixin/baseFilterMixin';
 
-const localVue = createLocalVue();
-localVue.use(Vuex);
-localVue.use(VueRouter);
-const router = new VueRouter();
+const router = createRouter({
+  history: createWebHistory(),
+  routes: [{ path: '/', name: 'jest' }],
+});
 
 describe('Search Filter', () => {
   const namespace = 'jest';
   const filterQuery = 'jest';
   const filterSchema = new BaseFilterSchema();
-  const store = new Vuex.Store({
+  const store = createStore({
     modules: {
       [namespace]: {
         namespaced: true,
@@ -26,9 +26,7 @@ describe('Search Filter', () => {
   });
 
   const mountOptions = {
-    localVue,
-    store,
-    router,
+    global: { plugins: [store, router] },
     props: {
       namespace,
       filterQuery,

package/src/modules/QueryFilters/mixins/__tests__/apiFilterMixin.spec.js

@@ -1,11 +1,13 @@
-import { createLocalVue, shallowMount } from '@vue/test-utils';
-import VueRouter from 'vue-router';
+import { shallowMount } from '@vue/test-utils';
+import { createRouter, createWebHistory } from 'vue-router';
 import ApiFilterSchema from '../../classes/ApiFilterSchema';
 import apiFilterMixin from '../apiFilterMixin';
 
-const localVue = createLocalVue();
-localVue.use(VueRouter);
-const router = new VueRouter();
+const router = createRouter({
+  history: createWebHistory(),
+  routes: [{ path: '/', name: 'jest' }],
+});
+
 const team = ['1', '2'];
 const filterSchema = new ApiFilterSchema();
 
@@ -23,24 +25,22 @@ describe('API filter mixin', () => {
     methods: { setValue },
   };
 
-  beforeEach(() => {
+  beforeEach(async () => {
     setValue.mockClear();
-    if (Object.keys(router.currentRoute.query).length) router.replace({ query: null });
+    await router.replace({ query: null });
   });
 
   it('Correctly sets value from $route query', async () => {
     await router.replace({ query: { team } });
     const wrapper = shallowMount(Component, {
-      localVue,
-      router,
+      global: { plugins: [router] },
     });
     expect(setValue).toHaveBeenCalledWith({ filter: 'team', value: [{ id: team[0] }, { id: team[1] }] });
   });
 
   it('Sets empty array value if $route query is empty', async () => {
     const wrapper = shallowMount(Component, {
-      localVue,
-      router,
+      global: { plugins: [router] },
       data: () => ({ filterQuery: 'queue' }),
     });
     expect(setValue).not.toHaveBeenCalled();

package/src/modules/QueryFilters/mixins/__tests__/enumFilterMixin.spec.js

@@ -1,5 +1,5 @@
-import { createLocalVue, shallowMount } from '@vue/test-utils';
-import VueRouter from 'vue-router';
+import { shallowMount } from '@vue/test-utils';
+import { createRouter, createWebHistory } from 'vue-router';
 import enumFilterMixin from '../enumFilterMixin';
 
 const options = [{
@@ -11,9 +11,10 @@ const options = [{
     value: 'outbound',
   }];
 
-const localVue = createLocalVue();
-localVue.use(VueRouter);
-const router = new VueRouter();
+const router = createRouter({
+  history: createWebHistory(),
+  routes: [{ path: '/', name: 'jest' }],
+});
 
 describe('Enum filter mixin', () => {
   const setValue = jest.fn();
@@ -29,16 +30,15 @@ describe('Enum filter mixin', () => {
     methods: { setValue },
   };
 
-  beforeEach(() => {
+  beforeEach(async () => {
     setValue.mockClear();
-    if (Object.keys(router.currentRoute.query).length) router.replace({ query: null });
+    await router.replace({ query: null });
   });
 
   it('Correctly sets value from $route query', async () => {
     await router.replace({ query: { direction: options[0].value } });
     const wrapper = shallowMount(Component, {
-      localVue,
-      router,
+      global: { plugins: [router] },
     });
     await wrapper.vm.$nextTick();
     expect(setValue).toHaveBeenCalledWith({ filter: 'direction', value: options[0] });
@@ -46,8 +46,7 @@ describe('Enum filter mixin', () => {
 
   it('Sets empty array value if $route query is empty', async () => {
     shallowMount(Component, {
-      localVue,
-      router,
+      global: { plugins: [router] },
     });
     expect(setValue).not.toHaveBeenCalled();
   });
@@ -61,8 +60,7 @@ describe('Enum filter mixin', () => {
       name: options[0].locale,
     }];
     const wrapper = shallowMount(Component, {
-      localVue,
-      router,
+      global: { plugins: [router] },
       data: () => ({ options }),
     });
     expect(wrapper.vm.localizedOptions).toEqual(expectedOptions);

package/src/modules/QueryFilters/mixins/__tests__/paginationFilterMixin.spec.js

@@ -1,10 +1,12 @@
-import { createLocalVue, shallowMount } from '@vue/test-utils';
-import VueRouter from 'vue-router';
+import { shallowMount } from '@vue/test-utils';
+import { createRouter, createWebHistory } from 'vue-router';
 import paginationFilterMixin from '../paginationFilterMixin';
 
-const localVue = createLocalVue();
-localVue.use(VueRouter);
-const router = new VueRouter();
+const router = createRouter({
+  history: createWebHistory(),
+  routes: [{ path: '/', name: 'jest' }],
+});
+
 const page = 2;
 const size = 20;
 
@@ -19,17 +21,16 @@ describe('Pagination filter mixin', () => {
     methods: { setPage, setSize },
   };
 
-  beforeEach(() => {
+  beforeEach(async () => {
     setPage.mockClear();
     setSize.mockClear();
-    if (Object.keys(router.currentRoute.query).length) router.replace({ query: null });
+    await router.replace({ query: null });
   });
 
   it('Correctly sets value from $route query', async () => {
     await router.replace({ query: { page, size } });
     wrapper = shallowMount(Component, {
-      localVue,
-      router,
+      global: { plugins: [router] },
     });
     expect(setPage).toHaveBeenCalledWith(page);
     expect(setSize).toHaveBeenCalledWith(size);
@@ -38,11 +39,9 @@ describe('Pagination filter mixin', () => {
   it('At "prev" page, changes query and emits event', async () => {
     await router.replace({ query: { page, size } });
     wrapper = shallowMount(Component, {
-      localVue,
-      router,
+      global: { plugins: [router] },
     });
-    wrapper._emitted.input = []; // reset emitted events
-    wrapper.vm.prev();
+    await wrapper.vm.prev();
     expect(wrapper.emitted().input).toBeTruthy();
     expect(wrapper.vm.$route.query.page).toBe(`${page - 1}`);
   });
@@ -50,11 +49,9 @@ describe('Pagination filter mixin', () => {
   it('At "next" page, changes query and emits event', async () => {
     await router.replace({ query: { page, size } });
     wrapper = shallowMount(Component, {
-      localVue,
-      router,
+      global: { plugins: [router] },
     });
-    wrapper._emitted.input = []; // reset emitted events
-    wrapper.vm.next();
+    await wrapper.vm.next();
     expect(wrapper.emitted().input).toBeTruthy();
     expect(wrapper.vm.$route.query.page).toBe(`${page + 1}`);
   });
@@ -62,11 +59,9 @@ describe('Pagination filter mixin', () => {
   it('At "restPage" method, changes query and emits event', async () => {
     await router.replace({ query: { page: 100, size } });
     wrapper = shallowMount(Component, {
-      localVue,
-      router,
+      global: { plugins: [router] },
     });
-    wrapper._emitted.input = []; // reset emitted events
-    wrapper.vm.resetPage();
+    await wrapper.vm.resetPage();
     expect(wrapper.emitted().input).toBeTruthy();
     expect(wrapper.vm.$route.query.page).toBe('1');
   });
@@ -75,11 +70,9 @@ describe('Pagination filter mixin', () => {
     const newSize = 40;
     await router.replace({ query: { page, size } });
     wrapper = shallowMount(Component, {
-      localVue,
-      router,
+      global: { plugins: [router] },
     });
-    wrapper._emitted.input = []; // reset emitted events
-    wrapper.vm.sizeChange(newSize);
+    await wrapper.vm.sizeChange(newSize);
     expect(wrapper.emitted().input).toBeTruthy();
     expect(wrapper.vm.$route.query.size).toBe(`${newSize}`);
   });

package/src/modules/QueryFilters/mixins/__tests__/sortFilterMixin.spec.js

@@ -1,10 +1,11 @@
-import { shallowMount, createLocalVue } from '@vue/test-utils';
-import VueRouter from 'vue-router';
+import { shallowMount } from '@vue/test-utils';
+import { createRouter, createWebHistory } from 'vue-router';
 import sortFilterMixin from '../sortFilterMixin';
 
-const localVue = createLocalVue();
-localVue.use(VueRouter);
-const router = new VueRouter();
+const router = createRouter({
+  history: createWebHistory(),
+  routes: [{ path: '/', name: 'jest' }],
+});
 
 const headers = [{
   value: 'queue',
@@ -39,18 +40,22 @@ describe('Sort filter mixin', () => {
     methods: { setHeaders },
   };
 
-  beforeEach(() => {
-    router.replace('/');
+  beforeEach(async () => {
+    await router.replace('/');
   });
 
   it('Correctly sets value from $route query', async () => {
     await router.replace({ path: '/', query: { sort: '+queue' } });
-    const wrapper = shallowMount(Component, { localVue, router });
+    const wrapper = shallowMount(Component, {
+      global: { plugins: [router] },
+    });
     expect(setHeaders).toHaveBeenCalledWith(sortedHeaders);
   });
 
   it('After "sort" trigger, header column sort value changes properly', () => {
-    const wrapper = shallowMount(Component, { localVue, router });
+    const wrapper = shallowMount(Component, {
+      global: { plugins: [router] },
+    });
     const queue = wrapper.vm.headers.find((header) => header.value === 'queue');
     wrapper.vm.sort(queue);
     expect(setHeaders).toHaveBeenCalledWith(sortedHeaders);

package/src/modules/QueryFilters/mixins/__tests__/urlControllerMixin.spec.js

@@ -1,12 +1,12 @@
-import { shallowMount, createLocalVue } from '@vue/test-utils';
-import VueRouter from 'vue-router';
+import { shallowMount } from '@vue/test-utils';
+import { createRouter, createWebHistory } from 'vue-router';
 import _urlControllerMixin from '../_urlControllerMixin/_urlControllerMixin';
 
-const localVue = createLocalVue();
-localVue.use(VueRouter);
-const router = new VueRouter();
+const router = createRouter({
+  history: createWebHistory(),
+  routes: [{ path: '/', name: 'jest' }],
+});
 
-const $t = () => {};
 const filterQuery = 'team';
 
 describe('URL Controller mixin Set and Get operations', () => {
@@ -16,32 +16,30 @@ describe('URL Controller mixin Set and Get operations', () => {
     mixins: [_urlControllerMixin],
   };
 
-  beforeEach(() => {
-    router.replace('/');
+  beforeEach(async () => {
+    await router.replace('/');
     wrapper = shallowMount(Component, {
-      localVue,
-      router,
-      mocks: { $t },
+      global: { plugins: [router] },
     });
   });
 
   it('Array of objects', async () => {
     const value = [{ name: 'team 1', id: '1' }, { name: 'team 2', id: '2' }];
-    wrapper.vm.setValueToQuery({ filterQuery, value });
+    await wrapper.vm.setValueToQuery({ filterQuery, value });
     const queryValue = wrapper.vm.getValueFromQuery({ filterQuery });
     expect(queryValue).toEqual(['1', '2']);
   });
 
   it('Array of values', async () => {
     const value = ['hello', '1'];
-    wrapper.vm.setValueToQuery({ filterQuery, value });
+    await wrapper.vm.setValueToQuery({ filterQuery, value });
     const queryValue = wrapper.vm.getValueFromQuery({ filterQuery });
     expect(queryValue).toEqual(value);
   });
 
   it('String value', async () => {
     const value = 'hello there';
-    wrapper.vm.setValueToQuery({ filterQuery, value });
+    await wrapper.vm.setValueToQuery({ filterQuery, value });
     const queryValue = wrapper.vm.getValueFromQuery({ filterQuery });
     expect(queryValue).toEqual(value);
   });

package/src/modules/QueryFilters/mixins/paginationFilterMixin.js

@@ -38,7 +38,7 @@ export default {
       this.$emit('input');
       const value = this.page + 1;
       this.setPage(value);
-      this.setValueToQuery({
+      return this.setValueToQuery({
         filterQuery: 'page',
         value,
       });
@@ -48,7 +48,7 @@ export default {
       this.$emit('input');
       const value = this.page - 1;
       this.setPage(value);
-      this.setValueToQuery({
+      return this.setValueToQuery({
         filterQuery: 'page',
         value,
       });
@@ -58,7 +58,7 @@ export default {
       this.$emit('input');
       const value = 1;
       this.setPage(value);
-      this.setValueToQuery({
+      return this.setValueToQuery({
         filterQuery: 'page',
         value,
       });
@@ -67,7 +67,7 @@ export default {
     sizeChange(value) {
       this.$emit('input');
       this.setSize(value);
-      this.setValueToQuery({
+      return this.setValueToQuery({
         filterQuery: 'size',
         value,
       });

package/src/scripts/eventBus.js

@@ -5,4 +5,4 @@ export default {
   $once: (...args) => emitter.once(...args),
   $off: (...args) => emitter.off(...args),
   $emit: (...args) => emitter.emit(...args),
-}
+};