From 505c5a8c0700fc44d061aa6ac9f4951c816c5881 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90=20Kevin=20Deng?= Date: Wed, 6 Dec 2023 14:25:15 +0800 Subject: [PATCH] fix: genExpression --- .../__snapshots__/compile.test.ts.snap | 94 +++++++++---------- .../compiler-vapor/__tests__/compile.test.ts | 6 +- packages/compiler-vapor/src/generate.ts | 45 ++++----- 3 files changed, 76 insertions(+), 69 deletions(-) diff --git a/packages/compiler-vapor/__tests__/__snapshots__/compile.test.ts.snap b/packages/compiler-vapor/__tests__/__snapshots__/compile.test.ts.snap index 62201cc17..892cee91d 100644 --- a/packages/compiler-vapor/__tests__/__snapshots__/compile.test.ts.snap +++ b/packages/compiler-vapor/__tests__/__snapshots__/compile.test.ts.snap @@ -7,10 +7,10 @@ export function render(_ctx) { const t0 = _template(\\"
count is .
\\") const n0 = t0() const { 0: [n3, { 1: [n2],}],} = _children(n0) - const n1 = _createTextNode(count.value) + const n1 = _createTextNode(_ctx.count) _insert(n1, n3, n2) _effect(() => { - _setText(n1, undefined, count.value) + _setText(n1, undefined, _ctx.count) }) return n0 }" @@ -24,7 +24,7 @@ export function render(_ctx) { const n0 = t0() const { 0: [n1],} = _children(n0) _effect(() => { - _setAttr(n1, \\"id\\", undefined, id.value) + _setAttr(n1, \\"id\\", undefined, _ctx.id) }) return n0 }" @@ -48,7 +48,7 @@ export function render(_ctx) { const n0 = t0() const { 0: [n1],} = _children(n0) _effect(() => { - _setHtml(n1, undefined, test) + _setHtml(n1, undefined, _ctx.test) }) return n0 }" @@ -74,7 +74,7 @@ export function render(_ctx) { const n0 = t0() const { 0: [n1],} = _children(n0) _effect(() => { - _setHtml(n1, undefined, code.value) + _setHtml(n1, undefined, _ctx.code) }) return n0 }" @@ -87,28 +87,28 @@ export function render(_ctx) { const t0 = _template(\\"
\\") const n0 = t0() const { 0: [n1], 1: [n2], 2: [n3], 3: [n4], 4: [n5], 5: [n6], 6: [n7], 7: [n8], 8: [n9], 9: [n10], 10: [n11], 11: [n12], 12: [n13], 13: [n14], 14: [n15], 15: [n16], 16: [n17], 17: [n18], 18: [n19], 19: [n20], 20: [n21], 21: [n22],} = _children(n0) - _on(n1, \\"click\\", _withModifiers(handleEvent, [\\"stop\\"])) - _on(n2, \\"submit\\", _withModifiers(handleEvent, [\\"prevent\\"])) - _on(n3, \\"click\\", _withModifiers(handleEvent, [\\"stop\\", \\"prevent\\"])) - _on(n4, \\"click\\", _withModifiers(handleEvent, [\\"self\\"])) - _on(n5, \\"click\\", handleEvent, { capture: true }) - _on(n6, \\"click\\", handleEvent, { once: true }) - _on(n7, \\"scroll\\", handleEvent, { passive: true }) - _on(n8, \\"contextmenu\\", _withModifiers(handleEvent, [\\"right\\"])) - _on(n9, \\"click\\", _withModifiers(handleEvent, [\\"left\\"])) - _on(n10, \\"mouseup\\", _withModifiers(handleEvent, [\\"middle\\"])) - _on(n11, \\"contextmenu\\", _withModifiers(handleEvent, [\\"right\\"])) - _on(n12, \\"keyup\\", _withKeys(handleEvent, [\\"enter\\"])) - _on(n13, \\"keyup\\", _withKeys(handleEvent, [\\"tab\\"])) - _on(n14, \\"keyup\\", _withKeys(handleEvent, [\\"delete\\"])) - _on(n15, \\"keyup\\", _withKeys(handleEvent, [\\"esc\\"])) - _on(n16, \\"keyup\\", _withKeys(handleEvent, [\\"space\\"])) - _on(n17, \\"keyup\\", _withKeys(handleEvent, [\\"up\\"])) - _on(n18, \\"keyup\\", _withKeys(handleEvent, [\\"down\\"])) - _on(n19, \\"keyup\\", _withKeys(handleEvent, [\\"left\\"])) - _on(n20, \\"keyup\\", _withModifiers(submit, [\\"middle\\"])) - _on(n21, \\"keyup\\", _withModifiers(submit, [\\"middle\\", \\"self\\"])) - _on(n22, \\"keyup\\", _withKeys(_withModifiers(handleEvent, [\\"self\\"]), [\\"enter\\"])) + _on(n1, \\"click\\", _withModifiers(_ctx.handleEvent, [\\"stop\\"])) + _on(n2, \\"submit\\", _withModifiers(_ctx.handleEvent, [\\"prevent\\"])) + _on(n3, \\"click\\", _withModifiers(_ctx.handleEvent, [\\"stop\\", \\"prevent\\"])) + _on(n4, \\"click\\", _withModifiers(_ctx.handleEvent, [\\"self\\"])) + _on(n5, \\"click\\", _ctx.handleEvent, { capture: true }) + _on(n6, \\"click\\", _ctx.handleEvent, { once: true }) + _on(n7, \\"scroll\\", _ctx.handleEvent, { passive: true }) + _on(n8, \\"contextmenu\\", _withModifiers(_ctx.handleEvent, [\\"right\\"])) + _on(n9, \\"click\\", _withModifiers(_ctx.handleEvent, [\\"left\\"])) + _on(n10, \\"mouseup\\", _withModifiers(_ctx.handleEvent, [\\"middle\\"])) + _on(n11, \\"contextmenu\\", _withModifiers(_ctx.handleEvent, [\\"right\\"])) + _on(n12, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"enter\\"])) + _on(n13, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"tab\\"])) + _on(n14, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"delete\\"])) + _on(n15, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"esc\\"])) + _on(n16, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"space\\"])) + _on(n17, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"up\\"])) + _on(n18, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"down\\"])) + _on(n19, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"left\\"])) + _on(n20, \\"keyup\\", _withModifiers(_ctx.submit, [\\"middle\\"])) + _on(n21, \\"keyup\\", _withModifiers(_ctx.submit, [\\"middle\\", \\"self\\"])) + _on(n22, \\"keyup\\", _withKeys(_withModifiers(_ctx.handleEvent, [\\"self\\"]), [\\"enter\\"])) return n0 }" `; @@ -120,7 +120,7 @@ export function render(_ctx) { const t0 = _template(\\"
\\") const n0 = t0() const { 0: [n1],} = _children(n0) - _on(n1, \\"click\\", handleClick) + _on(n1, \\"click\\", _ctx.handleClick) return n0 }" `; @@ -132,7 +132,7 @@ export function render(_ctx) { const t0 = _template(\\"
\\") const n0 = t0() const { 0: [n1],} = _children(n0) - _setAttr(n1, \\"id\\", undefined, foo) + _setAttr(n1, \\"id\\", undefined, _ctx.foo) return n0 }" `; @@ -144,9 +144,9 @@ export function render(_ctx) { const t0 = _template(\\"
\\") const n0 = t0() const { 0: [n3, { 1: [n2],}],} = _children(n0) - const n1 = _createTextNode(msg.value) - _setText(n1, undefined, msg.value) - _setAttr(n2, \\"class\\", undefined, clz.value) + const n1 = _createTextNode(_ctx.msg) + _setText(n1, undefined, _ctx.msg) + _setAttr(n2, \\"class\\", undefined, _ctx.clz) _prepend(n3, n1) return n0 }" @@ -169,13 +169,13 @@ export function render(_ctx) { const t0 = _template(\\"
\\") const n0 = t0() const { 1: [n2],} = _children(n0) - const n1 = _createTextNode(bar) + const n1 = _createTextNode(_ctx.bar) _append(n2, n1) _effect(() => { - _setText(n1, undefined, bar) + _setText(n1, undefined, _ctx.bar) }) _effect(() => { - _setAttr(n2, \\"id\\", undefined, foo) + _setAttr(n2, \\"id\\", undefined, _ctx.foo) }) return n0 }" @@ -188,13 +188,13 @@ export function render(_ctx) { const t0 = _template(\\"
{{ bar }}
\\") const n0 = t0() const { 1: [n2],} = _children(n0) - const n1 = _createTextNode(bar.value) + const n1 = _createTextNode(_ctx.bar) _append(n2, n1) _effect(() => { - _setText(n1, undefined, bar.value) + _setText(n1, undefined, _ctx.bar) }) _effect(() => { - _setAttr(n2, \\"id\\", undefined, foo.value) + _setAttr(n2, \\"id\\", undefined, _ctx.foo) }) return n0 }" @@ -220,7 +220,7 @@ export function render(_ctx) { const n0 = t0() const { 0: [n1],} = _children(n0) _effect(() => { - _setText(n1, undefined, str.value) + _setText(n1, undefined, _ctx.str) }) return n0 }" @@ -253,24 +253,24 @@ export function render(_ctx) { const t0 = _template(\\"\\") const n0 = t0() const { 0: [n4, { 1: [n5],}],} = _children(n0) - const n1 = _createTextNode(count) - const n2 = _createTextNode(count) - const n3 = _createTextNode(count) + const n1 = _createTextNode(_ctx.count) + const n2 = _createTextNode(_ctx.count) + const n3 = _createTextNode(_ctx.count) _prepend(n4, n1) _insert(n2, n4, n5) _append(n4, n3) - _on(n4, \\"click\\", handleClick) + _on(n4, \\"click\\", _ctx.handleClick) _effect(() => { - _setText(n1, undefined, count) + _setText(n1, undefined, _ctx.count) }) _effect(() => { - _setText(n2, undefined, count) + _setText(n2, undefined, _ctx.count) }) _effect(() => { - _setText(n3, undefined, count) + _setText(n3, undefined, _ctx.count) }) _effect(() => { - _setAttr(n4, \\"id\\", undefined, count) + _setAttr(n4, \\"id\\", undefined, _ctx.count) }) return n0 }" diff --git a/packages/compiler-vapor/__tests__/compile.test.ts b/packages/compiler-vapor/__tests__/compile.test.ts index 4e72e8508..6c8adc018 100644 --- a/packages/compiler-vapor/__tests__/compile.test.ts +++ b/packages/compiler-vapor/__tests__/compile.test.ts @@ -7,7 +7,11 @@ import { import { type CompilerOptions, compile as _compile } from '../src' function compile(template: string | RootNode, options: CompilerOptions = {}) { - let { code } = _compile(template, options) + let { code } = _compile(template, { + ...options, + mode: 'module', + prefixIdentifiers: true, + }) return code } diff --git a/packages/compiler-vapor/src/generate.ts b/packages/compiler-vapor/src/generate.ts index a9c29d7cf..0f1ba8164 100644 --- a/packages/compiler-vapor/src/generate.ts +++ b/packages/compiler-vapor/src/generate.ts @@ -502,11 +502,10 @@ function genExpression(node: IRExpression, context: CodegenContext): void { // there was a parsing error ast === false ) { - return push(rawExpr, NewlineType.None, node.loc) + return push(rawExpr, NewlineType.None, loc) } if (isStatic) { - // TODO - return push(JSON.stringify(rawExpr)) + return push(JSON.stringify(rawExpr), NewlineType.None, loc) } if (ast === null) { @@ -522,27 +521,31 @@ function genExpression(node: IRExpression, context: CodegenContext): void { }, true, ) - ids.sort((a, b) => a.start! - b.start!) - ids.forEach((id, i) => { - // range is offset by -1 due to the wrapping parens when parsed - const start = id.start! - 1 - const end = id.end! - 1 - const last = ids[i - 1] + if (ids.length) { + ids.sort((a, b) => a.start! - b.start!) + ids.forEach((id, i) => { + // range is offset by -1 due to the wrapping parens when parsed + const start = id.start! - 1 + const end = id.end! - 1 + const last = ids[i - 1] - const leadingText = rawExpr.slice(last ? last.end! - 1 : 0, start) - if (leadingText.length) push(leadingText, NewlineType.Unknown) + const leadingText = rawExpr.slice(last ? last.end! - 1 : 0, start) + if (leadingText.length) push(leadingText, NewlineType.Unknown) - const source = rawExpr.slice(start, end) - genIdentifier(source, context, { - start: advancePositionWithClone(node.loc.start, source, start), - end: advancePositionWithClone(node.loc.start, source, end), - source, + const source = rawExpr.slice(start, end) + genIdentifier(source, context, { + start: advancePositionWithClone(node.loc.start, source, start), + end: advancePositionWithClone(node.loc.start, source, end), + source, + }) + + if (i === ids.length - 1 && end < rawExpr.length) { + push(rawExpr.slice(end), NewlineType.Unknown) + } }) - - if (i === ids.length - 1 && end < rawExpr.length) { - push(rawExpr.slice(end), NewlineType.Unknown) - } - }) + } else { + push(rawExpr, NewlineType.Unknown) + } } function genIdentifier(