From 9bf6595744991f3f5e0ff329c113779b35417c79 Mon Sep 17 00:00:00 2001
From: Helios <i@shangyes.net>
Date: Tue, 20 Oct 2020 17:48:23 +0800
Subject: [PATCH 1/2] feat(runtime-dom): support mount app on ShadowRoot

---
 packages/runtime-dom/src/index.ts | 23 ++++++++++++++++++-----
 1 file changed, 18 insertions(+), 5 deletions(-)

diff --git a/packages/runtime-dom/src/index.ts b/packages/runtime-dom/src/index.ts
index 5da7086f8e6..9a79b42177f 100644
--- a/packages/runtime-dom/src/index.ts
+++ b/packages/runtime-dom/src/index.ts
@@ -58,7 +58,7 @@ export const createApp = ((...args) => {
   }
 
   const { mount } = app
-  app.mount = (containerOrSelector: Element | string): any => {
+  app.mount = (containerOrSelector: Element | ShadowRoot | string): any => {
     const container = normalizeContainer(containerOrSelector)
     if (!container) return
     const component = app._component
@@ -68,8 +68,10 @@ export const createApp = ((...args) => {
     // clear content before mounting
     container.innerHTML = ''
     const proxy = mount(container)
-    container.removeAttribute('v-cloak')
-    container.setAttribute('data-v-app', '')
+    if (!container.__isShadowRoot) {
+      container.removeAttribute('v-cloak')
+      container.setAttribute('data-v-app', '')
+    }
     return proxy
   }
 
@@ -84,7 +86,7 @@ export const createSSRApp = ((...args) => {
   }
 
   const { mount } = app
-  app.mount = (containerOrSelector: Element | string): any => {
+  app.mount = (containerOrSelector: Element | ShadowRoot | string): any => {
     const container = normalizeContainer(containerOrSelector)
     if (container) {
       return mount(container, true)
@@ -103,7 +105,9 @@ function injectNativeTagCheck(app: App) {
   })
 }
 
-function normalizeContainer(container: Element | string): Element | null {
+function normalizeContainer(
+  container: Element | ShadowRoot | string
+): Element & { __isShadowRoot?: boolean } | null {
   if (isString(container)) {
     const res = document.querySelector(container)
     if (__DEV__ && !res) {
@@ -111,6 +115,15 @@ function normalizeContainer(container: Element | string): Element | null {
     }
     return res
   }
+  if (container instanceof ShadowRoot) {
+    if (__DEV__ && container.mode === 'closed') {
+      warn(
+        `mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`
+      )
+    }
+    ;(container as any).__isShadowRoot = true
+    return container as any
+  }
   return container
 }
 

From 4772e645e2113cf113908728ae28b0bb7cb60525 Mon Sep 17 00:00:00 2001
From: Helios <i@shangyes.net>
Date: Wed, 21 Oct 2020 01:06:15 +0800
Subject: [PATCH 2/2] feat(runtime-dom): refactor

---
 packages/runtime-dom/src/index.ts | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/runtime-dom/src/index.ts b/packages/runtime-dom/src/index.ts
index 9a79b42177f..e5335238e90 100644
--- a/packages/runtime-dom/src/index.ts
+++ b/packages/runtime-dom/src/index.ts
@@ -68,7 +68,7 @@ export const createApp = ((...args) => {
     // clear content before mounting
     container.innerHTML = ''
     const proxy = mount(container)
-    if (!container.__isShadowRoot) {
+    if (container instanceof Element) {
       container.removeAttribute('v-cloak')
       container.setAttribute('data-v-app', '')
     }
@@ -107,7 +107,7 @@ function injectNativeTagCheck(app: App) {
 
 function normalizeContainer(
   container: Element | ShadowRoot | string
-): Element & { __isShadowRoot?: boolean } | null {
+): Element | null {
   if (isString(container)) {
     const res = document.querySelector(container)
     if (__DEV__ && !res) {
@@ -115,16 +115,16 @@ function normalizeContainer(
     }
     return res
   }
-  if (container instanceof ShadowRoot) {
-    if (__DEV__ && container.mode === 'closed') {
-      warn(
-        `mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`
-      )
-    }
-    ;(container as any).__isShadowRoot = true
-    return container as any
+  if (
+    __DEV__ &&
+    container instanceof ShadowRoot &&
+    container.mode === 'closed'
+  ) {
+    warn(
+      `mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`
+    )
   }
-  return container
+  return container as any
 }
 
 // SFC CSS utilities