feat(runtime-vapor): support Fragment

packages/runtime-core/src/errorHandling.ts

@@ -28,6 +28,7 @@ export enum ErrorCodes {
   SCHEDULER,
   COMPONENT_UPDATE,
   APP_UNMOUNT_CLEANUP,
+  RENDER_SLOTS,
 }
 
 export const ErrorTypeStrings: Record<ErrorTypes, string> = {
@@ -62,6 +63,7 @@ export const ErrorTypeStrings: Record<ErrorTypes, string> = {
   [ErrorCodes.SCHEDULER]: 'scheduler flush',
   [ErrorCodes.COMPONENT_UPDATE]: 'component update',
   [ErrorCodes.APP_UNMOUNT_CLEANUP]: 'app unmount cleanup function',
+  [ErrorCodes.RENDER_SLOTS]: 'render slots',
 }
 
 export type ErrorTypes = LifecycleHooks | ErrorCodes | WatchErrorCodes

packages/runtime-vapor/__tests__/component.spec.ts

@@ -1,5 +1,6 @@
 import {
   type EffectScope,
+  Fragment,
   ReactiveEffect,
   type Ref,
   inject,
@@ -354,6 +355,18 @@ describe('component', () => {
       'Vapor component setup() returned non-block value, and has no render function',
     ).toHaveBeenWarned()
   })
+
+  it('Fragment slots should be rendered', () => {
+    const { host } = define({
+      setup() {
+        return createComponent(Fragment as any, null, {
+          default: () => template('HI', true)(),
+        })
+      },
+    }).render()
+
+    expect(host.innerHTML).toBe('HI')
+  })
 })
 
 function getEffectsCount(scope: EffectScope): number {

packages/runtime-vapor/src/component.ts

@@ -5,6 +5,7 @@ import {
   type EmitFn,
   type EmitsOptions,
   ErrorCodes,
+  Fragment,
   type GenericAppContext,
   type GenericComponentInstance,
   type LifecycleHook,
@@ -219,7 +220,17 @@ export function createComponent(
       ]) || EMPTY_OBJ
     : EMPTY_OBJ
 
-  if (__DEV__ && !isBlock(setupResult)) {
+  if (component === Fragment) {
+    if (instance.slots.default) {
+      instance.block = callWithErrorHandling(
+        instance.slots.default,
+        instance,
+        ErrorCodes.RENDER_SLOTS,
+      )
+    } else {
+      instance.block = []
+    }
+  } else if (__DEV__ && !isBlock(setupResult)) {
     if (isFunction(component)) {
       warn(`Functional vapor component must return a block directly.`)
       instance.block = []