From 825ec1500feda8b0c43245e7e92074af7f9dcca2 Mon Sep 17 00:00:00 2001 From: Evan You Date: Fri, 12 Jun 2020 16:09:27 -0400 Subject: [PATCH] fix(compiler-core): support static slot names containing dots for 2.x compat close #1241 --- .../compiler-core/__tests__/parse.spec.ts | 30 +++++++++++++++++++ packages/compiler-core/src/parse.ts | 24 ++++++++++----- 2 files changed, 46 insertions(+), 8 deletions(-) diff --git a/packages/compiler-core/__tests__/parse.spec.ts b/packages/compiler-core/__tests__/parse.spec.ts index 63201c4f4d9..7f12a70099d 100644 --- a/packages/compiler-core/__tests__/parse.spec.ts +++ b/packages/compiler-core/__tests__/parse.spec.ts @@ -1401,6 +1401,36 @@ describe('compiler: parse', () => { }) }) + // #1241 special case for 2.x compat + test('v-slot arg containing dots', () => { + const ast = baseParse('') + const directive = (ast.children[0] as ElementNode).props[0] + + expect(directive).toMatchObject({ + type: NodeTypes.DIRECTIVE, + name: 'slot', + arg: { + type: NodeTypes.SIMPLE_EXPRESSION, + content: 'foo.bar', + isStatic: true, + isConstant: true, + loc: { + source: 'foo.bar', + start: { + column: 14, + line: 1, + offset: 13 + }, + end: { + column: 21, + line: 1, + offset: 20 + } + } + } + }) + }) + test('v-pre', () => { const ast = baseParse( `
{{ bar }}
\n` + diff --git a/packages/compiler-core/src/parse.ts b/packages/compiler-core/src/parse.ts index b7725cff007..4a7dc541e26 100644 --- a/packages/compiler-core/src/parse.ts +++ b/packages/compiler-core/src/parse.ts @@ -603,14 +603,23 @@ function parseAttribute( name )! + const dirName = + match[1] || + (startsWith(name, ':') ? 'bind' : startsWith(name, '@') ? 'on' : 'slot') + let arg: ExpressionNode | undefined if (match[2]) { + const isSlot = dirName === 'slot' const startOffset = name.indexOf(match[2]) const loc = getSelection( context, getNewPosition(context, start, startOffset), - getNewPosition(context, start, startOffset + match[2].length) + getNewPosition( + context, + start, + startOffset + match[2].length + ((isSlot && match[3]) || '').length + ) ) let content = match[2] let isStatic = true @@ -626,6 +635,11 @@ function parseAttribute( } content = content.substr(1, content.length - 2) + } else if (isSlot) { + // #1241 special case for v-slot: vuetify relies extensively on slot + // names containing dots. v-slot doesn't have any modifiers and Vue 2.x + // supports such usage so we are keeping it consistent with 2.x. + content += match[3] || '' } arg = { @@ -647,13 +661,7 @@ function parseAttribute( return { type: NodeTypes.DIRECTIVE, - name: - match[1] || - (startsWith(name, ':') - ? 'bind' - : startsWith(name, '@') - ? 'on' - : 'slot'), + name: dirName, exp: value && { type: NodeTypes.SIMPLE_EXPRESSION, content: value.content,