refactor(runtime-vapor): extract scopeId logic into separate file (#14576)

packages/runtime-vapor/src/block.ts

@@ -12,7 +12,6 @@ import {
   type TransitionHooks,
   type TransitionProps,
   type TransitionState,
-  getInheritedScopeIds,
   performTransitionEnter,
   performTransitionLeave,
 } from '@vue/runtime-dom'
@@ -324,55 +323,7 @@ export function isFragmentBlock(block: Block): boolean {
   return false
 }
 
-export function setScopeId(block: Block, scopeIds: string[]): void {
-  if (block instanceof Element) {
-    for (const id of scopeIds) {
-      block.setAttribute(id, '')
-    }
-  } else if (isVaporComponent(block)) {
-    setScopeId(block.block, scopeIds)
-  } else if (isArray(block)) {
-    for (const b of block) {
-      setScopeId(b, scopeIds)
-    }
-  } else if (isFragment(block)) {
-    setScopeId(block.nodes, scopeIds)
-  }
-}
-
-export function setComponentScopeId(instance: VaporComponentInstance): void {
-  const { parent, scopeId } = instance
-  if (!parent || !scopeId) return
-
-  // prevent setting scopeId on multi-root fragments
-  if (isArray(instance.block) && instance.block.length > 1) return
-
-  const scopeIds: string[] = []
-  const parentScopeId = parent && parent.type.__scopeId
-  // if parent scopeId is different from scopeId, this means scopeId
-  // is inherited from slot owner, so we need to set it to the component
-  // scopeIds. the `parentScopeId-s` is handled in createSlot
-  if (parentScopeId !== scopeId) {
-    scopeIds.push(scopeId)
-  } else {
-    if (parentScopeId) scopeIds.push(parentScopeId)
-  }
-
-  // inherit scopeId from vdom parent
-  if (
-    parent.subTree &&
-    (parent.subTree.component as any) === instance &&
-    parent.vnode!.scopeId
-  ) {
-    scopeIds.push(parent.vnode!.scopeId)
-    const inheritedScopeIds = getInheritedScopeIds(parent.vnode!, parent.parent)
-    scopeIds.push(...inheritedScopeIds)
-  }
-
-  if (scopeIds.length > 0) {
-    setScopeId(instance.block, scopeIds)
-  }
-}
+export { setScopeId, setComponentScopeId } from './scopeId'
 
 // Transition hooks registry for tree-shaking
 // These are registered by Transition component when it's used

packages/runtime-vapor/src/scopeId.ts

@@ -0,0 +1,57 @@
+import { isArray } from '@vue/shared'
+import { type VaporComponentInstance, isVaporComponent } from './component'
+import { getInheritedScopeIds } from '@vue/runtime-dom'
+import { isFragment } from './fragment'
+import type { Block } from './block'
+import { isInteropEnabled } from './vdomInteropState'
+
+export function setScopeId(block: Block, scopeIds: string[]): void {
+  if (block instanceof Element) {
+    for (const id of scopeIds) {
+      block.setAttribute(id, '')
+    }
+  } else if (isVaporComponent(block)) {
+    setScopeId(block.block, scopeIds)
+  } else if (isArray(block)) {
+    for (const b of block) {
+      setScopeId(b, scopeIds)
+    }
+  } else if (isFragment(block)) {
+    setScopeId(block.nodes, scopeIds)
+  }
+}
+
+export function setComponentScopeId(instance: VaporComponentInstance): void {
+  const { parent, scopeId } = instance
+  if (!parent || !scopeId) return
+
+  // prevent setting scopeId on multi-root fragments
+  if (isArray(instance.block) && instance.block.length > 1) return
+
+  const scopeIds: string[] = []
+  const parentScopeId = parent && parent.type.__scopeId
+  // if parent scopeId is different from scopeId, this means scopeId
+  // is inherited from slot owner, so we need to set it to the component
+  // scopeIds. the `parentScopeId-s` is handled in createSlot
+  if (parentScopeId !== scopeId) {
+    scopeIds.push(scopeId)
+  } else {
+    if (parentScopeId) scopeIds.push(parentScopeId)
+  }
+
+  // inherit scopeId from vdom parent
+  if (
+    isInteropEnabled &&
+    parent.subTree &&
+    (parent.subTree.component as any) === instance &&
+    parent.vnode!.scopeId
+  ) {
+    scopeIds.push(parent.vnode!.scopeId)
+    const inheritedScopeIds = getInheritedScopeIds(parent.vnode!, parent.parent)
+    scopeIds.push(...inheritedScopeIds)
+  }
+
+  if (scopeIds.length > 0) {
+    setScopeId(instance.block, scopeIds)
+  }
+}