refactor(compiler-vapor): simplify renderEffect with a single statement

vuejs · Feb 6, 2024 · 9ffd4b6 · 9ffd4b6
1 parent d10a1a3
commit 9ffd4b6
Show file tree

Hide file tree

Showing 8 changed files with 64 additions and 159 deletions.
diff --git a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
@@ -10,9 +10,7 @@ export function render(_ctx) {
   const { 0: [n3, { 1: [n2],}],} = _children(n0)
   const n1 = _createTextNode()
   _insert(n1, n3, n2)
-  _renderEffect(() => {
-    _setText(n1, _ctx.count)
-  })
+  _renderEffect(() => _setText(n1, _ctx.count))
   return n0
 }"
 `;
@@ -153,12 +151,8 @@ export function render(_ctx) {
   const { 1: [n2],} = _children(n0)
   const n1 = _createTextNode()
   _append(n2, n1)
-  _renderEffect(() => {
-    _setText(n1, _ctx.bar)
-  })
-  _renderEffect(() => {
-    _setDynamicProp(n2, "id", _ctx.foo)
-  })
+  _renderEffect(() => _setText(n1, _ctx.bar))
+  _renderEffect(() => _setDynamicProp(n2, "id", _ctx.foo))
   return n0
 }"
 `;
@@ -173,12 +167,8 @@ export function render(_ctx) {
   const { 1: [n2],} = _children(n0)
   const n1 = _createTextNode()
   _append(n2, n1)
-  _renderEffect(() => {
-    _setText(n1, _ctx.bar)
-  })
-  _renderEffect(() => {
-    _setDynamicProp(n2, "id", _ctx.foo)
-  })
+  _renderEffect(() => _setText(n1, _ctx.bar))
+  _renderEffect(() => _setDynamicProp(n2, "id", _ctx.foo))
   return n0
 }"
 `;
@@ -193,12 +183,8 @@ export function render(_ctx) {
   const n1 = _createTextNode()
   const n2 = _createTextNode()
   _append(n0, n1, n2)
-  _renderEffect(() => {
-    _setText(n1, 1)
-  })
-  _renderEffect(() => {
-    _setText(n2, 2)
-  })
+  _renderEffect(() => _setText(n1, 1))
+  _renderEffect(() => _setText(n2, 2))
   return n0
 }"
 `;
@@ -222,8 +208,7 @@ export function render(_ctx) {
     _setText(n1, _ctx.count)
     _setText(n2, _ctx.count)
     _setText(n3, _ctx.count)
-    _setDynamicProp(n4, "id", _ctx.count)
-  })
+    _setDynamicProp(n4, "id", _ctx.count)})
   return n0
 }"
 `;
@@ -235,9 +220,7 @@ const t0 = _fragment()
   const n0 = t0()
   const n1 = _createTextNode()
   _append(n0, n1)
-  _renderEffect(() => {
-    _setText(n1, a + b.value)
-  })
+  _renderEffect(() => _setText(n1, a + b.value))
   return n0
 })()"
 `;
@@ -248,9 +231,7 @@ const t0 = _template("<div></div>")
 (() => {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProps(n1, { [key.value+1]: _unref(foo)[key.value+1]() })
-  })
+  _renderEffect(() => _setDynamicProps(n1, { [key.value+1]: _unref(foo)[key.value+1]() }))
   return n0
 })()"
 `;
@@ -286,30 +267,14 @@ export function render(_ctx) {
   _insert([n3, n4], n0, n9)
   _insert([n5, n6], n0, n10)
   _append(n0, n7, n8)
-  _renderEffect(() => {
-    _setText(n1, 1)
-  })
-  _renderEffect(() => {
-    _setText(n2, 2)
-  })
-  _renderEffect(() => {
-    _setText(n3, 4)
-  })
-  _renderEffect(() => {
-    _setText(n4, 5)
-  })
-  _renderEffect(() => {
-    _setText(n5, 7)
-  })
-  _renderEffect(() => {
-    _setText(n6, 8)
-  })
-  _renderEffect(() => {
-    _setText(n7, 'A')
-  })
-  _renderEffect(() => {
-    _setText(n8, 'B')
-  })
+  _renderEffect(() => _setText(n1, 1))
+  _renderEffect(() => _setText(n2, 2))
+  _renderEffect(() => _setText(n3, 4))
+  _renderEffect(() => _setText(n4, 5))
+  _renderEffect(() => _setText(n5, 7))
+  _renderEffect(() => _setText(n6, 8))
+  _renderEffect(() => _setText(n7, 'A'))
+  _renderEffect(() => _setText(n8, 'B'))
   return n0
 }"
 `;

diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformElement.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformElement.spec.ts.snap
@@ -8,9 +8,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setClass(n1, ["foo", { bar: _ctx.isBar }])
-  })
+  _renderEffect(() => _setClass(n1, ["foo", { bar: _ctx.isBar }]))
   return n0
 }"
 `;
@@ -23,9 +21,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setStyle(n1, ["color: green", { color: 'red' }])
-  })
+  _renderEffect(() => _setStyle(n1, ["color: green", { color: 'red' }]))
   return n0
 }"
 `;
