@nuxt/test-utils-nightly 3.21.1-20251219-125305-c6e4b78 → 3.22.0-20251231-204746-58773a7

package/dist/runtime-utils/index.d.mts

@@ -1,8 +1,8 @@
 import { EventHandler, HTTPMethod } from 'h3';
 import { SetupContext, RenderFunction, ComputedOptions, MethodOptions, ComponentOptionsMixin, EmitsOptions, ComponentInjectOptions, ComponentOptionsWithoutProps, ComponentOptionsWithArrayProps, ComponentPropsOptions, ComponentOptionsWithObjectProps } from 'vue';
-import { ComponentMountingOptions, mount } from '@vue/test-utils';
+import { mount } from '@vue/test-utils';
 import { RouteLocationRaw } from 'vue-router';
-import { RenderOptions, RenderResult } from '@testing-library/vue';
+import { render } from '@testing-library/vue';
 
 type Awaitable<T> = T | Promise<T>;
 type OptionalFunction<T> = T | (() => Awaitable<T>);
@@ -95,14 +95,26 @@ declare function mockComponent<Props = {}, RawBindings = {}, D = {}, C extends C
 declare function mockComponent<PropNames extends string, RawBindings, D, C extends ComputedOptions = {}, M extends MethodOptions = {}, Mixin extends ComponentOptionsMixin = ComponentOptionsMixin, Extends extends ComponentOptionsMixin = ComponentOptionsMixin, E extends EmitsOptions = {}, EE extends string = string, I extends ComponentInjectOptions = {}, II extends string = string>(path: string, options: OptionalFunction<ComponentOptionsWithArrayProps<PropNames, RawBindings, D, C, M, Mixin, Extends, E, EE, I, II>>): void;
 declare function mockComponent<PropsOptions extends Readonly<ComponentPropsOptions>, RawBindings, D, C extends ComputedOptions = {}, M extends MethodOptions = {}, Mixin extends ComponentOptionsMixin = ComponentOptionsMixin, Extends extends ComponentOptionsMixin = ComponentOptionsMixin, E extends EmitsOptions = {}, EE extends string = string, I extends ComponentInjectOptions = {}, II extends string = string>(path: string, options: OptionalFunction<ComponentOptionsWithObjectProps<PropsOptions, RawBindings, D, C, M, Mixin, Extends, E, EE, I, II>>): void;
 
