Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 | 2x 2x 2x 2x 2x 2x 2x 11x 11x 11x 11x 11x 11x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 11x 11x 2x 11x 11x 11x 11x 11x 9x 9x 2x 2x 2x 2x 2x 2x 1x 1x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 8x 7x 7x 7x 7x 7x 1x 1x 7x 7x 7x 7x 11x 2x 2x 11x | import {
type AttributeNode,
type ComponentNode,
type DirectiveNode,
type JSChildNode,
NodeTypes,
type TransformContext,
buildProps,
createCallExpression,
findProp,
} from '@vue/compiler-dom'
import { SSR_RENDER_ATTRS } from '../runtimeHelpers'
import {
type SSRTransformContext,
processChildren,
} from '../ssrCodegenTransform'
import { buildSSRProps } from './ssrTransformElement'
const wipMap = new WeakMap<ComponentNode, WIPEntry>()
interface WIPEntry {
tag: AttributeNode | DirectiveNode
propsExp: string | JSChildNode | null
scopeId: string | null
}
// phase 1: build props
export function ssrTransformTransitionGroup(
node: ComponentNode,
context: TransformContext,
) {
return (): void => {
const tag = findProp(node, 'tag')
if (tag) {
const otherProps = node.props.filter(p => p !== tag)
const { props, directives } = buildProps(
node,
context,
otherProps,
true /* isComponent */,
false /* isDynamicComponent */,
true /* ssr (skip event listeners) */,
)
let propsExp = null
if (props || directives.length) {
propsExp = createCallExpression(context.helper(SSR_RENDER_ATTRS), [
buildSSRProps(props, directives, context),
])
}
wipMap.set(node, {
tag,
propsExp,
scopeId: context.scopeId || null,
})
}
}
}
// phase 2: process children
export function ssrProcessTransitionGroup(
node: ComponentNode,
context: SSRTransformContext,
): void {
const entry = wipMap.get(node)
if (entry) {
const { tag, propsExp, scopeId } = entry
if (tag.type === NodeTypes.DIRECTIVE) {
// dynamic :tag
context.pushStringPart(`<`)
context.pushStringPart(tag.exp!)
if (propsExp) {
context.pushStringPart(propsExp)
}
if (scopeId) {
context.pushStringPart(` ${scopeId}`)
}
context.pushStringPart(`>`)
processChildren(
node,
context,
false,
/**
* TransitionGroup has the special runtime behavior of flattening and
* concatenating all children into a single fragment (in order for them to
* be patched using the same key map) so we need to account for that here
* by disabling nested fragment wrappers from being generated.
*/
true,
/**
* TransitionGroup filters out comment children at runtime and thus
* doesn't expect comments to be present during hydration. We need to
* account for that by disabling the empty comment that is otherwise
* rendered for a falsy v-if that has no v-else specified. (#6715)
*/
true,
)
context.pushStringPart(`</`)
context.pushStringPart(tag.exp!)
context.pushStringPart(`>`)
} else {
// static tag
context.pushStringPart(`<${tag.value!.content}`)
if (propsExp) {
context.pushStringPart(propsExp)
}
if (scopeId) {
context.pushStringPart(` ${scopeId}`)
}
context.pushStringPart(`>`)
processChildren(node, context, false, true, true)
context.pushStringPart(`</${tag.value!.content}>`)
}
} else {
// fragment
processChildren(node, context, true, true, true)
}
}
|