From 8ca43b5c931867dc34efa8dafd7d28113b9c9e10 Mon Sep 17 00:00:00 2001
From: daiwei <daiwei521@126.com>
Date: Mon, 30 Dec 2024 17:20:07 +0800
Subject: [PATCH 1/6] pref(runtime-vapor): refactor apiCreateIf
---
packages/compiler-vapor/src/generators/if.ts | 30 +++++++++++---------
packages/runtime-vapor/src/apiCreateIf.ts | 8 ++----
2 files changed, 20 insertions(+), 18 deletions(-)
diff --git a/packages/compiler-vapor/src/generators/if.ts b/packages/compiler-vapor/src/generators/if.ts
index f4a3e599fab..d59d8661814 100644
--- a/packages/compiler-vapor/src/generators/if.ts
+++ b/packages/compiler-vapor/src/generators/if.ts
@@ -13,7 +13,7 @@ export function genIf(
const { condition, positive, negative, once } = oper
const [frag, push] = buildCodeFragment()
- const conditionExpr: CodeFragment[] = [
+ const codes: CodeFragment[] = [
'() => (',
...genExpression(condition, context),
')',
@@ -23,23 +23,27 @@ export function genIf(
let negativeArg: false | CodeFragment[] = false
if (negative) {
+ positiveArg.unshift(' ? ')
+ negativeArg = [' : ']
if (negative.type === IRNodeTypes.BLOCK) {
- negativeArg = genBlock(negative, context)
+ negativeArg.push(...genBlock(negative, context))
} else {
- negativeArg = ['() => ', ...genIf(negative!, context, true)]
+ negativeArg.push(...genIf(negative!, context, true))
}
+ } else {
+ positiveArg.unshift(' && (')
+ positiveArg.push(')')
}
- if (!isNested) push(NEWLINE, `const n${oper.id} = `)
- push(
- ...genCall(
- helper('createIf'),
- conditionExpr,
- positiveArg,
- negativeArg,
- once && 'true',
- ),
- )
+ codes.push(...positiveArg)
+ if (negativeArg) codes.push(...negativeArg)
+
+ if (isNested) {
+ push(...codes)
+ } else {
+ push(NEWLINE, `const n${oper.id} = `)
+ push(...genCall(helper('createIf'), codes, once && 'true'))
+ }
return frag
}
diff --git a/packages/runtime-vapor/src/apiCreateIf.ts b/packages/runtime-vapor/src/apiCreateIf.ts
index e4035313931..bcf01e96eac 100644
--- a/packages/runtime-vapor/src/apiCreateIf.ts
+++ b/packages/runtime-vapor/src/apiCreateIf.ts
@@ -2,17 +2,15 @@ import { type BlockFn, DynamicFragment } from './block'
import { renderEffect } from './renderEffect'
export function createIf(
- condition: () => any,
- b1: BlockFn,
- b2?: BlockFn,
+ ifBlockFn: () => BlockFn,
once?: boolean,
// hydrationNode?: Node,
): DynamicFragment {
const frag = __DEV__ ? new DynamicFragment('if') : new DynamicFragment()
if (once) {
- frag.update(condition() ? b1 : b2)
+ frag.update(ifBlockFn())
} else {
- renderEffect(() => frag.update(condition() ? b1 : b2))
+ renderEffect(() => frag.update(ifBlockFn()))
}
return frag
}
From b0a2ce5b0e1a61f1ea8fac4f4162bde70670a2eb Mon Sep 17 00:00:00 2001
From: daiwei <daiwei521@126.com>
Date: Mon, 30 Dec 2024 17:20:33 +0800
Subject: [PATCH 2/6] test: update tests
---
.../__snapshots__/compile.spec.ts.snap | 4 +-
.../transformTemplateRef.spec.ts.snap | 4 +-
.../transforms/__snapshots__/vIf.spec.ts.snap | 40 +++++++++----------
.../__snapshots__/vOnce.spec.ts.snap | 8 ++--
4 files changed, 28 insertions(+), 28 deletions(-)
diff --git a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
index fad91a7952d..ec297293c26 100644
--- a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
@@ -35,13 +35,13 @@ export function render(_ctx) {
const _directive_test = _resolveDirective("test")
const n4 = _createComponentWithFallback(_component_Comp, null, {
"default": () => {
- const n0 = _createIf(() => (true), () => {
+ const n0 = _createIf(() => (true) && (() => {
const n3 = t0()
const n2 = _createComponentWithFallback(_component_Bar)
_withDirectives(n2, [[_directive_hello, void 0, void 0, { world: true }]])
_insert(n2, n3)
return n3
- })
+ }))
return n0
}
}, true)
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap
index da863b2407f..9f6c6fea86b 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap
@@ -34,11 +34,11 @@ const t0 = _template("<div></div>", true)
export function render(_ctx) {
const _setTemplateRef = _createTemplateRefSetter()
- const n0 = _createIf(() => (true), () => {
+ const n0 = _createIf(() => (true) && (() => {
const n2 = t0()
_setTemplateRef(n2, "foo")
return n2
- })
+ }))
return n0
}"
`;
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
index a01ec4774d5..df1545d0f5d 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
@@ -5,11 +5,11 @@ exports[`compiler: v-if > basic v-if 1`] = `
const t0 = _template("<div></div>", true)
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.ok), () => {
+ const n0 = _createIf(() => (_ctx.ok) && (() => {
const n2 = t0()
_renderEffect(() => _setText(n2, _ctx.msg))
return n2
- })
+ }))
return n0
}"
`;
@@ -25,18 +25,18 @@ const t5 = _template("<input>")
export function render(_ctx) {
const n13 = t5()
- const n0 = _createIf(() => (_ctx.ok), () => {
+ const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- }, () => _createIf(() => (_ctx.orNot), () => {
+ } : () => (_ctx.orNot) ? () => {
const n5 = t1()
const n6 = t2()
return [n5, n6]
- }, () => {
+ } : () => {
const n10 = t3()
const n11 = t4()
return [n10, n11]
- }))
+ })
_renderEffect(() => _setText(n13, _ctx.text))
return [n0, n13]
}"
@@ -47,14 +47,14 @@ exports[`compiler: v-if > dedupe same template 1`] = `
const t0 = _template("<div>hello</div>")
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.ok), () => {
+ const n0 = _createIf(() => (_ctx.ok) && (() => {
const n2 = t0()
return n2
- })
- const n3 = _createIf(() => (_ctx.ok), () => {
+ }))
+ const n3 = _createIf(() => (_ctx.ok) && (() => {
const n5 = t0()
return n5
- })
+ }))
return [n0, n3]
}"
`;
@@ -66,13 +66,13 @@ const t1 = _template("hello")
const t2 = _template("<p></p>", true)
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.ok), () => {
+ const n0 = _createIf(() => (_ctx.ok) && (() => {
const n2 = t0()
const n3 = t1()
const n4 = t2()
_renderEffect(() => _setText(n4, _ctx.msg))
return [n2, n3, n4]
- })
+ }))
return n0
}"
`;
@@ -83,10 +83,10 @@ const t0 = _template("<div></div>")
const t1 = _template("<p></p>")
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.ok), () => {
+ const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- }, () => {
+ } : () => {
const n4 = t1()
return n4
})
@@ -101,16 +101,16 @@ const t1 = _template("<p></p>")
const t2 = _template("fine")
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.ok), () => {
+ const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- }, () => _createIf(() => (_ctx.orNot), () => {
+ } : () => (_ctx.orNot) ? () => {
const n4 = t1()
return n4
- }, () => {
+ } : () => {
const n7 = t2()
return n7
- }))
+ })
return n0
}"
`;
@@ -121,10 +121,10 @@ const t0 = _template("<div></div>")
const t1 = _template("<p></p>")
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.ok), () => {
+ const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- }, () => _createIf(() => (_ctx.orNot), () => {
+ } : () => (_ctx.orNot) && (() => {
const n4 = t1()
return n4
}))
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
index 39384169e10..ee25990a5a0 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
@@ -78,10 +78,10 @@ exports[`compiler: v-once > with v-if 1`] = `
const t0 = _template("<div></div>", true)
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.expr), () => {
+ const n0 = _createIf(() => (_ctx.expr) && (() => {
const n2 = t0()
return n2
- }, null, true)
+ }), true)
return n0
}"
`;
@@ -92,10 +92,10 @@ const t0 = _template("<div></div>")
const t1 = _template("<p></p>")
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.expr), () => {
+ const n0 = _createIf(() => (_ctx.expr) ? () => {
const n2 = t0()
return n2
- }, () => {
+ } : () => {
const n4 = t1()
return n4
}, true)
From 1dbd6424927c6b14b4a4d751b5d10d0955aa96e4 Mon Sep 17 00:00:00 2001
From: daiwei <daiwei521@126.com>
Date: Tue, 31 Dec 2024 09:30:16 +0800
Subject: [PATCH 3/6] chore: update
---
.../__snapshots__/compile.spec.ts.snap | 4 +-
.../transformTemplateRef.spec.ts.snap | 4 +-
.../transforms/__snapshots__/vIf.spec.ts.snap | 20 +--
.../__snapshots__/vOnce.spec.ts.snap | 4 +-
packages/compiler-vapor/src/generators/if.ts | 4 +-
.../__tests__/apiLifecycle.spec.ts | 29 ++--
.../__tests__/componentSlots.spec.ts | 11 +-
.../__tests__/dom/templateRef.spec.ts | 144 +++++++++---------
packages/runtime-vapor/__tests__/if.spec.ts | 102 +++++++------
packages/runtime-vapor/src/apiCreateIf.ts | 6 +-
10 files changed, 167 insertions(+), 161 deletions(-)
diff --git a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
index ec297293c26..f7c38ff4524 100644
--- a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
@@ -35,13 +35,13 @@ export function render(_ctx) {
const _directive_test = _resolveDirective("test")
const n4 = _createComponentWithFallback(_component_Comp, null, {
"default": () => {
- const n0 = _createIf(() => (true) && (() => {
+ const n0 = _createIf(() => (true) ? () => {
const n3 = t0()
const n2 = _createComponentWithFallback(_component_Bar)
_withDirectives(n2, [[_directive_hello, void 0, void 0, { world: true }]])
_insert(n2, n3)
return n3
- }))
+ } : undefined)
return n0
}
}, true)
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap
index 9f6c6fea86b..6daa919b8ca 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap
@@ -34,11 +34,11 @@ const t0 = _template("<div></div>", true)
export function render(_ctx) {
const _setTemplateRef = _createTemplateRefSetter()
- const n0 = _createIf(() => (true) && (() => {
+ const n0 = _createIf(() => (true) ? () => {
const n2 = t0()
_setTemplateRef(n2, "foo")
return n2
- }))
+ } : undefined)
return n0
}"
`;
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
index df1545d0f5d..58180483887 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
@@ -5,11 +5,11 @@ exports[`compiler: v-if > basic v-if 1`] = `
const t0 = _template("<div></div>", true)
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.ok) && (() => {
+ const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
_renderEffect(() => _setText(n2, _ctx.msg))
return n2
- }))
+ } : undefined)
return n0
}"
`;
@@ -47,14 +47,14 @@ exports[`compiler: v-if > dedupe same template 1`] = `
const t0 = _template("<div>hello</div>")
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.ok) && (() => {
+ const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- }))
- const n3 = _createIf(() => (_ctx.ok) && (() => {
+ } : undefined)
+ const n3 = _createIf(() => (_ctx.ok) ? () => {
const n5 = t0()
return n5
- }))
+ } : undefined)
return [n0, n3]
}"
`;
@@ -66,13 +66,13 @@ const t1 = _template("hello")
const t2 = _template("<p></p>", true)
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.ok) && (() => {
+ const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
const n3 = t1()
const n4 = t2()
_renderEffect(() => _setText(n4, _ctx.msg))
return [n2, n3, n4]
- }))
+ } : undefined)
return n0
}"
`;
@@ -124,10 +124,10 @@ export function render(_ctx) {
const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- } : () => (_ctx.orNot) && (() => {
+ } : () => (_ctx.orNot) ? () => {
const n4 = t1()
return n4
- }))
+ } : undefined)
return n0
}"
`;
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
index ee25990a5a0..64547034cfc 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
@@ -78,10 +78,10 @@ exports[`compiler: v-once > with v-if 1`] = `
const t0 = _template("<div></div>", true)
export function render(_ctx) {
- const n0 = _createIf(() => (_ctx.expr) && (() => {
+ const n0 = _createIf(() => (_ctx.expr) ? () => {
const n2 = t0()
return n2
- }), true)
+ } : undefined, true)
return n0
}"
`;
diff --git a/packages/compiler-vapor/src/generators/if.ts b/packages/compiler-vapor/src/generators/if.ts
index d59d8661814..e3c9b6ab475 100644
--- a/packages/compiler-vapor/src/generators/if.ts
+++ b/packages/compiler-vapor/src/generators/if.ts
@@ -31,8 +31,8 @@ export function genIf(
negativeArg.push(...genIf(negative!, context, true))
}
} else {
- positiveArg.unshift(' && (')
- positiveArg.push(')')
+ positiveArg.unshift(' ? ')
+ positiveArg.push(' : undefined')
}
codes.push(...positiveArg)
diff --git a/packages/runtime-vapor/__tests__/apiLifecycle.spec.ts b/packages/runtime-vapor/__tests__/apiLifecycle.spec.ts
index af9f10f9f42..1cc2e463c73 100644
--- a/packages/runtime-vapor/__tests__/apiLifecycle.spec.ts
+++ b/packages/runtime-vapor/__tests__/apiLifecycle.spec.ts
@@ -138,9 +138,8 @@ describe('api: lifecycle hooks', () => {
const { render, host } = define({
setup() {
// @ts-expect-error
- const n0 = createIf(
- () => toggle.value,
- () => createComponent(Child),
+ const n0 = createIf(() =>
+ toggle.value ? () => createComponent(Child) : undefined,
)
return n0
},
@@ -172,9 +171,8 @@ describe('api: lifecycle hooks', () => {
const { render, host } = define({
setup() {
// @ts-expect-error
- const n0 = createIf(
- () => toggle.value,
- () => createComponent(Child),
+ const n0 = createIf(() =>
+ toggle.value ? () => createComponent(Child) : undefined,
)
return n0
},
@@ -206,9 +204,8 @@ describe('api: lifecycle hooks', () => {
const { render, host } = define({
setup() {
// @ts-expect-error
- const n0 = createIf(
- () => toggle.value,
- () => createComponent(Child),
+ const n0 = createIf(() =>
+ toggle.value ? () => createComponent(Child) : undefined,
)
return n0
},
@@ -249,9 +246,10 @@ describe('api: lifecycle hooks', () => {
onUnmounted(() => calls.push('onUnmounted'))
// @ts-expect-error
- const n0 = createIf(
- () => toggle.value,
- () => createComponent(Mid, { count: () => count.value }),
+ const n0 = createIf(() =>
+ toggle.value
+ ? () => createComponent(Mid, { count: () => count.value })
+ : undefined,
)
return n0
},
@@ -428,9 +426,10 @@ describe('api: lifecycle hooks', () => {
const { render } = define({
setup() {
// @ts-expect-error
- return createIf(
- () => toggle.value,
- () => [createComponent(Child), createComponent(Child)],
+ return createIf(() =>
+ toggle.value
+ ? () => [createComponent(Child), createComponent(Child)]
+ : undefined,
)
},
})
diff --git a/packages/runtime-vapor/__tests__/componentSlots.spec.ts b/packages/runtime-vapor/__tests__/componentSlots.spec.ts
index f4ff0c31cba..5f1e7929d9f 100644
--- a/packages/runtime-vapor/__tests__/componentSlots.spec.ts
+++ b/packages/runtime-vapor/__tests__/componentSlots.spec.ts
@@ -447,11 +447,12 @@ describe('component: slots', () => {
setup() {
return createComponent(Child, null, {
default: () => {
- return createIf(
- () => toggle.value,
- () => {
- return document.createTextNode('content')
- },
+ return createIf(() =>
+ toggle.value
+ ? () => {
+ return document.createTextNode('content')
+ }
+ : () => [],
)
},
})
diff --git a/packages/runtime-vapor/__tests__/dom/templateRef.spec.ts b/packages/runtime-vapor/__tests__/dom/templateRef.spec.ts
index a9a116f8a55..41f637d9333 100644
--- a/packages/runtime-vapor/__tests__/dom/templateRef.spec.ts
+++ b/packages/runtime-vapor/__tests__/dom/templateRef.spec.ts
@@ -89,13 +89,14 @@ describe('api: template ref', () => {
},
render() {
const setRef = createTemplateRefSetter()
- const n0 = createIf(
- () => toggle.value,
- () => {
- const n1 = t0()
- setRef(n1 as Element, 'refKey')
- return n1
- },
+ const n0 = createIf(() =>
+ toggle.value
+ ? () => {
+ const n1 = t0()
+ setRef(n1 as Element, 'refKey')
+ return n1
+ }
+ : undefined,
)
return n0
},
@@ -160,13 +161,14 @@ describe('api: template ref', () => {
const t0 = template('<div></div>')
const { render } = define({
render() {
- const n0 = createIf(
- () => toggle.value,
- () => {
- const n1 = t0()
- createTemplateRefSetter()(n1 as Element, fn)
- return n1
- },
+ const n0 = createIf(() =>
+ toggle.value
+ ? () => {
+ const n1 = t0()
+ createTemplateRefSetter()(n1 as Element, fn)
+ return n1
+ }
+ : undefined,
)
return n0
},
@@ -371,18 +373,18 @@ describe('api: template ref', () => {
render() {
const instance = currentInstance!
const setRef = createTemplateRefSetter()
- const n0 = createIf(
- () => refToggle.value,
- () => {
- const n1 = t0()
- setRef(n1 as Element, 'foo')
- return n1
- },
- () => {
- const n1 = t1()
- setRef(n1 as Element, 'foo')
- return n1
- },
+ const n0 = createIf(() =>
+ refToggle.value
+ ? () => {
+ const n1 = t0()
+ setRef(n1 as Element, 'foo')
+ return n1
+ }
+ : () => {
+ const n1 = t1()
+ setRef(n1 as Element, 'foo')
+ return n1
+ },
)
watchEffect(
() => {
@@ -416,30 +418,31 @@ describe('api: template ref', () => {
const t1 = template('<li></li>')
const { render } = define({
render() {
- const n0 = createIf(
- () => show.value,
- () => {
- const n1 = t0()
- const n2 = createFor(
- () => list,
- state => {
- const n1 = t1()
- createTemplateRefSetter()(
- n1 as Element,
- listRefs,
- undefined,
- true,
+ const n0 = createIf(() =>
+ show.value
+ ? () => {
+ const n1 = t0()
+ const n2 = createFor(
+ () => list,
+ state => {
+ const n1 = t1()
+ createTemplateRefSetter()(
+ n1 as Element,
+ listRefs,
+ undefined,
+ true,
+ )
+ renderEffect(() => {
+ const [item] = state
+ setText(n1, item)
+ })
+ return n1
+ },
)
- renderEffect(() => {
- const [item] = state
- setText(n1, item)
- })
+ insert(n2, n1 as ParentNode)
return n1
- },
- )
- insert(n2, n1 as ParentNode)
- return n1
- },
+ }
+ : undefined,
)
return n0
},
@@ -479,30 +482,31 @@ describe('api: template ref', () => {
return { listRefs }
},
render() {
- const n0 = createIf(
- () => show.value,
- () => {
- const n1 = t0()
- const n2 = createFor(
- () => list,
- state => {
- const n1 = t1()
- createTemplateRefSetter()(
- n1 as Element,
- 'listRefs',
- undefined,
- true,
+ const n0 = createIf(() =>
+ show.value
+ ? () => {
+ const n1 = t0()
+ const n2 = createFor(
+ () => list,
+ state => {
+ const n1 = t1()
+ createTemplateRefSetter()(
+ n1 as Element,
+ 'listRefs',
+ undefined,
+ true,
+ )
+ renderEffect(() => {
+ const [item] = state
+ setText(n1, item)
+ })
+ return n1
+ },
)
- renderEffect(() => {
- const [item] = state
- setText(n1, item)
- })
+ insert(n2, n1 as ParentNode)
return n1
- },
- )
- insert(n2, n1 as ParentNode)
- return n1
- },
+ }
+ : undefined,
)
return n0
},
diff --git a/packages/runtime-vapor/__tests__/if.spec.ts b/packages/runtime-vapor/__tests__/if.spec.ts
index a7e6266a7e1..f768d0f7c96 100644
--- a/packages/runtime-vapor/__tests__/if.spec.ts
+++ b/packages/runtime-vapor/__tests__/if.spec.ts
@@ -38,21 +38,21 @@ describe('createIf', () => {
const n0 = t0()
insert(
- createIf(
- spyConditionFn,
- // v-if
- (spyIfFn ||= vi.fn(() => {
- const n2 = t1()
- renderEffect(() => {
- setText(n2, count.value)
- })
- return n2
- })),
- // v-else
- (spyElseFn ||= vi.fn(() => {
- const n4 = t2()
- return n4
- })),
+ createIf(() =>
+ spyConditionFn()
+ ? // v-if
+ (spyIfFn ||= vi.fn(() => {
+ const n2 = t1()
+ renderEffect(() => {
+ setText(n2, count.value)
+ })
+ return n2
+ }))
+ : // v-else
+ (spyElseFn ||= vi.fn(() => {
+ const n4 = t2()
+ return n4
+ })),
),
n0 as any as ParentNode,
)
@@ -61,7 +61,7 @@ describe('createIf', () => {
expect(host.innerHTML).toBe('<div><p>zero</p><!--if--></div>')
expect(spyConditionFn).toHaveBeenCalledTimes(1)
- expect(spyIfFn!).toHaveBeenCalledTimes(0)
+ expect(spyIfFn!).toBeUndefined()
expect(spyElseFn!).toHaveBeenCalledTimes(1)
count.value++
@@ -98,19 +98,21 @@ describe('createIf', () => {
const t0 = template('Vapor')
const t1 = template('Hello ')
const { host } = define(() => {
- const n1 = createIf(
- () => ok1.value,
- () => {
- const n2 = t1()
- const n3 = createIf(
- () => ok2.value,
- () => {
- const n4 = t0()
- return n4
- },
- )
- return [n2, n3]
- },
+ const n1 = createIf(() =>
+ ok1.value
+ ? () => {
+ const n2 = t1()
+ const n3 = createIf(() =>
+ ok2.value
+ ? () => {
+ const n4 = t0()
+ return n4
+ }
+ : undefined,
+ )
+ return [n2, n3]
+ }
+ : undefined,
)
return n1
}).render()
@@ -158,29 +160,29 @@ describe('createIf', () => {
const t0 = template('<p></p>')
const { instance } = define(() => {
- const n1 = createIf(
- spyConditionFn1,
- () => {
- const n2 = t0()
- withDirectives(children(n2, 0), [
- [vDirective, () => (update.value, '1')],
- ])
- return n2
- },
- () =>
- createIf(
- spyConditionFn2,
- () => {
+ const n1 = createIf(() =>
+ spyConditionFn1()
+ ? () => {
const n2 = t0()
- withDirectives(children(n2, 0), [[vDirective, () => '2']])
+ withDirectives(children(n2, 0), [
+ [vDirective, () => (update.value, '1')],
+ ])
return n2
- },
- () => {
- const n2 = t0()
- withDirectives(children(n2, 0), [[vDirective, () => '3']])
- return n2
- },
- ),
+ }
+ : () =>
+ createIf(() =>
+ spyConditionFn2()
+ ? () => {
+ const n2 = t0()
+ withDirectives(children(n2, 0), [[vDirective, () => '2']])
+ return n2
+ }
+ : () => {
+ const n2 = t0()
+ withDirectives(children(n2, 0), [[vDirective, () => '3']])
+ return n2
+ },
+ ),
)
return [n1]
}).render()
diff --git a/packages/runtime-vapor/src/apiCreateIf.ts b/packages/runtime-vapor/src/apiCreateIf.ts
index bcf01e96eac..fb2c4881205 100644
--- a/packages/runtime-vapor/src/apiCreateIf.ts
+++ b/packages/runtime-vapor/src/apiCreateIf.ts
@@ -2,15 +2,15 @@ import { type BlockFn, DynamicFragment } from './block'
import { renderEffect } from './renderEffect'
export function createIf(
- ifBlockFn: () => BlockFn,
+ ifBlockGetter: () => BlockFn | undefined,
once?: boolean,
// hydrationNode?: Node,
): DynamicFragment {
const frag = __DEV__ ? new DynamicFragment('if') : new DynamicFragment()
if (once) {
- frag.update(ifBlockFn())
+ frag.update(ifBlockGetter())
} else {
- renderEffect(() => frag.update(ifBlockFn()))
+ renderEffect(() => frag.update(ifBlockGetter()))
}
return frag
}
From 952e1708b19f46b3a33b7f745cd2dcf730afffae Mon Sep 17 00:00:00 2001
From: daiwei <daiwei521@126.com>
Date: Tue, 31 Dec 2024 10:45:35 +0800
Subject: [PATCH 4/6] chore: update
---
.../__tests__/transforms/__snapshots__/vIf.spec.ts.snap | 6 +++---
packages/compiler-vapor/src/generators/if.ts | 4 ++--
2 files changed, 5 insertions(+), 5 deletions(-)
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
index 58180483887..419c8420d50 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
@@ -28,7 +28,7 @@ export function render(_ctx) {
const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- } : () => (_ctx.orNot) ? () => {
+ } : _ctx.orNot ? () => {
const n5 = t1()
const n6 = t2()
return [n5, n6]
@@ -104,7 +104,7 @@ export function render(_ctx) {
const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- } : () => (_ctx.orNot) ? () => {
+ } : _ctx.orNot ? () => {
const n4 = t1()
return n4
} : () => {
@@ -124,7 +124,7 @@ export function render(_ctx) {
const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- } : () => (_ctx.orNot) ? () => {
+ } : _ctx.orNot ? () => {
const n4 = t1()
return n4
} : undefined)
diff --git a/packages/compiler-vapor/src/generators/if.ts b/packages/compiler-vapor/src/generators/if.ts
index e3c9b6ab475..cccb1607f17 100644
--- a/packages/compiler-vapor/src/generators/if.ts
+++ b/packages/compiler-vapor/src/generators/if.ts
@@ -14,9 +14,9 @@ export function genIf(
const [frag, push] = buildCodeFragment()
const codes: CodeFragment[] = [
- '() => (',
+ isNested?undefined:'() => (',
...genExpression(condition, context),
- ')',
+ isNested?undefined:')',
]
let positiveArg = genBlock(positive, context)
From 8484ddace56060cd46ef288a15cad40f6d176e4f Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Tue, 31 Dec 2024 02:46:28 +0000
Subject: [PATCH 5/6] [autofix.ci] apply automated fixes
---
packages/compiler-vapor/src/generators/if.ts | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/packages/compiler-vapor/src/generators/if.ts b/packages/compiler-vapor/src/generators/if.ts
index cccb1607f17..198c588cd79 100644
--- a/packages/compiler-vapor/src/generators/if.ts
+++ b/packages/compiler-vapor/src/generators/if.ts
@@ -14,9 +14,9 @@ export function genIf(
const [frag, push] = buildCodeFragment()
const codes: CodeFragment[] = [
- isNested?undefined:'() => (',
+ isNested ? undefined : '() => (',
...genExpression(condition, context),
- isNested?undefined:')',
+ isNested ? undefined : ')',
]
let positiveArg = genBlock(positive, context)
From 06f525249d8e0dfe209cd38b75b4b755b10cdc45 Mon Sep 17 00:00:00 2001
From: daiwei <daiwei521@126.com>
Date: Wed, 1 Jan 2025 18:25:22 +0800
Subject: [PATCH 6/6] chore: minor tweaks
---
.../__tests__/transforms/__snapshots__/vIf.spec.ts.snap | 6 +++---
packages/compiler-vapor/src/generators/if.ts | 4 ++--
2 files changed, 5 insertions(+), 5 deletions(-)
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
index 419c8420d50..bf02b33c0cc 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
@@ -28,7 +28,7 @@ export function render(_ctx) {
const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- } : _ctx.orNot ? () => {
+ } : (_ctx.orNot) ? () => {
const n5 = t1()
const n6 = t2()
return [n5, n6]
@@ -104,7 +104,7 @@ export function render(_ctx) {
const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- } : _ctx.orNot ? () => {
+ } : (_ctx.orNot) ? () => {
const n4 = t1()
return n4
} : () => {
@@ -124,7 +124,7 @@ export function render(_ctx) {
const n0 = _createIf(() => (_ctx.ok) ? () => {
const n2 = t0()
return n2
- } : _ctx.orNot ? () => {
+ } : (_ctx.orNot) ? () => {
const n4 = t1()
return n4
} : undefined)
diff --git a/packages/compiler-vapor/src/generators/if.ts b/packages/compiler-vapor/src/generators/if.ts
index 198c588cd79..d6b320d66d9 100644
--- a/packages/compiler-vapor/src/generators/if.ts
+++ b/packages/compiler-vapor/src/generators/if.ts
@@ -14,9 +14,9 @@ export function genIf(
const [frag, push] = buildCodeFragment()
const codes: CodeFragment[] = [
- isNested ? undefined : '() => (',
+ isNested ? '(' : '() => (',
...genExpression(condition, context),
- isNested ? undefined : ')',
+ ')',
]
let positiveArg = genBlock(positive, context)