fix(namespace): apply every namespace in slot when call applyNS (#11315)

Author: zhangzhonghe

src/core/vdom/create-element.ts

@@ -157,6 +157,17 @@ function applyNS(vnode, ns, force?: boolean) {
       }
     }
   }
+
+  // #11315
+  if (isObject(vnode.componentOptions) && isDef(vnode.componentOptions.children)) {
+    for (var i = 0, l = vnode.componentOptions.children.length; i < l; i++) {
+      var child = vnode.componentOptions.children[i]
+      if (isDef(child.tag) && (
+        isUndef(child.ns) || (isTrue(force) && child.tag !== 'svg'))) {
+        applyNS(child, ns, force)
+      }
+    }
+  }
 }
 
 // ref #5318

test/unit/modules/vdom/create-element.spec.ts

@@ -147,6 +147,49 @@ describe('create-element', () => {
     expect(vnode.children[0].children[1].ns).toBe('svg')
   })
 
+  // #11315
+  it('render svg foreignObject nested component slot with correct namespace', () => {
+    const vm = new Vue({
+      template: `
+        <svg>
+          <box></box>
+        </svg>
+      `,
+      components: {
+        'box': {
+          template: `
+            <foreignObject>
+              <comp-with-slot>
+                <p></p><svg></svg>
+              </comp-with-slot>
+            </foreignObject>
+          `,
+          components: {
+            'comp-with-slot': {
+              template: `
+                <div>
+                  <slot />
+                </div>
+              `
+            }
+          }
+        }
+      }
+    }).$mount()
+    const box = vm.$children[0]
+    const compWithSlot = box.$children[0]
+    expect(box.$vnode.ns).toBe('svg')
+    expect(box._vnode.tag).toBe('foreignObject')
+    expect(box._vnode.ns).toBe('svg')
+    expect(compWithSlot.$vnode.ns).toBeUndefined()
+    expect(compWithSlot._vnode.tag).toBe('div')
+    expect(compWithSlot._vnode.ns).toBeUndefined()
+    expect(compWithSlot._vnode.children[0].tag).toBe('p')
+    expect(compWithSlot._vnode.children[0].ns).toBeUndefined()
+    expect(compWithSlot._vnode.children[1].tag).toBe('svg')
+    expect(compWithSlot._vnode.children[1].ns).toBe('svg')
+  })
+
   // #6642
   it('render svg foreignObject component with correct namespace', () => {
     const vm = new Vue({