소스 검색

test(runtime-vapor): add test for teleport work with SVG (#14103)

edison 7 달 전
부모
커밋
a19d8f7fc9
2개의 변경된 파일38개의 추가작업 그리고 1개의 파일을 삭제
  1. 37 1
      packages/runtime-vapor/__tests__/components/Teleport.spec.ts
  2. 1 0
      packages/runtime-vapor/src/apiTemplateRef.ts

+ 37 - 1
packages/runtime-vapor/__tests__/components/Teleport.spec.ts

@@ -4,6 +4,7 @@ import {
   createComponent as createComp,
   createComponent,
 } from '../../src/component'
+import { withVaporCtx } from '../../src'
 import {
   type VaporDirective,
   VaporTeleport,
@@ -704,7 +705,42 @@ function runSharedTests(deferMode: boolean): void {
     expect(target.innerHTML).toBe('<div>teleported</div>')
   })
 
-  test.todo('should work with SVG', async () => {})
+  test('should work with SVG', async () => {
+    const svg = ref()
+    const circle = ref()
+    const { host } = define({
+      setup() {
+        const _setTemplateRef = createTemplateRefSetter()
+        const n0 = template('<svg></svg>', false, 1)() as any
+        const n1 = createIf(
+          () => svg.value,
+          () => {
+            const n4 = createComponent(
+              VaporTeleport,
+              { to: () => svg.value },
+              {
+                default: withVaporCtx(() => {
+                  const n3 = template('<circle></circle>', false, 1)() as any
+                  _setTemplateRef(n3, circle, undefined, undefined, 'circle')
+                  return n3
+                }),
+              },
+            )
+            return n4
+          },
+        )
+        _setTemplateRef(n0, svg, undefined, undefined, 'svg')
+        return [n0, n1]
+      },
+    }).render()
+
+    await nextTick()
+    expect(host.innerHTML).toBe(
+      '<svg><circle></circle></svg><!--teleport start--><!--teleport end--><!--if-->',
+    )
+    expect(svg.value.namespaceURI).toBe('http://www.w3.org/2000/svg')
+    expect(circle.value.namespaceURI).toBe('http://www.w3.org/2000/svg')
+  })
 
   test('should update target', async () => {
     const targetA = document.createElement('div')

+ 1 - 0
packages/runtime-vapor/src/apiTemplateRef.ts

@@ -35,6 +35,7 @@ export type setRefFn = (
   ref: NodeRef,
   oldRef?: NodeRef,
   refFor?: boolean,
+  refKey?: string,
 ) => NodeRef | undefined
 
 export function createTemplateRefSetter(): setRefFn {