test(auto-progress-bar): fix test after Vue3 update

empathyco · Aug 1, 2024 · a80e521 · a80e521
1 parent 7875ff5
commit a80e521
Show file tree

Hide file tree

Showing 5 changed files with 1,820 additions and 2,404 deletions.
diff --git a/packages/x-components/package.json b/packages/x-components/package.json
@@ -120,7 +120,7 @@
     "rollup-plugin-delete": "~2.0.0",
     "rollup-plugin-styles": "~4.0.0",
     "rollup-plugin-typescript2": "~0.36.0",
-    "rollup-plugin-vue": "~5.1.9",
+    "rollup-plugin-vue": "~6.0.0",
     "sass": "~1.70.0",
     "start-server-and-test": "~2.0.0",
     "tailwindcss": "~3.4.0",

diff --git a/packages/x-components/src/__tests__/utils.ts b/packages/x-components/src/__tests__/utils.ts
@@ -1,7 +1,6 @@
 import { deepMerge } from '@empathyco/x-deep-merge';
 import { DeepPartial, Dictionary } from '@empathyco/x-utils';
-import { createLocalVue, Wrapper, WrapperArray } from '@vue/test-utils';
-import Vue from 'vue';
+import { DOMWrapper, VueWrapper } from '@vue/test-utils';
 import { Store } from 'vuex';
 import {
   XComponentsAdapter,
@@ -69,7 +68,7 @@ export function getDataTestSelector(dataTest: string): string {
  *
  * @returns The wrappers matching the searched test data id.
  */
-export function findTestDataById(wrapper: Wrapper<Vue>, testDataId: string): WrapperArray<Vue> {
+export function findTestDataById(wrapper: VueWrapper, testDataId: string): DOMWrapper<Element>[] {
   return wrapper.findAll(getDataTestSelector(testDataId));
 }
 
@@ -194,16 +193,16 @@ function mergeStates<State extends Dictionary>(
  */
 export function installNewXPlugin(
   options: Partial<XPluginOptions> = {},
-  localVue: typeof Vue = createLocalVue(),
+  localVue: undefined = undefined,
   bus = new XDummyBus()
-): [XPlugin, typeof Vue] {
+): [XPlugin, undefined] {
   XPlugin.resetInstance();
   const xPlugin = new XPlugin(bus);
-  const installOptions: XPluginOptions = {
-    adapter: XComponentsAdapterDummy,
-    ...options
-  };
-  localVue.use(xPlugin, installOptions);
+  // const installOptions: XPluginOptions = {
+  //   adapter: XComponentsAdapterDummy,
+  //   ...options
+  // };
+  // localVue.use(xPlugin, installOptions);
   return [xPlugin, localVue];
 }
 

diff --git a/packages/x-components/src/components/__tests__/auto-progress-bar.spec.ts b/packages/x-components/src/components/__tests__/auto-progress-bar.spec.ts
@@ -1,4 +1,4 @@
-import { mount, Wrapper } from '@vue/test-utils';
+import { mount, VueWrapper } from '@vue/test-utils';
 import { getDataTestSelector } from '../../__tests__/utils';
 import AutoProgressBar from '../auto-progress-bar.vue';
 
@@ -70,5 +70,5 @@ interface RenderBaseAutoProgressBarOptions {
  */
 interface RenderAutoProgressBarAPI {
   /** The wrapper for the progress bar component. */
-  wrapper: Wrapper<Vue>;
+  wrapper: VueWrapper;
 }
diff --git a/packages/x-components/src/plugins/x-emitters.ts b/packages/x-components/src/plugins/x-emitters.ts
@@ -6,6 +6,7 @@ import { AnySimpleStateSelector, AnyStateSelector } from '../store/utils/store-e
 import { XEventPayload, XEventsTypes } from '../wiring/events.types';
 import { WireMetadata } from '../wiring/wiring.types';
 import { AnyXModule } from '../x-modules/x-modules.types';
+import { WatchOptionsBase } from 'vue';
 
 /**
  * Registers the store emitters, making them emit the event when the part of the state selected
@@ -57,14 +58,15 @@ export function registerStoreEmitters(
  */
 function normalizeStateSelector(
   stateSelector: AnySimpleStateSelector | AnyStateSelector
-): Required<AnyStateSelector> {
+): Required<Omit<AnyStateSelector, keyof WatchOptionsBase>> {
   const selectorOptions = isSimpleSelector(stateSelector)
     ? { selector: stateSelector }
     : stateSelector;
 
   return {
     deep: false,
     immediate: false,
+    once: false,
     filter: () => true,
     metadata: {
       replaceable: true