Asynchronous components never opens

[IlyaSemenov]

Overview of the problem

Oruga version: 0.10.5
Vuejs version: 3.5.13
OS/Browser: macOS / Chrome 136

Description

The modal doesn't show if opened programmatically with:

<button @click="oruga.modal.open({ component: TestModal })">

and if TestModal is an async component which takes some time to initialize.

Steps to reproduce

Open reproduction:
https://stackblitz.com/edit/vitejs-vite-jwwgipqs

Click "Open Modal".

Expected behavior

The modal shade activates, then the modal window opens with a 10ms delay.

Actual behavior

The modal shade activates, but the modal window never opens. There is error in console:

App.vue:10 [Vue warn]: Component <Anonymous>: setup function returned a promise, but no <Suspense> boundary was found in the parent component tree. A component with async setup() must be nested in a <Suspense> in order to be rendered. 
  at <TestModal key=0 onClose=fn<close> > 
  at <BaseTransition onAfterEnter=fn<afterEnter> onBeforeLeave=fn<beforeLeave> appear=false  ... > 
  at <Transition name="zoom-out" onAfterEnter=fn<afterEnter> onBeforeLeave=fn<beforeLeave> > 
  at <OModal active=true component= 
{__name: 'TestModal', __hmrId: '200abaf8', __scopeId: 'data-v-200abaf8', setup: ƒ, render: ƒ, …}
 container= 
  ... > 
  at <ProgrammaticApp registry= 
InstanceRegistry {entries: Array(0)}
 component= 
{isOruga: true, name: 'OModal', configField: 'modal', inheritAttrs: false, __name: 'Modal', …}
 props= 
{active: true, component: {…}, container: body}
  ... >

Test sync mode

Edit components/TestModal.vue, replace async init with const foo = 123. The modal will show normally.

[mlmoravek]

Oh, that's crazy! I haven't worked with asynchronous components that much. I try to avoid them and implement proper then/catch phrases instead.

This is because there is no Suspense wrapper inside the programmatic wrapper for programmatic components. Asynchronous components cannot work at the moment. I would currently describe this as a significant usage restriction rather than a bug. However, we could consider adding a Suspense wrapper to provide asynchronous component support.