Skip to content

Commit 6cd3e1f

Browse files
edison1105edison1105
committed
fix: always spread cached array
1 parent b6f0b7b commit 6cd3e1f

File tree

8 files changed

+56
-66
lines changed

8 files changed

+56
-66
lines changed

‎packages/compiler-core/__tests__/transforms/__snapshots__/cacheStatic.spec.ts.snap

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,9 @@ return function render(_ctx, _cache) {
77
with (_ctx) {
88
const { createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = _Vue
99
10-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
10+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
1111
_createElementVNode("div", { key: "foo" }, null, -1 /* CACHED */)
12-
]).slice())))
12+
]))]))
1313
}
1414
}"
1515
`;
@@ -21,7 +21,7 @@ return function render(_ctx, _cache) {
2121
with (_ctx) {
2222
const { createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = _Vue
2323
24-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
24+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
2525
_createElementVNode("p", null, [
2626
_createElementVNode("span"),
2727
_createElementVNode("span")
@@ -30,7 +30,7 @@ return function render(_ctx, _cache) {
3030
_createElementVNode("span"),
3131
_createElementVNode("span")
3232
], -1 /* CACHED */)
33-
]).slice())))
33+
]))]))
3434
}
3535
}"
3636
`;
@@ -42,11 +42,11 @@ return function render(_ctx, _cache) {
4242
with (_ctx) {
4343
const { createCommentVNode: _createCommentVNode, createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = _Vue
4444
45-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
45+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
4646
_createElementVNode("div", null, [
4747
_createCommentVNode("comment")
4848
], -1 /* CACHED */)
49-
]).slice())))
49+
]))]))
5050
}
5151
}"
5252
`;
@@ -58,11 +58,11 @@ return function render(_ctx, _cache) {
5858
with (_ctx) {
5959
const { createElementVNode: _createElementVNode, createTextVNode: _createTextVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = _Vue
6060
61-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
61+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
6262
_createElementVNode("span", null, null, -1 /* CACHED */),
6363
_createTextVNode("foo", -1 /* CACHED */),
6464
_createElementVNode("div", null, null, -1 /* CACHED */)
65-
]).slice())))
65+
]))]))
6666
}
6767
}"
6868
`;
@@ -74,9 +74,9 @@ return function render(_ctx, _cache) {
7474
with (_ctx) {
7575
const { createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = _Vue
7676
77-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
77+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
7878
_createElementVNode("span", { class: "inline" }, "hello", -1 /* CACHED */)
79-
]).slice())))
79+
]))]))
8080
}
8181
}"
8282
`;
@@ -147,9 +147,9 @@ return function render(_ctx, _cache) {
147147
with (_ctx) {
148148
const { toDisplayString: _toDisplayString, createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = _Vue
149149
150-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
150+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
151151
_createElementVNode("span", null, "foo " + _toDisplayString(1) + " " + _toDisplayString(true), -1 /* CACHED */)
152-
]).slice())))
152+
]))]))
153153
}
154154
}"
155155
`;
@@ -161,9 +161,9 @@ return function render(_ctx, _cache) {
161161
with (_ctx) {
162162
const { toDisplayString: _toDisplayString, createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = _Vue
163163
164-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
164+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
165165
_createElementVNode("span", { foo: 0 }, _toDisplayString(1), -1 /* CACHED */)
166-
]).slice())))
166+
]))]))
167167
}
168168
}"
169169
`;
@@ -177,9 +177,9 @@ return function render(_ctx, _cache) {
177177
178178
return (_openBlock(), _createElementBlock("div", null, [
179179
(_openBlock(true), _createElementBlock(_Fragment, null, _renderList(1, (i) => {
180-
return (_openBlock(), _createElementBlock("div", null, [...((_cache[0] || (_cache[0] = [
180+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
181181
_createElementVNode("span", { class: "hi" }, null, -1 /* CACHED */)
182-
]).slice()))]))
182+
]))]))
183183
}), 256 /* UNKEYED_FRAGMENT */))
184184
]))
185185
}
@@ -215,9 +215,9 @@ return function render(_ctx, _cache) {
215215
const _directive_foo = _resolveDirective("foo")
216216
217217
return (_openBlock(), _createElementBlock("div", null, [
218-
_withDirectives((_openBlock(), _createElementBlock("svg", null, (_cache[0] || (_cache[0] = [
218+
_withDirectives((_openBlock(), _createElementBlock("svg", null, [...(_cache[0] || (_cache[0] = [
219219
_createElementVNode("path", { d: "M2,3H5.5L12" }, null, -1 /* CACHED */)
220-
]).slice()))), [
220+
]))])), [
221221
[_directive_foo]
222222
])
223223
]))
@@ -401,9 +401,9 @@ return function render(_ctx, _cache) {
401401
402402
return (_openBlock(), _createElementBlock("div", null, [
403403
ok
404-
? (_openBlock(), _createElementBlock("div", _hoisted_1, (_cache[0] || (_cache[0] = [
404+
? (_openBlock(), _createElementBlock("div", _hoisted_1, [...(_cache[0] || (_cache[0] = [
405405
_createElementVNode("span", null, null, -1 /* CACHED */)
406-
]).slice())))
406+
]))]))
407407
: _createCommentVNode("v-if", true)
408408
]))
409409
}
@@ -422,15 +422,15 @@ return function render(_ctx, _cache) {
422422
423423
return (_openBlock(), _createElementBlock(_Fragment, null, [
424424
_createCommentVNode("comment"),
425-
_createElementVNode("div", _hoisted_1, (_cache[0] || (_cache[0] = [
425+
_createElementVNode("div", _hoisted_1, [...(_cache[0] || (_cache[0] = [
426426
_createElementVNode("div", { id: "b" }, [
427427
_createElementVNode("div", { id: "c" }, [
428428
_createElementVNode("div", { id: "d" }, [
429429
_createElementVNode("div", { id: "e" }, "hello")
430430
])
431431
])
432432
], -1 /* CACHED */)
433-
]).slice()))
433+
]))])
434434
], 2112 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */))
435435
}
436436
}"
@@ -448,9 +448,9 @@ return function render(_ctx, _cache) {
448448
449449
return (_openBlock(), _createElementBlock("div", null, [
450450
(_openBlock(true), _createElementBlock(_Fragment, null, _renderList(list, (i) => {
451-
return (_openBlock(), _createElementBlock("div", _hoisted_1, (_cache[0] || (_cache[0] = [
451+
return (_openBlock(), _createElementBlock("div", _hoisted_1, [...(_cache[0] || (_cache[0] = [
452452
_createElementVNode("span", null, null, -1 /* CACHED */)
453-
]).slice())))
453+
]))]))
454454
}), 256 /* UNKEYED_FRAGMENT */))
455455
]))
456456
}

‎packages/compiler-core/__tests__/transforms/cacheStatic.spec.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ import { PatchFlags } from '@vue/shared'
2727

2828
const cachedChildrenArrayMatcher = (
2929
tags: string[],
30-
needArraySpread = false,
30+
needArraySpread = true,
3131
) => ({
3232
type: NodeTypes.JS_CACHE_EXPRESSION,
3333
needArraySpread,

‎packages/compiler-core/src/ast.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -420,7 +420,6 @@ export interface CacheExpression extends Node {
420420
needPauseTracking: boolean
421421
inVOnce: boolean
422422
needArraySpread: boolean
423-
cachedAsArray: boolean
424423
}
425424

426425
export interface MemoExpression extends CallExpression {
@@ -785,7 +784,6 @@ export function createCacheExpression(
785784
needPauseTracking: needPauseTracking,
786785
inVOnce,
787786
needArraySpread: false,
788-
cachedAsArray: false,
789787
loc: locStub,
790788
}
791789
}

‎packages/compiler-core/src/codegen.ts

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1012,11 +1012,10 @@ function genConditionalExpression(
10121012

10131013
function genCacheExpression(node: CacheExpression, context: CodegenContext) {
10141014
const { push, helper, indent, deindent, newline } = context
1015-
const { needPauseTracking, needArraySpread, cachedAsArray } = node
1015+
const { needPauseTracking, needArraySpread } = node
10161016
if (needArraySpread) {
10171017
push(`[...(`)
10181018
}
1019-
if (cachedAsArray) push(`(`)
10201019
push(`_cache[${node.index}] || (`)
10211020
if (needPauseTracking) {
10221021
indent()
@@ -1028,7 +1027,6 @@ function genCacheExpression(node: CacheExpression, context: CodegenContext) {
10281027
}
10291028
push(`_cache[${node.index}] = `)
10301029
genNode(node.value, context)
1031-
if (cachedAsArray) push(`).slice()`)
10321030
if (needPauseTracking) {
10331031
push(`).cacheIndex = ${node.index},`)
10341032
newline()

‎packages/compiler-core/src/transforms/cacheStatic.ts

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -214,18 +214,12 @@ function walk(
214214
}
215215
}
216216

217-
function getCacheExpression(
218-
value: JSChildNode,
219-
cachedAsArray: boolean = true,
220-
): CacheExpression {
217+
function getCacheExpression(value: JSChildNode): CacheExpression {
221218
const exp = context.cache(value)
222219
// #6978, #7138, #7114
223220
// a cached children array inside v-for can caused HMR errors since
224221
// it might be mutated when mounting the first item
225-
if (inFor && context.hmr) {
226-
exp.needArraySpread = true
227-
}
228-
exp.cachedAsArray = cachedAsArray
222+
exp.needArraySpread = true
229223
return exp
230224
}
231225

‎packages/compiler-dom/__tests__/transforms/__snapshots__/stringifyStatic.spec.ts.snap

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -4,49 +4,49 @@ exports[`stringify static html > eligible content (elements > 20) + non-eligible
44
"const { createElementVNode: _createElementVNode, createStaticVNode: _createStaticVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
55
66
return function render(_ctx, _cache) {
7-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
7+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
88
_createStaticVNode("<span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>", 20),
99
_createElementVNode("div", { key: "1" }, "1", -1 /* CACHED */),
1010
_createStaticVNode("<span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>", 20)
11-
]).slice())))
11+
]))]))
1212
}"
1313
`;
1414

1515
exports[`stringify static html > escape 1`] = `
1616
"const { toDisplayString: _toDisplayString, normalizeClass: _normalizeClass, createElementVNode: _createElementVNode, createStaticVNode: _createStaticVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
1717
1818
return function render(_ctx, _cache) {
19-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
19+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
2020
_createStaticVNode("<div><span class=\\"foo&gt;ar\\">1 + &lt;</span><span>&amp;</span><span class=\\"foo&gt;ar\\">1 + &lt;</span><span>&amp;</span><span class=\\"foo&gt;ar\\">1 + &lt;</span><span>&amp;</span><span class=\\"foo&gt;ar\\">1 + &lt;</span><span>&amp;</span><span class=\\"foo&gt;ar\\">1 + &lt;</span><span>&amp;</span></div>", 1)
21-
]).slice())))
21+
]))]))
2222
}"
2323
`;
2424

2525
exports[`stringify static html > serializing constant bindings 1`] = `
2626
"const { toDisplayString: _toDisplayString, normalizeClass: _normalizeClass, createElementVNode: _createElementVNode, createStaticVNode: _createStaticVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
2727
2828
return function render(_ctx, _cache) {
29-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
29+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
3030
_createStaticVNode("<div style=\\"color:red;\\"><span class=\\"foo bar\\">1 + false</span><span class=\\"foo bar\\">1 + false</span><span class=\\"foo bar\\">1 + false</span><span class=\\"foo bar\\">1 + false</span><span class=\\"foo bar\\">1 + false</span></div>", 1)
31-
]).slice())))
31+
]))]))
3232
}"
3333
`;
3434

3535
exports[`stringify static html > serializing template string style 1`] = `
3636
"const { toDisplayString: _toDisplayString, normalizeClass: _normalizeClass, createElementVNode: _createElementVNode, createStaticVNode: _createStaticVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
3737
3838
return function render(_ctx, _cache) {
39-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
39+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
4040
_createStaticVNode("<div style=\\"color:red;\\"><span class=\\"foo bar\\">1 + false</span><span class=\\"foo bar\\">1 + false</span><span class=\\"foo bar\\">1 + false</span><span class=\\"foo bar\\">1 + false</span><span class=\\"foo bar\\">1 + false</span></div>", 1)
41-
]).slice())))
41+
]))]))
4242
}"
4343
`;
4444

4545
exports[`stringify static html > should bail for <option> elements with null values 1`] = `
4646
"const { createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
4747
4848
return function render(_ctx, _cache) {
49-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
49+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
5050
_createElementVNode("select", null, [
5151
_createElementVNode("option", { value: null }),
5252
_createElementVNode("option", { value: "1" }),
@@ -55,23 +55,23 @@ return function render(_ctx, _cache) {
5555
_createElementVNode("option", { value: "1" }),
5656
_createElementVNode("option", { value: "1" })
5757
], -1 /* CACHED */)
58-
]).slice())))
58+
]))]))
5959
}"
6060
`;
6161
6262
exports[`stringify static html > should bail for <option> elements with number values 1`] = `
6363
"const { createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
6464
6565
return function render(_ctx, _cache) {
66-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
66+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
6767
_createElementVNode("select", null, [
6868
_createElementVNode("option", { value: 1 }),
6969
_createElementVNode("option", { value: 1 }),
7070
_createElementVNode("option", { value: 1 }),
7171
_createElementVNode("option", { value: 1 }),
7272
_createElementVNode("option", { value: 1 })
7373
], -1 /* CACHED */)
74-
]).slice())))
74+
]))]))
7575
}"
7676
`;
7777
@@ -95,7 +95,7 @@ exports[`stringify static html > should bail on bindings that are cached but not
9595
"const { createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
9696
9797
return function render(_ctx, _cache) {
98-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
98+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
9999
_createElementVNode("div", null, [
100100
_createElementVNode("span", { class: "foo" }, "foo"),
101101
_createElementVNode("span", { class: "foo" }, "foo"),
@@ -104,57 +104,57 @@ return function render(_ctx, _cache) {
104104
_createElementVNode("span", { class: "foo" }, "foo"),
105105
_createElementVNode("img", { src: _imports_0_ })
106106
], -1 /* CACHED */)
107-
]).slice())))
107+
]))]))
108108
}"
109109
`;
110110
111111
exports[`stringify static html > should work for <option> elements with string values 1`] = `
112112
"const { createElementVNode: _createElementVNode, createStaticVNode: _createStaticVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
113113
114114
return function render(_ctx, _cache) {
115-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
115+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
116116
_createStaticVNode("<select><option value=\\"1\\"></option><option value=\\"1\\"></option><option value=\\"1\\"></option><option value=\\"1\\"></option><option value=\\"1\\"></option></select>", 1)
117-
]).slice())))
117+
]))]))
118118
}"
119119
`;
120120
121121
exports[`stringify static html > should work for multiple adjacent nodes 1`] = `
122122
"const { createElementVNode: _createElementVNode, createStaticVNode: _createStaticVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
123123
124124
return function render(_ctx, _cache) {
125-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
125+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
126126
_createStaticVNode("<span class=\\"foo\\"></span><span class=\\"foo\\"></span><span class=\\"foo\\"></span><span class=\\"foo\\"></span><span class=\\"foo\\"></span>", 5)
127-
]).slice())))
127+
]))]))
128128
}"
129129
`;
130130
131131
exports[`stringify static html > should work on eligible content (elements > 20) 1`] = `
132132
"const { createElementVNode: _createElementVNode, createStaticVNode: _createStaticVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
133133
134134
return function render(_ctx, _cache) {
135-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
135+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
136136
_createStaticVNode("<div><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></div>", 1)
137-
]).slice())))
137+
]))]))
138138
}"
139139
`;
140140
141141
exports[`stringify static html > should work on eligible content (elements with binding > 5) 1`] = `
142142
"const { createElementVNode: _createElementVNode, createStaticVNode: _createStaticVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
143143
144144
return function render(_ctx, _cache) {
145-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
145+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
146146
_createStaticVNode("<div><span class=\\"foo\\"></span><span class=\\"foo\\"></span><span class=\\"foo\\"></span><span class=\\"foo\\"></span><span class=\\"foo\\"></span></div>", 1)
147-
]).slice())))
147+
]))]))
148148
}"
149149
`;
150150
151151
exports[`stringify static html > should work with bindings that are non-static but stringifiable 1`] = `
152152
"const { createElementVNode: _createElementVNode, createStaticVNode: _createStaticVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
153153
154154
return function render(_ctx, _cache) {
155-
return (_openBlock(), _createElementBlock("div", null, (_cache[0] || (_cache[0] = [
155+
return (_openBlock(), _createElementBlock("div", null, [...(_cache[0] || (_cache[0] = [
156156
_createStaticVNode("<div><span class=\\"foo\\">foo</span><span class=\\"foo\\">foo</span><span class=\\"foo\\">foo</span><span class=\\"foo\\">foo</span><span class=\\"foo\\">foo</span><img src=\\"" + _imports_0_ + "\\"></div>", 1)
157-
]).slice())))
157+
]))]))
158158
}"
159159
`;
160160

0 commit comments

Comments
 (0)