diff --git a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap index 533252b6b..95bd002d2 100644 --- a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap +++ b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap @@ -35,7 +35,7 @@ export function render(_ctx) { const _directive_test = _resolveDirective("test") const n4 = _createComponent(_component_Comp, null, [ { - default: () => { + "default": () => { const n0 = _createIf(() => (true), () => { const n3 = t0() const n2 = _createComponent(_component_Bar) diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vSlot.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vSlot.spec.ts.snap index 518b4408b..454104a43 100644 --- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vSlot.spec.ts.snap +++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vSlot.spec.ts.snap @@ -102,7 +102,7 @@ export function render(_ctx) { const _component_Comp = _resolveComponent("Comp") const n1 = _createComponent(_component_Comp, null, [ { - default: () => { + "default": () => { const n0 = t0() return n0 } @@ -122,11 +122,11 @@ export function render(_ctx) { const _component_Comp = _resolveComponent("Comp") const n4 = _createComponent(_component_Comp, null, [ { - one: () => { + "one": () => { const n0 = t0() return n0 }, - default: () => { + "default": () => { const n2 = t1() const n3 = t2() return [n2, n3] @@ -146,11 +146,11 @@ export function render(_ctx) { const _component_Comp = _resolveComponent("Comp") const n5 = _createComponent(_component_Comp, null, [ { - default: _withDestructure(({ foo }) => [foo], (_ctx0) => { + "default": _withDestructure(({ foo }) => [foo], (_ctx0) => { const n2 = t0() const n1 = _createComponent(_component_Inner, null, [ { - default: _withDestructure(({ bar }) => [bar], (_ctx1) => { + "default": _withDestructure(({ bar }) => [bar], (_ctx1) => { const n0 = _createTextNode(() => [_ctx0[0] + _ctx1[0] + _ctx.baz]) return n0 }) @@ -190,7 +190,7 @@ export function render(_ctx) { const _component_Comp = _resolveComponent("Comp") const n1 = _createComponent(_component_Comp, null, [ { - named: _withDestructure(({ foo }) => [foo], (_ctx0) => { + "named": _withDestructure(({ foo }) => [foo], (_ctx0) => { const n0 = _createTextNode(() => [_ctx0[0] + _ctx.bar]) return n0 }) @@ -207,7 +207,7 @@ export function render(_ctx) { const _component_Comp = _resolveComponent("Comp") const n1 = _createComponent(_component_Comp, null, [ { - default: _withDestructure(({ foo }) => [foo], (_ctx0) => { + "default": _withDestructure(({ foo }) => [foo], (_ctx0) => { const n0 = _createTextNode(() => [_ctx0[0] + _ctx.bar]) return n0 }) @@ -216,3 +216,19 @@ export function render(_ctx) { return n1 }" `; + +exports[`compiler: transform slot > quote slot name 1`] = ` +"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor'; + +export function render(_ctx) { + const _component_Comp = _resolveComponent("Comp") + const n1 = _createComponent(_component_Comp, null, [ + { + "nav-bar-title-before": () => { + return null + } + } + ], true) + return n1 +}" +`; diff --git a/packages/compiler-vapor/__tests__/transforms/vSlot.spec.ts b/packages/compiler-vapor/__tests__/transforms/vSlot.spec.ts index b5445d60e..a018c7b5e 100644 --- a/packages/compiler-vapor/__tests__/transforms/vSlot.spec.ts +++ b/packages/compiler-vapor/__tests__/transforms/vSlot.spec.ts @@ -398,6 +398,14 @@ describe('compiler: transform slot', () => { ]) }) + test('quote slot name', () => { + const { code } = compileWithSlots( + ``, + ) + expect(code).toMatchSnapshot() + expect(code).contains(`"nav-bar-title-before"`) + }) + describe('errors', () => { test('error on extraneous children w/ named default slot', () => { const onError = vi.fn() diff --git a/packages/compiler-vapor/src/generators/component.ts b/packages/compiler-vapor/src/generators/component.ts index 5971d50c5..8b2534b9f 100644 --- a/packages/compiler-vapor/src/generators/component.ts +++ b/packages/compiler-vapor/src/generators/component.ts @@ -175,7 +175,7 @@ function genStaticSlots({ slots }: IRSlotsStatic, context: CodegenContext) { return genMulti( DELIMITERS_OBJECT_NEWLINE, ...names.map(name => [ - `${name}: `, + `${JSON.stringify(name)}: `, ...genSlotBlockWithProps(slots[name], context), ]), )