Add types for render function

Author: cheyer

package.json

@@ -68,9 +68,11 @@
     "lodash.merge": "^4.6.2",
     "msw": "^1.3.2",
     "tsd": "^0.29.0",
+    "type-fest": "~2.19",
     "typescript": "^5.2.2",
     "vee-validate": "^4.11.8",
     "vue": "^3.3.5",
+    "vue-component-type-helpers": "^2.0.19",
     "vue-eslint-parser": "^9.3.2",
     "vue-i18n": "^9.5.0",
     "vue-router": "^4.2.5",

types/index.d.ts

@@ -1,10 +1,13 @@
 // Minimum TypeScript Version: 4.0
 /* eslint-disable @typescript-eslint/no-explicit-any */
 
-import {MountingOptions} from '@vue/test-utils'
-import {queries, EventType, BoundFunctions} from '@testing-library/dom'
+import { VNodeChild } from 'vue';
+import { MountingOptions } from '@vue/test-utils'
+import { queries, EventType, BoundFunctions } from '@testing-library/dom'
 // eslint-disable-next-line import/no-extraneous-dependencies
-import {OptionsReceived as PrettyFormatOptions} from 'pretty-format'
+import { OptionsReceived as PrettyFormatOptions } from 'pretty-format'
+import type { ComponentProps, ComponentSlots } from "vue-component-type-helpers";
+import { RemoveIndexSignature } from "type-fest";
 
 // NOTE: fireEvent is overridden below
 export * from '@testing-library/dom'
@@ -44,12 +47,22 @@ interface VueTestingLibraryRenderOptions {
   container?: Element
   baseElement?: Element
 }
-export type RenderOptions = VueTestingLibraryRenderOptions &
-  VueTestUtilsRenderOptions
 
-export function render(
-  TestComponent: any, // this makes me sad :sob:
-  options?: RenderOptions,
+
+type AllowNonFunctionSlots<Slots> = {
+  [K in keyof Slots]: Slots[K] | VNodeChild;
+};
+type ExtractSlots<C> = AllowNonFunctionSlots<Partial<RemoveIndexSignature<ComponentSlots<C>>>>;
+
+export interface RenderOptions<C> extends Omit<VueTestingLibraryRenderOptions & VueTestUtilsRenderOptions
+  , "props" | "slots"> {
+  props?: ComponentProps<C>;
+  slots?: ExtractSlots<C>;
+}
+
+export function render<C>(
+  TestComponent: C,
+  options?: RenderOptions<C>,
 ): RenderResult
 
 export type AsyncFireObject = {

types/index.test-d.ts

@@ -68,7 +68,7 @@ export async function testWaitFor() {
 export function testOptions() {
   render(SomeComponent, {
     attrs: {a: 1},
-    props: {c: 1}, // ideally it would fail because `c` is not an existing prop…
+    props: {foo: 1},
     data: () => ({b: 2}),
     slots: {
       default: '<div />',