Test Vue 3 composables

renderComposable.ts

import { defineComponent, h, nextTick as vueNextTick } from "vue";
import { mount } from "@vue/test-utils";
import waitFor from 'p-wait-for';

export interface RenderComposableResult<T> {
  result: T;
  waitFor: typeof waitFor,
  nextTick: typeof vueNextTick;
}

export function renderComposable<T>(
  composable: () => T
): RenderComposableResult<T> {
  const Child = defineComponent({
    setup() {
      const result = composable();
      const wrapper = () => result;
      return { wrapper };
    },
    render: () => null
  });

  const wrapper = mount({
    render: () => h(Child, { ref: 'child' }),
  });

  return {
    result: (wrapper.vm.$refs.child as any).wrapper(),
    waitFor,
    nextTick: wrapper.vm.$nextTick,
  };
}