-type MountSuspendedOptions<T> = ComponentMountingOptions<T> & {
+type SetupState = Record<string, any>;
+type WrapperFnComponent<Fn> = Fn extends (c: infer C, o: infer _) => infer _ ? C : never;
+type WrapperFnOption<Fn> = Fn extends (c: WrapperFnComponent<Fn>, o: infer O) => infer _ ? O : never;
+type WrapperFnResult<Fn> = Fn extends (c: WrapperFnComponent<Fn>, o: WrapperFnOption<Fn>) => infer R ? R : never;
+type WrapperSuspendedOptions<Fn> = WrapperFnOption<Fn> & {
     route?: RouteLocationRaw;
     scoped?: boolean;
 };
-type MountSuspendedResult<T> = ReturnType<typeof mount<T>> & {
-    setupState: SetupState$1;
+type WrapperSuspendedResult<Fn> = WrapperFnResult<Fn> & {
+    setupState: SetupState;
 };
-type SetupState$1 = Record<string, any>;
+declare global {
+    interface Window {
+        __cleanup?: Array<() => void>;
+    }
+}
+
+type WrapperFn$1<C> = typeof mount<C>;
+type WrapperOptions$1<C> = WrapperSuspendedOptions<WrapperFn$1<C>>;
+type WrapperResult$1<C> = WrapperSuspendedResult<WrapperFn$1<C>>;
 /**
  * `mountSuspended` allows you to mount any vue component within the Nuxt environment, allowing async setup and access to injections from your Nuxt plugins. For example:
  *
@@ -129,18 +141,11 @@ type SetupState$1 = Record<string, any>;
  * @param component the component to be tested
  * @param options optional options to set up your component
  */
-declare function mountSuspended<T>(component: T, options?: MountSuspendedOptions<T>): Promise<MountSuspendedResult<T>>;
-declare global {
-    var __cleanup: Array<() => void> | undefined;
-}
+declare function mountSuspended<T>(component: T, options?: WrapperOptions$1<T>): Promise<WrapperResult$1<T>>;
 
-type RenderSuspendeOptions<T> = RenderOptions<T> & {
-    route?: RouteLocationRaw;
-};
-type RenderSuspendeResult = RenderResult & {
-    setupState: SetupState;
-};
-type SetupState = Record<string, any>;
+type WrapperFn<C> = typeof render<C>;
+type WrapperOptions<C> = WrapperSuspendedOptions<WrapperFn<C>>;
+type WrapperResult<C> = WrapperSuspendedResult<WrapperFn<C>>;
 /**
  * `renderSuspended` allows you to mount any vue component within the Nuxt environment, allowing async setup and access to injections from your Nuxt plugins.
  *
@@ -171,11 +176,6 @@ type SetupState = Record<string, any>;
  * @param component the component to be tested
  * @param options optional options to set up your component
  */
-declare function renderSuspended<T>(component: T, options?: RenderSuspendeOptions<T>): Promise<RenderSuspendeResult>;
-declare global {
-    interface Window {
-        __cleanup?: Array<() => void>;
-    }
-}
+declare function renderSuspended<T>(component: T, options?: WrapperOptions<T>): Promise<WrapperResult<T>>;
 
 export { mockComponent, mockNuxtImport, mountSuspended, registerEndpoint, renderSuspended };

package/dist/runtime-utils/index.mjs

@@ -1,8 +1,8 @@
 import { defineEventHandler } from 'h3';
 import { mount } from '@vue/test-utils';
-import { reactive, h as h$1, Suspense, nextTick, getCurrentInstance, effectScope, defineComponent as defineComponent$1 } from 'vue';
+import { reactive, h as h$1, Suspense, nextTick as nextTick$1, getCurrentInstance, onErrorCaptured, effectScope } from 'vue';
 import { defu } from 'defu';
-import { defineComponent, useRouter, h, tryUseNuxtApp, onErrorCaptured } from '#imports';
+import { defineComponent, useRouter, h, tryUseNuxtApp } from '#imports';
 import NuxtRoot from '#build/root-component.mjs';
 
 const endpointRegistry = {};
@@ -88,19 +88,34 @@ const RouterLink = defineComponent({
   }
 });
 
-async function mountSuspended(component, options) {
-  const {
-    props = {},
-    attrs = {},
-    slots = {},
-    route = "/",
-    ..._options
-  } = options || {};
-  for (const cleanupFunction of globalThis.__cleanup || []) {
-    cleanupFunction();
+function cleanupAll() {
+  for (const fn of (window.__cleanup || []).splice(0)) {
+    fn();
   }
+}
+function addCleanup(fn) {
+  window.__cleanup ||= [];
+  window.__cleanup.push(fn);
+}
+function runEffectScope(fn) {
+  const scope = effectScope();
+  addCleanup(() => scope.stop());
+  return scope.run(fn);
+}
+function wrapperSuspended(component, options, {
+  wrapperFn,
+  wrappedRender = (fn) => fn,
+  suspendedHelperName,
+  clonedComponentName
+}) {
+  const { props = {}, attrs = {} } = options;
+  const { route = "/", scoped = false, ...wrapperFnOptions } = options;
   const vueApp = tryUseNuxtApp()?.vueApp || globalThis.__unctx__.get("nuxt-app").tryUse().vueApp;
-  const { render, setup, ...componentRest } = component;
+  const {
+    render: componentRender,
+    setup: componentSetup,
+    ...componentRest
+  } = component;
   let wrappedInstance = null;
   let setupContext;
   let setupState;
@@ -113,28 +128,19 @@ async function mountSuspended(component, options) {
       app[key] = value;
     }
   }
-  let componentScope = null;
-  const wrappedSetup = async (props2, setupContext2, instanceContext) => {
-    const currentInstance = getCurrentInstance();
-    if (currentInstance) {
-      currentInstance.emit = (event, ...args) => {
-        setupContext2.emit(event, ...args);
-      };
-    }
-    if (setup) {
-      let result;
-      if (options?.scoped) {
-        componentScope = effectScope();
-        globalThis.__cleanup ||= [];
-        globalThis.__cleanup.push(() => {
-          componentScope?.stop();
-        });
-        result = await componentScope?.run(async () => {
-          return await setup(props2, setupContext2);
-        });
-      } else {
-        result = await setup(props2, setupContext2);
+  const ClonedComponent = {
+    components: {},
+    ...component,
+    name: clonedComponentName,
+    async setup(props2, instanceContext) {
+      const currentInstance = getCurrentInstance();
+      if (currentInstance) {
+        currentInstance.emit = (event, ...args) => {
+          setupContext.emit(event, ...args);
+        };
       }
+      if (!componentSetup) return;
+      const result = scoped ? await runEffectScope(() => componentSetup(props2, setupContext)) : await componentSetup(props2, setupContext);
       if (wrappedInstance?.exposed) {
         instanceContext.expose(wrappedInstance.exposed);
       }
@@ -142,114 +148,108 @@ async function mountSuspended(component, options) {
       return result;
     }
   };
-  return new Promise(
-    (resolve, reject) => {
-      let isMountSettled = false;
-      const vm = mount(
-        {
-          __cssModules: componentRest.__cssModules,
-          inheritAttrs: false,
-          setup: (props2, ctx) => {
-            patchInstanceAppContext();
-            wrappedInstance = getCurrentInstance();
-            setupContext = ctx;
-            let nuxtRootSetupResult;
-            if (options?.scoped) {
-              const scope = effectScope();
-              globalThis.__cleanup ||= [];
-              globalThis.__cleanup.push(() => {
-                scope.stop();
-              });
-              nuxtRootSetupResult = scope.run(() => NuxtRoot.setup(props2, {
-                ...ctx,
-                expose: () => {
-                }
-              }));
-            } else {
-              nuxtRootSetupResult = NuxtRoot.setup(props2, {
-                ...ctx,
-                expose: () => {
-                }
-              });
+  const SuspendedHelper = {
+    name: suspendedHelperName,
+    render: () => "",
+    async setup() {
+      const router = useRouter();
+      await router.replace(route);
+      return () => h$1(ClonedComponent, { ...props, ...setProps, ...attrs }, setupContext.slots);
+    }
+  };
+  return new Promise((resolve, reject) => {
+    let isMountSettled = false;
+    const wrapper = wrapperFn(
+      {
+        inheritAttrs: false,
+        __cssModules: componentRest.__cssModules,
+        setup: (props2, ctx) => {
+          patchInstanceAppContext();
+          wrappedInstance = getCurrentInstance();
+          setupContext = ctx;
+          const nuxtRootSetupResult = runEffectScope(
+            () => NuxtRoot.setup(props2, {
+              ...ctx,
+              expose: () => {
+              }
+            })
+          );
+          onErrorCaptured((error, ...args) => {
+            if (isMountSettled) return;
+            isMountSettled = true;
+            try {
+              wrappedInstance?.appContext.config.errorHandler?.(error, ...args);
+              reject(error);
+            } catch (error2) {
+              reject(error2);
             }
-            onErrorCaptured((error, ...args) => {
+            return false;
+          });
+          return nuxtRootSetupResult;
+        },
+        render: wrappedRender(() => h$1(
+          Suspense,
+          {
+            onResolve: () => nextTick$1().then(() => {
               if (isMountSettled) return;
               isMountSettled = true;
-              try {
-                wrappedInstance?.appContext.config.errorHandler?.(error, ...args);
-                reject(error);
-              } catch (error2) {
-                reject(error2);
-              }
-              return false;
-            });
-            return nuxtRootSetupResult;
-          },
-          render: () => h$1(
-            Suspense,
-            {
-              onResolve: () => nextTick().then(() => {
-                if (isMountSettled) return;
-                isMountSettled = true;
-                vm.setupState = setupState;
-                vm.__setProps = (props2) => {
+              wrapper.setupState = setupState;
+              resolve({
+                wrapper,
+                setProps: (props2) => {
                   Object.assign(setProps, props2);
-                };
-                resolve(wrappedMountedWrapper(vm));
-              })
-            },
-            {
-              default: () => h$1({
-                name: "MountSuspendedHelper",
-                render: () => "",
-                async setup() {
-                  const router = useRouter();
-                  await router.replace(route);
-                  const clonedComponent = {
-                    components: {},
-                    ...component,
-                    name: "MountSuspendedComponent",
-                    setup: (props2, ctx) => wrappedSetup(props2, setupContext, ctx)
-                  };
-                  return () => h$1(clonedComponent, { ...props, ...setProps, ...attrs }, setupContext.slots);
                 }
-              })
-            }
-          )
-        },
-        defu(
-          _options,
+              });
+            })
+          },
           {
-            props,
-            slots,
-            attrs,
-            global: {
-              config: {
-                globalProperties: {
-                  ...vueApp.config.globalProperties,
-                  // make all properties/keys enumerable.
-                  ...Object.fromEntries(
-                    Object.getOwnPropertyNames(vueApp.config.globalProperties).map((key) => [key, vueApp.config.globalProperties[key]])
-                  )
-                }
-              },
-              directives: vueApp._context.directives,
-              provide: vueApp._context.provides,
-              stubs: {
-                Suspense: false,
-                MountSuspendedHelper: false,
-                [component && typeof component === "object" && "name" in component && typeof component.name === "string" ? component.name : "MountSuspendedComponent"]: false
-              },
-              components: { ...vueApp._context.components, RouterLink }
-            }
+            default: () => h$1(SuspendedHelper)
           }
-        )
-      );
-    }
-  );
+        ))
+      },
+      defu(wrapperFnOptions, {
+        global: {
+          config: {
+            globalProperties: makeAllPropertiesEnumerable(
+              vueApp.config.globalProperties
+            )
+          },
+          directives: vueApp._context.directives,
+          provide: vueApp._context.provides,
+          stubs: {
+            Suspense: false,
+            [SuspendedHelper.name]: false,
+            [ClonedComponent.name]: false
+          },
+          components: { ...vueApp._context.components, RouterLink }
+        }
+      })
+    );
+  });
+}
+function makeAllPropertiesEnumerable(target) {
+  return {
+    ...target,
+    ...Object.fromEntries(
+      Object.getOwnPropertyNames(target).map((key) => [key, target[key]])
+    )
+  };
+}
+
+async function mountSuspended(component, options = {}) {
+  const suspendedHelperName = "MountSuspendedHelper";
+  const clonedComponentName = "MountSuspendedComponent";
+  cleanupAll();
+  const { wrapper, setProps } = await wrapperSuspended(component, options, {
+    wrapperFn: mount,
+    suspendedHelperName,
+    clonedComponentName
+  });
+  Object.assign(wrapper, { __setProps: setProps });
+  const clonedComponent = wrapper.findComponent({ name: clonedComponentName });
+  return wrappedMountedWrapper(wrapper, clonedComponent);
 }
-function wrappedMountedWrapper(wrapper) {
-  const component = wrapper.findComponent({ name: "MountSuspendedComponent" });
+function wrappedMountedWrapper(wrapper, component) {
   const wrapperProps = [
     "setProps",
     "emitted",
@@ -290,154 +290,27 @@ function wrappedMountedWrapper(wrapper) {
   }
 }
 
-const WRAPPER_EL_ID = "test-wrapper";
-async function renderSuspended(component, options) {
-  const {
-    props = {},
-    attrs = {},
-    slots = {},
-    route = "/",
-    ..._options
-  } = options || {};
-  const { render: renderFromTestingLibrary } = await import('@testing-library/vue');
-  const vueApp = tryUseNuxtApp()?.vueApp || globalThis.__unctx__.get("nuxt-app").tryUse().vueApp;
-  const { render, setup, ...componentRest } = component;
-  let wrappedInstance = null;
-  let setupContext;
-  let setupState;
-  const setProps = reactive({});
-  function patchInstanceAppContext() {
-    const app = getCurrentInstance()?.appContext.app;
-    if (!app) return;
-    for (const [key, value] of Object.entries(vueApp)) {
-      if (key in app) continue;
-      app[key] = value;
-    }
-  }
-  for (const fn of window.__cleanup || []) {
-    fn();
-  }
-  document.querySelector(`#${WRAPPER_EL_ID}`)?.remove();
-  const wrappedSetup = async (props2, setupContext2, instanceContext) => {
-    const currentInstance = getCurrentInstance();
-    if (currentInstance) {
-      currentInstance.emit = (event, ...args) => {
-        setupContext2.emit(event, ...args);
-      };
-    }
-    if (setup) {
-      const result = await setup(props2, setupContext2);
-      setupState = result && typeof result === "object" ? result : {};
-      if (wrappedInstance?.exposed) {
-        instanceContext.expose(wrappedInstance.exposed);
-      }
-      return result;
-    }
-  };
-  const WrapperComponent = defineComponent$1({
-    inheritAttrs: false,
-    render() {
-      return h$1("div", { id: WRAPPER_EL_ID }, this.$slots.default?.());
-    }
-  });
-  return new Promise((resolve, reject) => {
-    let isMountSettled = false;
-    const utils = renderFromTestingLibrary(
-      {
-        __cssModules: componentRest.__cssModules,
-        inheritAttrs: false,
-        setup: (props2, ctx) => {
-          patchInstanceAppContext();
-          wrappedInstance = getCurrentInstance();
-          setupContext = ctx;
-          const scope = effectScope();
-          window.__cleanup ||= [];
-          window.__cleanup.push(() => {
-            scope.stop();
-          });
-          const nuxtRootSetupResult = scope.run(() => NuxtRoot.setup(props2, {
-            ...ctx,
-            expose: () => ({})
-          }));
-          onErrorCaptured((error, ...args) => {
-            if (isMountSettled) return;
-            isMountSettled = true;
-            try {
-              wrappedInstance?.appContext.config.errorHandler?.(error, ...args);
-              reject(error);
-            } catch (error2) {
-              reject(error2);
-            }
-            return false;
-          });
-          return nuxtRootSetupResult;
-        },
-        render: () => (
-          // See discussions in https://github.com/testing-library/vue-testing-library/issues/230
-          // we add this additional root element because otherwise testing-library breaks
-          // because there's no root element while Suspense is resolving
-          h$1(
-            WrapperComponent,
-            {},
-            {
-              default: () => h$1(
-                Suspense,
-                {
-                  onResolve: () => nextTick().then(() => {
-                    if (isMountSettled) return;
-                    isMountSettled = true;
-                    utils.setupState = setupState;
-                    utils.rerender = async (props2) => {
-                      Object.assign(setProps, props2);
-                      await nextTick();
-                    };
-                    resolve(utils);
-                  })
-                },
-                {
-                  default: () => h$1({
-                    name: "RenderHelper",
-                    render: () => "",
-                    async setup() {
-                      const router = useRouter();
-                      await router.replace(route);
-                      const clonedComponent = {
-                        components: {},
-                        ...component,
-                        name: "RenderSuspendedComponent",
-                        render,
-                        setup: (props2, ctx) => wrappedSetup(props2, setupContext, ctx)
-                      };
-                      return () => h$1(clonedComponent, { ...props && typeof props === "object" ? props : {}, ...setProps, ...attrs }, setupContext.slots);
-                    }
-                  })
-                }
-              )
-            }
-          )
-        )
-      },
-      defu(_options, {
-        props,
-        slots,
-        attrs,
-        global: {
-          config: {
-            globalProperties: {
-              ...vueApp.config.globalProperties,
-              // make all properties/keys enumerable.
-              ...Object.fromEntries(
-                Object.getOwnPropertyNames(vueApp.config.globalProperties).map((key) => [key, vueApp.config.globalProperties[key]])
-              )
-            }
-          },
-          directives: vueApp._context.directives,
-          provide: vueApp._context.provides,
-          components: { RouterLink }
-        }
-      })
-    );
+async function renderSuspended(component, options = {}) {
+  const wrapperId = "test-wrapper";
+  const suspendedHelperName = "RenderHelper";
+  const clonedComponentName = "RenderSuspendedComponent";
+  const { render: wrapperFn } = await import('@testing-library/vue');
+  cleanupAll();
+  document.getElementById(wrapperId)?.remove();
+  const { wrapper, setProps } = await wrapperSuspended(component, options, {
+    wrapperFn,
+    wrappedRender: (render) => () => h$1({
+      inheritAttrs: false,
+      render: () => h$1("div", { id: wrapperId }, render())
+    }),
+    suspendedHelperName,
+    clonedComponentName
   });
+  wrapper.rerender = async (props) => {
+    setProps(props);
+    await nextTick();
+  };
+  return wrapper;
 }
 
 export { mockComponent, mockNuxtImport, mountSuspended, registerEndpoint, renderSuspended };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nuxt/test-utils-nightly",
-  "version": "3.21.1-20251219-125305-c6e4b78",
+  "version": "3.22.0-20251231-204746-58773a7",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/nuxt/test-utils.git"
@@ -68,7 +68,7 @@
   },
   "dependencies": {
     "@nuxt/kit": "^3.20.1",
-    "c12": "^3.3.2",
+    "c12": "^3.3.3",
     "consola": "^3.4.2",
     "defu": "^6.1.4",
     "destr": "^2.0.5",
@@ -91,17 +91,17 @@
     "ufo": "^1.6.1",
     "unplugin": "^2.3.11",
     "vitest-environment-nuxt": "^1.0.1",
-    "vue": "^3.5.25"
+    "vue": "^3.5.26"
   },
   "devDependencies": {
-    "@cucumber/cucumber": "12.4.0",
+    "@cucumber/cucumber": "12.5.0",
     "@jest/globals": "30.2.0",
     "@nuxt/devtools-kit": "2.7.0",
     "@nuxt/eslint-config": "1.12.1",
     "@nuxt/schema": "4.2.1",
     "@playwright/test": "1.57.0",
     "@testing-library/vue": "8.1.0",
-    "@types/bun": "1.3.4",
+    "@types/bun": "1.3.5",
     "@types/estree": "1.0.8",
     "@types/jsdom": "27.0.0",
     "@types/node": "latest",
@@ -111,12 +111,12 @@
     "compatx": "0.2.0",
     "eslint": "9.39.2",
     "installed-check": "9.3.0",
-    "knip": "5.73.4",
+    "knip": "5.78.0",
     "nitropack": "2.12.9",
     "nuxt": "4.2.1",
     "pkg-pr-new": "0.0.62",
     "playwright-core": "1.57.0",
-    "rollup": "4.53.4",
+    "rollup": "4.54.0",
     "semver": "7.7.3",
     "typescript": "5.9.3",
     "unbuild": "latest",
@@ -124,7 +124,7 @@
     "vite": "7.3.0",
     "vitest": "3.2.4",
     "vue-router": "4.6.4",
-    "vue-tsc": "3.1.8"
+    "vue-tsc": "3.2.1"
   },
   "peerDependencies": {
     "@cucumber/cucumber": "^10.3.1 || >=11.0.0",
@@ -170,18 +170,18 @@
     }
   },
   "resolutions": {
-    "@cucumber/cucumber": "12.4.0",
+    "@cucumber/cucumber": "12.5.0",
     "@nuxt/schema": "4.2.1",
     "@nuxt/test-utils": "workspace:*",
     "@types/node": "24.10.4",
-    "rollup": "4.53.4",
+    "rollup": "4.54.0",
     "vite": "7.3.0",
     "vite-node": "5.2.0",
     "vitest": "3.2.4",
-    "vue": "^3.5.25"
+    "vue": "^3.5.26"
   },
   "engines": {
     "node": "^20.0.0 || ^22.0.0 || >=24.0.0"
   },
-  "packageManager": "pnpm@10.26.0"
+  "packageManager": "pnpm@10.26.2"
 }