+57
-3
lines changedFilter options
+57
-3
lines changed Original file line number Diff line number Diff line change
@@ -62,6 +62,24 @@ return function render(_ctx, _cache) {
62 62
}"
63 63
`;
64 64 65 +
exports[`compiler: transform text element with custom directives and only one text child node 1`] = `
66 +
"const _Vue = Vue
67 + 68 +
return function render(_ctx, _cache) {
69 +
with (_ctx) {
70 +
const { toDisplayString: _toDisplayString, createTextVNode: _createTextVNode, resolveDirective: _resolveDirective, withDirectives: _withDirectives, openBlock: _openBlock, createBlock: _createBlock } = _Vue
71 + 72 +
const _directive_foo = _resolveDirective(\\"foo\\")
73 + 74 +
return _withDirectives((_openBlock(), _createBlock(\\"p\\", null, [
75 +
_createTextVNode(_toDisplayString(foo), 1 /* TEXT */)
76 +
], 512 /* NEED_PATCH */)), [
77 +
[_directive_foo]
78 +
])
79 +
}
80 +
}"
81 +
`;
82 + 65 83
exports[`compiler: transform text no consecutive text 1`] = `
66 84
"const _Vue = Vue
67 85
@@ -4,7 +4,8 @@ import {
4 4
transform,
5 5
NodeTypes,
6 6
generate,
7 -
ForNode
7 +
ForNode,
8 +
ElementNode
8 9
} from '../../src'
9 10
import { transformFor } from '../../src/transforms/vFor'
10 11
import { transformText } from '../../src/transforms/transformText'
@@ -20,8 +21,8 @@ function transformWithTextOpt(template: string, options: CompilerOptions = {}) {
20 21
nodeTransforms: [
21 22
transformFor,
22 23
...(options.prefixIdentifiers ? [transformExpression] : []),
23 -
transformText,
24 -
transformElement
24 +
transformElement,
25 +
transformText
25 26
],
26 27
...options
27 28
})
@@ -193,4 +194,29 @@ describe('compiler: transform text', () => {
193 194
}).code
194 195
).toMatchSnapshot()
195 196
})
197 + 198 +
// #3756
199 +
test('element with custom directives and only one text child node', () => {
200 +
const root = transformWithTextOpt(`<p v-foo>{{ foo }}</p>`)
201 +
expect(root.children.length).toBe(1)
202 +
expect(root.children[0].type).toBe(NodeTypes.ELEMENT)
203 +
expect((root.children[0] as ElementNode).children[0]).toMatchObject({
204 +
type: NodeTypes.TEXT_CALL,
205 +
codegenNode: {
206 +
type: NodeTypes.JS_CALL_EXPRESSION,
207 +
callee: CREATE_TEXT,
208 +
arguments: [
209 +
{
210 +
type: NodeTypes.INTERPOLATION,
211 +
content: {
212 +
type: NodeTypes.SIMPLE_EXPRESSION,
213 +
content: 'foo'
214 +
}
215 +
},
216 +
genFlagText(PatchFlags.TEXT)
217 +
]
218 +
}
219 +
})
220 +
expect(generate(root).code).toMatchSnapshot()
221 +
})
196 222
})
Original file line number Diff line number Diff line change
@@ -64,6 +64,16 @@ export const transformText: NodeTransform = (node, context) => {
64 64
(node.type === NodeTypes.ROOT ||
65 65
(node.type === NodeTypes.ELEMENT &&
66 66
node.tagType === ElementTypes.ELEMENT &&
67 +
// #3756
68 +
// custom directives can potentially add DOM elements arbitrarily,
69 +
// we need to avoid setting textContent of the element at runtime
70 +
// to avoid accidentally overwriting the DOM elements added
71 +
// by the user through custom directives.
72 +
!node.props.find(
73 +
p =>
74 +
p.type === NodeTypes.DIRECTIVE &&
75 +
!context.directiveTransforms[p.name]
76 +
) &&
67 77
// in compat mode, <template> tags with no special directives
68 78
// will be rendered as a fragment so its children must be
69 79
// converted into vnodes.
You can’t perform that action at this time.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4