Skip to content

Commit 57c9e74

Browse files
edison1105edison1105
authored
refactor(vapor): replace forwardedSlotCreator with withVaporCtx (#14009)
1 parent bc1712a commit 57c9e74

File tree

13 files changed

+65
-114
lines changed

13 files changed

+65
-114
lines changed

‎packages/compiler-vapor/__tests__/transforms/__snapshots__/TransformTransition.spec.ts.snap‎

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,46 @@
11
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
22

33
exports[`compiler: transition > basic 1`] = `
4-
"import { VaporTransition as _VaporTransition, applyVShow as _applyVShow, createComponent as _createComponent, template as _template } from 'vue';
4+
"import { VaporTransition as _VaporTransition, applyVShow as _applyVShow, withVaporCtx as _withVaporCtx, createComponent as _createComponent, template as _template } from 'vue';
55
const t0 = _template("<h1>foo</h1>")
66
77
export function render(_ctx) {
88
const n1 = _createComponent(_VaporTransition, { persisted: () => ("") }, {
9-
"default": () => {
9+
"default": _withVaporCtx(() => {
1010
const n0 = t0()
1111
_applyVShow(n0, () => (_ctx.show))
1212
return n0
13-
}
13+
})
1414
}, true)
1515
return n1
1616
}"
1717
`;
1818

1919
exports[`compiler: transition > inject persisted when child has v-show 1`] = `
20-
"import { VaporTransition as _VaporTransition, applyVShow as _applyVShow, createComponent as _createComponent, template as _template } from 'vue';
20+
"import { VaporTransition as _VaporTransition, applyVShow as _applyVShow, withVaporCtx as _withVaporCtx, createComponent as _createComponent, template as _template } from 'vue';
2121
const t0 = _template("<div></div>")
2222
2323
export function render(_ctx) {
2424
const n1 = _createComponent(_VaporTransition, { persisted: () => ("") }, {
25-
"default": () => {
25+
"default": _withVaporCtx(() => {
2626
const n0 = t0()
2727
_applyVShow(n0, () => (_ctx.ok))
2828
return n0
29-
}
29+
})
3030
}, true)
3131
return n1
3232
}"
3333
`;
3434

3535
exports[`compiler: transition > the v-if/else-if/else branches in Transition should ignore comments 1`] = `
36-
"import { VaporTransition as _VaporTransition, setInsertionState as _setInsertionState, createIf as _createIf, createComponent as _createComponent, template as _template } from 'vue';
36+
"import { VaporTransition as _VaporTransition, setInsertionState as _setInsertionState, createIf as _createIf, withVaporCtx as _withVaporCtx, createComponent as _createComponent, template as _template } from 'vue';
3737
const t0 = _template("<div>hey</div>")
3838
const t1 = _template("<p></p>")
3939
const t2 = _template("<div></div>")
4040
4141
export function render(_ctx) {
4242
const n16 = _createComponent(_VaporTransition, null, {
43-
"default": () => {
43+
"default": _withVaporCtx(() => {
4444
const n0 = _createIf(() => (_ctx.a), () => {
4545
const n2 = t0()
4646
n2.$key = 2
@@ -63,14 +63,14 @@ export function render(_ctx) {
6363
return n14
6464
}))
6565
return [n0, n3, n7]
66-
}
66+
})
6767
}, true)
6868
return n16
6969
}"
7070
`;
7171

7272
exports[`compiler: transition > v-show + appear 1`] = `
73-
"import { VaporTransition as _VaporTransition, applyVShow as _applyVShow, createComponent as _createComponent, template as _template } from 'vue';
73+
"import { VaporTransition as _VaporTransition, applyVShow as _applyVShow, withVaporCtx as _withVaporCtx, createComponent as _createComponent, template as _template } from 'vue';
7474
const t0 = _template("<h1>foo</h1>")
7575
7676
export function render(_ctx) {
@@ -79,49 +79,49 @@ export function render(_ctx) {
7979
appear: () => (""),
8080
persisted: () => ("")
8181
}, {
82-
"default": () => {
82+
"default": _withVaporCtx(() => {
8383
const n0 = t0()
8484
deferredApplyVShows.push(() => _applyVShow(n0, () => (_ctx.show)))
8585
return n0
86-
}
86+
})
8787
}, true)
8888
deferredApplyVShows.forEach(fn => fn())
8989
return n1
9090
}"
9191
`;
9292

9393
exports[`compiler: transition > work with dynamic keyed children 1`] = `
94-
"import { VaporTransition as _VaporTransition, createKeyedFragment as _createKeyedFragment, createComponent as _createComponent, template as _template } from 'vue';
94+
"import { VaporTransition as _VaporTransition, createKeyedFragment as _createKeyedFragment, withVaporCtx as _withVaporCtx, createComponent as _createComponent, template as _template } from 'vue';
9595
const t0 = _template("<h1>foo</h1>")
9696
9797
export function render(_ctx) {
9898
const n1 = _createComponent(_VaporTransition, null, {
99-
"default": () => {
99+
"default": _withVaporCtx(() => {
100100
return _createKeyedFragment(() => _ctx.key, () => {
101101
const n0 = t0()
102102
n0.$key = _ctx.key
103103
return n0
104104
})
105-
}
105+
})
106106
}, true)
107107
return n1
108108
}"
109109
`;
110110

111111
exports[`compiler: transition > work with v-if 1`] = `
112-
"import { VaporTransition as _VaporTransition, createIf as _createIf, createComponent as _createComponent, template as _template } from 'vue';
112+
"import { VaporTransition as _VaporTransition, createIf as _createIf, withVaporCtx as _withVaporCtx, createComponent as _createComponent, template as _template } from 'vue';
113113
const t0 = _template("<h1>foo</h1>")
114114
115115
export function render(_ctx) {
116116
const n3 = _createComponent(_VaporTransition, null, {
117-
"default": () => {
117+
"default": _withVaporCtx(() => {
118118
const n0 = _createIf(() => (_ctx.show), () => {
119119
const n2 = t0()
120120
n2.$key = 2
121121
return n2
122122
})
123123
return n0
124-
}
124+
})
125125
}, true)
126126
return n3
127127
}"

‎packages/compiler-vapor/__tests__/transforms/__snapshots__/vSlot.spec.ts.snap‎

Lines changed: 10 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -104,16 +104,15 @@ export function render(_ctx) {
104104
`;
105105

106106
exports[`compiler: transform slot > forwarded slots > <slot w/ nested component> 1`] = `
107-
"import { forwardedSlotCreator as _forwardedSlotCreator, resolveComponent as _resolveComponent, withVaporCtx as _withVaporCtx, createComponentWithFallback as _createComponentWithFallback } from 'vue';
107+
"import { resolveComponent as _resolveComponent, createSlot as _createSlot, withVaporCtx as _withVaporCtx, createComponentWithFallback as _createComponentWithFallback } from 'vue';
108108
109109
export function render(_ctx) {
110-
const _createForwardedSlot = _forwardedSlotCreator()
111110
const _component_Comp = _resolveComponent("Comp")
112111
const n2 = _createComponentWithFallback(_component_Comp, null, {
113112
"default": _withVaporCtx(() => {
114113
const n1 = _createComponentWithFallback(_component_Comp, null, {
115114
"default": _withVaporCtx(() => {
116-
const n0 = _createForwardedSlot("default", null)
115+
const n0 = _createSlot("default", null)
117116
return n0
118117
})
119118
})
@@ -125,14 +124,13 @@ export function render(_ctx) {
125124
`;
126125
127126
exports[`compiler: transform slot > forwarded slots > <slot> tag only 1`] = `
128-
"import { forwardedSlotCreator as _forwardedSlotCreator, resolveComponent as _resolveComponent, withVaporCtx as _withVaporCtx, createComponentWithFallback as _createComponentWithFallback } from 'vue';
127+
"import { resolveComponent as _resolveComponent, createSlot as _createSlot, withVaporCtx as _withVaporCtx, createComponentWithFallback as _createComponentWithFallback } from 'vue';
129128
130129
export function render(_ctx) {
131-
const _createForwardedSlot = _forwardedSlotCreator()
132130
const _component_Comp = _resolveComponent("Comp")
133131
const n1 = _createComponentWithFallback(_component_Comp, null, {
134132
"default": _withVaporCtx(() => {
135-
const n0 = _createForwardedSlot("default", null)
133+
const n0 = _createSlot("default", null)
136134
return n0
137135
})
138136
}, true)
@@ -141,14 +139,13 @@ export function render(_ctx) {
141139
`;
142140
143141
exports[`compiler: transform slot > forwarded slots > <slot> tag w/ template 1`] = `
144-
"import { forwardedSlotCreator as _forwardedSlotCreator, resolveComponent as _resolveComponent, withVaporCtx as _withVaporCtx, createComponentWithFallback as _createComponentWithFallback } from 'vue';
142+
"import { resolveComponent as _resolveComponent, createSlot as _createSlot, withVaporCtx as _withVaporCtx, createComponentWithFallback as _createComponentWithFallback } from 'vue';
145143
146144
export function render(_ctx) {
147-
const _createForwardedSlot = _forwardedSlotCreator()
148145
const _component_Comp = _resolveComponent("Comp")
149146
const n2 = _createComponentWithFallback(_component_Comp, null, {
150147
"default": _withVaporCtx(() => {
151-
const n0 = _createForwardedSlot("default", null)
148+
const n0 = _createSlot("default", null)
152149
return n0
153150
})
154151
}, true)
@@ -157,15 +154,14 @@ export function render(_ctx) {
157154
`;
158155
159156
exports[`compiler: transform slot > forwarded slots > <slot> tag w/ v-for 1`] = `
160-
"import { forwardedSlotCreator as _forwardedSlotCreator, resolveComponent as _resolveComponent, createFor as _createFor, withVaporCtx as _withVaporCtx, createComponentWithFallback as _createComponentWithFallback } from 'vue';
157+
"import { resolveComponent as _resolveComponent, createSlot as _createSlot, createFor as _createFor, withVaporCtx as _withVaporCtx, createComponentWithFallback as _createComponentWithFallback } from 'vue';
161158
162159
export function render(_ctx) {
163-
const _createForwardedSlot = _forwardedSlotCreator()
164160
const _component_Comp = _resolveComponent("Comp")
165161
const n3 = _createComponentWithFallback(_component_Comp, null, {
166162
"default": _withVaporCtx(() => {
167163
const n0 = _createFor(() => (_ctx.b), (_for_item0) => {
168-
const n2 = _createForwardedSlot("default", null)
164+
const n2 = _createSlot("default", null)
169165
return n2
170166
})
171167
return n0
@@ -176,15 +172,14 @@ export function render(_ctx) {
176172
`;
177173
178174
exports[`compiler: transform slot > forwarded slots > <slot> tag w/ v-if 1`] = `
179-
"import { forwardedSlotCreator as _forwardedSlotCreator, resolveComponent as _resolveComponent, createIf as _createIf, withVaporCtx as _withVaporCtx, createComponentWithFallback as _createComponentWithFallback } from 'vue';
175+
"import { resolveComponent as _resolveComponent, createSlot as _createSlot, createIf as _createIf, withVaporCtx as _withVaporCtx, createComponentWithFallback as _createComponentWithFallback } from 'vue';
180176
181177
export function render(_ctx) {
182-
const _createForwardedSlot = _forwardedSlotCreator()
183178
const _component_Comp = _resolveComponent("Comp")
184179
const n3 = _createComponentWithFallback(_component_Comp, null, {
185180
"default": _withVaporCtx(() => {
186181
const n0 = _createIf(() => (_ctx.ok), () => {
187-
const n2 = _createForwardedSlot("default", null)
182+
const n2 = _createSlot("default", null)
188183
return n2
189184
})
190185
return n0

‎packages/compiler-vapor/src/generate.ts‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@ import {
1818
genCall,
1919
} from './generators/utils'
2020
import { setTemplateRefIdent } from './generators/templateRef'
21-
import { createForwardedSlotIdent } from './generators/slotOutlet'
2221

2322
export type CodegenOptions = Omit<BaseCodegenOptions, 'optimizeImports'>
2423

@@ -130,12 +129,6 @@ export function generate(
130129
`const ${setTemplateRefIdent} = ${context.helper('createTemplateRefSetter')}()`,
131130
)
132131
}
133-
if (ir.hasForwardedSlot) {
134-
push(
135-
NEWLINE,
136-
`const ${createForwardedSlotIdent} = ${context.helper('forwardedSlotCreator')}()`,
137-
)
138-
}
139132
push(...genBlockContent(ir.block, context, true))
140133
push(INDENT_END, NEWLINE)
141134

‎packages/compiler-vapor/src/generators/component.ts‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ import { genEventHandler } from './event'
4040
import { genDirectiveModifiers, genDirectivesForElement } from './directive'
4141
import { genBlock } from './block'
4242
import { genModelHandler } from './vModel'
43-
import { isBuiltInComponent } from '../utils'
43+
import { isBuiltInComponent, isTransitionTag } from '../utils'
4444

4545
export function genCreateComponent(
4646
operation: CreateComponentIRNode,
@@ -410,7 +410,6 @@ function genSlotBlockWithProps(oper: SlotBlockIRNode, context: CodegenContext) {
410410
let depth: number | undefined
411411
const { props, key, node } = oper
412412
const idsOfProps = new Set<string>()
413-
414413
if (props) {
415414
rawProps = props.content
416415
if ((isDestructureAssignment = !!props.ast)) {
@@ -459,7 +458,10 @@ function genSlotBlockWithProps(oper: SlotBlockIRNode, context: CodegenContext) {
459458
]
460459
}
461460

462-
if (node.type === NodeTypes.ELEMENT && !isBuiltInComponent(node.tag)) {
461+
if (
462+
node.type === NodeTypes.ELEMENT &&
463+
(!isBuiltInComponent(node.tag) || isTransitionTag(node.tag))
464+
) {
463465
// wrap with withVaporCtx to ensure correct currentInstance inside slot
464466
blockFn = [`${context.helper('withVaporCtx')}(`, ...blockFn, `)`]
465467
}

‎packages/compiler-vapor/src/generators/slotOutlet.ts‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,12 @@ import { genExpression } from './expression'
55
import { type CodeFragment, NEWLINE, buildCodeFragment, genCall } from './utils'
66
import { genRawProps } from './component'
77

8-
export const createForwardedSlotIdent = `_createForwardedSlot`
9-
108
export function genSlotOutlet(
119
oper: SlotOutletIRNode,
1210
context: CodegenContext,
1311
): CodeFragment[] {
1412
const { helper } = context
15-
const { id, name, fallback, forwarded, noSlotted } = oper
13+
const { id, name, fallback, noSlotted } = oper
1614
const [frag, push] = buildCodeFragment()
1715

1816
const nameExpr = name.isStatic
@@ -28,7 +26,7 @@ export function genSlotOutlet(
2826
NEWLINE,
2927
`const n${id} = `,
3028
...genCall(
31-
forwarded ? createForwardedSlotIdent : helper('createSlot'),
29+
helper('createSlot'),
3230
nameExpr,
3331
genRawProps(oper.props, context) || 'null',
3432
fallbackArg,

‎packages/compiler-vapor/src/ir/index.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,6 @@ export interface RootIRNode {
6767
directive: Set<string>
6868
block: BlockIRNode
6969
hasTemplateRef: boolean
70-
hasForwardedSlot: boolean
7170
}
7271

7372
export interface IfIRNode extends BaseIRNode {
@@ -220,7 +219,6 @@ export interface SlotOutletIRNode extends BaseIRNode {
220219
name: SimpleExpressionNode
221220
props: IRProps[]
222221
fallback?: BlockIRNode
223-
forwarded?: boolean
224222
noSlotted?: boolean
225223
parent?: number
226224
anchor?: number

‎packages/compiler-vapor/src/transform.ts‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -79,8 +79,6 @@ export class TransformContext<T extends AllNode = AllNode> {
7979

8080
inVOnce: boolean = false
8181
inVFor: number = 0
82-
inSlot: boolean = false
83-
8482
comment: CommentNode[] = []
8583
component: Set<string> = this.ir.component
8684
directive: Set<string> = this.ir.directive
@@ -221,7 +219,6 @@ export function transform(
221219
directive: new Set(),
222220
block: newBlock(node),
223221
hasTemplateRef: false,
224-
hasForwardedSlot: false,
225222
}
226223

227224
const context = new TransformContext(ir, node, options)

‎packages/compiler-vapor/src/transforms/transformSlotOutlet.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -99,15 +99,13 @@ export const transformSlotOutlet: NodeTransform = (node, context) => {
9999
}
100100

101101
return () => {
102-
if (context.inSlot) context.ir.hasForwardedSlot = true
103102
exitBlock && exitBlock()
104103
context.dynamic.operation = {
105104
type: IRNodeTypes.SLOT_OUTLET_NODE,
106105
id,
107106
name: slotName,
108107
props: irProps,
109108
fallback,
110-
forwarded: context.inSlot,
111109
noSlotted: !!(context.options.scopeId && !context.options.slotted),
112110
}
113111
}

‎packages/compiler-vapor/src/transforms/vSlot.ts‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -269,14 +269,7 @@ function createSlotBlock(
269269
block.dynamic.needsKey = true
270270
}
271271
const exitBlock = context.enterBlock(block)
272-
context.inSlot = true
273-
return [
274-
block,
275-
() => {
276-
context.inSlot = false
277-
exitBlock()
278-
},
279-
]
272+
return [block, exitBlock]
280273
}
281274

282275
function isNonWhitespaceContent(node: TemplateChildNode): boolean {

0 commit comments

Comments
 (0)