ShadowRoot.append 在 microApp.start() 后抛出 TypeError: Illegal invocation

[Mario34]

问题描述

调用 microApp.start() 后，前端页面水印场景执行 ShadowRoot.append() 会抛出异常：

Uncaught TypeError: Illegal invocation
    at invokeRawMethod
    at commonElementHandler
    at ShadowRoot.append

复现步骤

1. 克隆复现仓库并安装依赖：https://github.com/mario34/micro-app-shadow-root-append-reproduction

   pnpm install
   pnpm dev

2. 打开终端显示的本地地址，等待静态子应用挂载。

3. 按钮变为可用后，点击“复现 Illegal invocation”。

4. 页面状态和浏览器控制台出现 TypeError: Illegal invocation。

复现代码的核心逻辑如下：

import microApp from '@micro-zoe/micro-app'

microApp.start()

// 页面中的 <micro-app> 挂载、沙箱启动后执行：
const host = document.createElement('div')
document.body.appendChild(host)
const shadowRoot = host.attachShadow({ mode: 'open' })

shadowRoot.append(document.createElement('div'))

上传截图

控制台错误信息：

Uncaught TypeError: Illegal invocation
    at invokeRawMethod
    at commonElementHandler
    at ShadowRoot.append

复现仓库

https://github.com/mario34/micro-app-shadow-root-append-reproduction

环境信息

• micro-app版本：
• 主应用前端框架&版本：1.0.0-rc.32
• 子应用前端框架&版本：原生js
• 构建工具&版本：vite@8.1.5