What problem does this feature solve?

I am creating components programmatically via method call and want all of them to be contained inside one wrapper element. Since mount API replaces inner html I have to create new 'holder' elements inside wrapper onto which I mount those components. This in turn requires more CSS and redundant html elements which have no purpose.

What does the proposed API look like?

 instance.mount(selector, isHydrate, isSVG, replaceInnerHtml= true)

or flag which would bring back vue 2 behavior (replace entire element with component template)

Does anyone know of any alternative solution for this?

@yyx990803 This feature would be a big improvement for the "islands architecture" use case, where we want to hydrate individual server-rendered components throughout a page rather than hydrating an entire page.

Because Vue (and other libraries) behave this way, SSR/SSG frameworks like Astro and iles resort to "hiding" the wrapper elements using display: contents, which:

1. has been really bad for accessibility via screen readers. display: contents has a long history of accessibility issues. Browsers like Safari have tried to fix the issue in the past and have ended up regressing again, taking years to produce another fix.
2. produces many useless divs, crowding the markup.

I have no idea of the scope of what it would take to implement this, but if the cost is reasonable, I think this would have a large, positive impact on this use case.

Thank you for considering!