From 85e2850eead91aa0ec62dea1494ce8a4f7814400 Mon Sep 17 00:00:00 2001
From: daiwei <daiwei521@126.com>
Date: Wed, 25 Dec 2024 09:30:54 +0800
Subject: [PATCH 1/3] fix(customElement): handle configure app work with async
 component

---
 .../__tests__/customElement.spec.ts           | 23 +++++++++++++++++++
 packages/runtime-dom/src/apiCustomElement.ts  |  7 +++---
 2 files changed, 27 insertions(+), 3 deletions(-)

diff --git a/packages/runtime-dom/__tests__/customElement.spec.ts b/packages/runtime-dom/__tests__/customElement.spec.ts
index df438d47eee..e557b04e29d 100644
--- a/packages/runtime-dom/__tests__/customElement.spec.ts
+++ b/packages/runtime-dom/__tests__/customElement.spec.ts
@@ -1330,6 +1330,29 @@ describe('defineCustomElement', () => {
 
       expect(e.shadowRoot?.innerHTML).toBe('<div>app-injected</div>')
     })
+
+    // #12448
+    test('work with async component', async () => {
+      const AsyncComp = defineAsyncComponent(() => {
+        return Promise.resolve({
+          render() {
+            const msg: string | undefined = inject('msg')
+            return h('div', {}, msg)
+          },
+        } as any)
+      })
+      const E = defineCustomElement(AsyncComp, {
+        configureApp(app) {
+          app.provide('msg', 'app-injected')
+        },
+      })
+      customElements.define('my-async-element-with-app', E)
+
+      container.innerHTML = `<my-async-element-with-app></my-async-element-with-app>`
+      const e = container.childNodes[0] as VueElement
+      await new Promise(r => setTimeout(r))
+      expect(e.shadowRoot?.innerHTML).toBe('<div>app-injected</div>')
+    })
   })
 
   // #9885
diff --git a/packages/runtime-dom/src/apiCustomElement.ts b/packages/runtime-dom/src/apiCustomElement.ts
index aeeaeec9b9f..ac75390c0c1 100644
--- a/packages/runtime-dom/src/apiCustomElement.ts
+++ b/packages/runtime-dom/src/apiCustomElement.ts
@@ -403,9 +403,10 @@ export class VueElement
 
     const asyncDef = (this._def as ComponentOptions).__asyncLoader
     if (asyncDef) {
-      this._pendingResolve = asyncDef().then(def =>
-        resolve((this._def = def), true),
-      )
+      this._pendingResolve = asyncDef().then((def: InnerComponentDef) => {
+        if (this._def.configureApp) def.configureApp = this._def.configureApp
+        resolve((this._def = def), true)
+      })
     } else {
       resolve(this._def)
     }

From c75dcd9a2ec305efe6dd7d4c87e68525048cb0b2 Mon Sep 17 00:00:00 2001
From: edison <daiwei521@126.com>
Date: Tue, 31 Dec 2024 09:32:03 +0800
Subject: [PATCH 2/3] Apply suggestions from code review

Co-authored-by: skirtle <65301168+skirtles-code@users.noreply.github.com>
---
 packages/runtime-dom/src/apiCustomElement.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/runtime-dom/src/apiCustomElement.ts b/packages/runtime-dom/src/apiCustomElement.ts
index ac75390c0c1..d6627ddaa13 100644
--- a/packages/runtime-dom/src/apiCustomElement.ts
+++ b/packages/runtime-dom/src/apiCustomElement.ts
@@ -404,7 +404,7 @@ export class VueElement
     const asyncDef = (this._def as ComponentOptions).__asyncLoader
     if (asyncDef) {
       this._pendingResolve = asyncDef().then((def: InnerComponentDef) => {
-        if (this._def.configureApp) def.configureApp = this._def.configureApp
+        def.configureApp = this._def.configureApp
         resolve((this._def = def), true)
       })
     } else {

From bf2c65c71fbc5bb77c9dd8e5c6da3fff71faed05 Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Thu, 5 Jun 2025 02:04:53 +0000
Subject: [PATCH 3/3] [autofix.ci] apply automated fixes

---
 packages/runtime-dom/__tests__/customElement.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/runtime-dom/__tests__/customElement.spec.ts b/packages/runtime-dom/__tests__/customElement.spec.ts
index 007aa012e13..c44840df5e3 100644
--- a/packages/runtime-dom/__tests__/customElement.spec.ts
+++ b/packages/runtime-dom/__tests__/customElement.spec.ts
@@ -1588,7 +1588,7 @@ describe('defineCustomElement', () => {
       await new Promise(r => setTimeout(r))
       expect(e.shadowRoot?.innerHTML).toBe('<div>app-injected</div>')
     })
-      
+
     test('with hmr reload', async () => {
       const __hmrId = '__hmrWithApp'
       const def = defineComponent({