Following the Vue 3 docs Slots - Advanced Usage you can pass a SFC to a slot to render in your tests which we want to do for some integrated accessibility testing. My SFC has required props that need to be set but I cannot see a way to pass those in as well?
import List from '../List.vue';
import ListItem from '../components/ListItem.vue';
const factoryMount = () => mount(List, {
slots: {
default: ListItem,
},
});
Gives me this error as the prop is required in ListItem:
[Vue warn]: Missing required prop: "label"
Is there a way I can load a SFC to a slot along with its required props?
I've tried using setProps but that can only be used with the mounted component. Is there another way?
Thank you Estus Flask. This worked:
import { h } from 'vue';
import List from '../List.vue';
import ListItem from '../components/ListItem.vue';
const factoryMount = () => mount(List, {
slots: {
default: h(ListItem, {
label: 'List item text'
}),
},
});