@@ -49,9 +45,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProps(n1, _ctx.obj)
-  })
+  _renderEffect(() => _setDynamicProps(n1, _ctx.obj))
   return n0
 }"
 `;
@@ -64,9 +58,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProps(n1, { id: "foo" }, _ctx.obj)
-  })
+  _renderEffect(() => _setDynamicProps(n1, { id: "foo" }, _ctx.obj))
   return n0
 }"
 `;
@@ -79,9 +71,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProps(n1, _ctx.obj, { id: "foo" })
-  })
+  _renderEffect(() => _setDynamicProps(n1, _ctx.obj, { id: "foo" }))
   return n0
 }"
 `;
@@ -94,9 +84,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProps(n1, { id: "foo" }, _ctx.obj, { class: "bar" })
-  })
+  _renderEffect(() => _setDynamicProps(n1, { id: "foo" }, _ctx.obj, { class: "bar" }))
   return n0
 }"
 `;
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vBind.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vBind.spec.ts.snap
@@ -8,9 +8,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setAttr(n1, "foo-bar", _ctx.id)
-  })
+  _renderEffect(() => _setAttr(n1, "foo-bar", _ctx.id))
   return n0
 }"
 `;
@@ -23,9 +21,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setAttr(n1, "foo-bar", _ctx.fooBar)
-  })
+  _renderEffect(() => _setAttr(n1, "foo-bar", _ctx.fooBar))
   return n0
 }"
 `;
@@ -38,9 +34,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProp(n1, "fooBar", _ctx.id)
-  })
+  _renderEffect(() => _setDynamicProp(n1, "fooBar", _ctx.id))
   return n0
 }"
 `;
@@ -54,9 +48,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProps(n1, { [_camelize(_ctx.foo)]: _ctx.id })
-  })
+  _renderEffect(() => _setDynamicProps(n1, { [_camelize(_ctx.foo)]: _ctx.id }))
   return n0
 }"
 `;
@@ -69,9 +61,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProp(n1, "fooBar", _ctx.fooBar)
-  })
+  _renderEffect(() => _setDynamicProp(n1, "fooBar", _ctx.fooBar))
   return n0
 }"
 `;
@@ -84,9 +74,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDOMProp(n1, "fooBar", _ctx.fooBar)
-  })
+  _renderEffect(() => _setDOMProp(n1, "fooBar", _ctx.fooBar))
   return n0
 }"
 `;
@@ -99,9 +87,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDOMProp(n1, "fooBar", _ctx.id)
-  })
+  _renderEffect(() => _setDOMProp(n1, "fooBar", _ctx.id))
   return n0
 }"
 `;
@@ -114,9 +100,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDOMProp(n1, "fooBar", _ctx.id)
-  })
+  _renderEffect(() => _setDOMProp(n1, "fooBar", _ctx.id))
   return n0
 }"
 `;
@@ -129,9 +113,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProps(n1, { [\`.\${_ctx.fooBar}\`]: _ctx.id })
-  })
+  _renderEffect(() => _setDynamicProps(n1, { [\`.\${_ctx.fooBar}\`]: _ctx.id }))
   return n0
 }"
 `;
@@ -144,9 +126,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDOMProp(n1, "fooBar", _ctx.fooBar)
-  })
+  _renderEffect(() => _setDOMProp(n1, "fooBar", _ctx.fooBar))
   return n0
 }"
 `;
@@ -159,9 +139,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProp(n1, "id", _ctx.id)
-  })
+  _renderEffect(() => _setDynamicProp(n1, "id", _ctx.id))
   return n0
 }"
 `;
@@ -174,9 +152,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProps(n1, { [_ctx.id]: _ctx.id, [_ctx.title]: _ctx.title })
-  })
+  _renderEffect(() => _setDynamicProps(n1, { [_ctx.id]: _ctx.id, [_ctx.title]: _ctx.title }))
   return n0
 }"
 `;
@@ -189,9 +165,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProps(n1, { [_ctx.id]: _ctx.id, foo: "bar", checked: "" })
-  })
+  _renderEffect(() => _setDynamicProps(n1, { [_ctx.id]: _ctx.id, foo: "bar", checked: "" }))
   return n0
 }"
 `;
@@ -204,9 +178,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProp(n1, "camel-case", _ctx.camelCase)
-  })
+  _renderEffect(() => _setDynamicProp(n1, "camel-case", _ctx.camelCase))
   return n0
 }"
 `;
@@ -219,9 +191,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setDynamicProp(n1, "id", _ctx.id)
-  })
+  _renderEffect(() => _setDynamicProp(n1, "id", _ctx.id))
   return n0
 }"
 `;

diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vHtml.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vHtml.spec.ts.snap
@@ -8,9 +8,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setHtml(n1, _ctx.code)
-  })
+  _renderEffect(() => _setHtml(n1, _ctx.code))
   return n0
 }"
 `;
@@ -23,9 +21,7 @@ const t0 = _template("<div></div>")
 export function render(_ctx) {
   const n0 = t0()
   const { 0: [n1],} = _children(n0)
-  _renderEffect(() => {
-    _setHtml(n1, _ctx.test)
-  })
+  _renderEffect(() => _setHtml(n1, _ctx.test))
   return n0
 }"
 `;