From 30b779cd730ffbbd086ac266211a652ff77e6630 Mon Sep 17 00:00:00 2001 From: Michael Rawlings Date: Thu, 29 Feb 2024 17:06:03 -0500 Subject: [PATCH] fix: if resume markers --- .../__snapshots__/html.expected/template.js | 2 +- .../__snapshots__/csr-sanitized.expected.md | 163 +++++++++ .../__snapshots__/csr.expected.md | 228 ++++++++++++ .../__snapshots__/dom.expected/template.js | 52 +++ .../__snapshots__/html.expected/template.js | 43 +++ .../resume-sanitized.expected.md | 163 +++++++++ .../__snapshots__/resume.expected.md | 339 ++++++++++++++++++ .../__snapshots__/ssr-sanitized.expected.md | 16 + .../__snapshots__/ssr.expected.md | 56 +++ .../fixtures/toggle-nested-2/template.marko | 14 + .../fixtures/toggle-nested-2/test.ts | 21 ++ .../__snapshots__/html.expected/template.js | 5 +- .../resume-sanitized.expected.md | 4 + .../__snapshots__/resume.expected.md | 19 + .../__snapshots__/ssr-sanitized.expected.md | 4 + .../__snapshots__/ssr.expected.md | 29 ++ .../__tests__/fixtures/toggle-nested/test.ts | 4 +- .../src/core/condition/else-if.ts | 8 +- .../src/core/condition/else.ts | 8 +- .../translator-tags/src/core/condition/if.ts | 29 +- 20 files changed, 1193 insertions(+), 14 deletions(-) create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr-sanitized.expected.md create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr.expected.md create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/dom.expected/template.js create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/html.expected/template.js create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume-sanitized.expected.md create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume.expected.md create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/ssr-sanitized.expected.md create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/ssr.expected.md create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/test.ts create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/resume-sanitized.expected.md create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/resume.expected.md create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/ssr-sanitized.expected.md create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/ssr.expected.md diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/html.expected/template.js b/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/html.expected/template.js index 243ba8fa9..f49476eae 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/html.expected/template.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/html.expected/template.js @@ -1,4 +1,4 @@ -import { markResumeNode as _markResumeNode, write as _write, escapeXML as _escapeXML, markResumeScopeStart as _markResumeScopeStart, serializedScope as _serializedScope, writeScope as _writeScope, nextScopeId as _nextScopeId, createRenderer as _createRenderer, register as _register, markResumeControlEnd as _markResumeControlEnd, writeEffect as _writeEffect, createTemplate as _createTemplate } from "@marko/runtime-tags/debug/html"; +import { markResumeNode as _markResumeNode, write as _write, markResumeScopeStart as _markResumeScopeStart, escapeXML as _escapeXML, serializedScope as _serializedScope, writeScope as _writeScope, nextScopeId as _nextScopeId, createRenderer as _createRenderer, register as _register, markResumeControlEnd as _markResumeControlEnd, writeEffect as _writeEffect, createTemplate as _createTemplate } from "@marko/runtime-tags/debug/html"; const _renderer = /* @__PURE__ */_createRenderer((input, _tagVar) => { const _scope0_id = _nextScopeId(); const show = true; diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr-sanitized.expected.md b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr-sanitized.expected.md new file mode 100644 index 000000000..d7e1dc5c3 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr-sanitized.expected.md @@ -0,0 +1,163 @@ +# Render {} +```html +
+ +
+``` + + +# Render +container.querySelector("#count").click() + +```html +
+ +
+``` + + +# Render +container.querySelector("#count").click() + +```html +
+ +
+``` + + +# Render +container.querySelector("#inner").click() + +```html +
+
+``` + + +# Render +container.querySelector("#inner").click() + +```html +
+ +
+``` + + +# Render +container.querySelector("#count").click() + +```html +
+ +
+``` + + +# Render +container.querySelector("#outer").click() + +```html +
+
+``` + + +# Render +container.querySelector("#outer").click() + +```html +
+ +
+``` + + +# Render +container.querySelector("#count").click() + +```html +
+ +
+``` \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr.expected.md b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr.expected.md new file mode 100644 index 000000000..b5c86fe09 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr.expected.md @@ -0,0 +1,228 @@ +# Render {} +```html +
+ + +
+``` + +# Mutations +``` +inserted div0 +``` + + +# Render +container.querySelector("#count").click() + +```html +
+ + +
+``` + +# Mutations +``` +div0/button2/#text0: "0" => "1" +``` + + +# Render +container.querySelector("#count").click() + +```html +
+ + +
+``` + +# Mutations +``` +div0/button2/#text0: "1" => "2" +``` + + +# Render +container.querySelector("#inner").click() + +```html +
+
+``` + +# Mutations +``` +inserted div0/#text2 +removed button after div0/#text2 +``` + + +# Render +container.querySelector("#inner").click() + +```html +
+ + +
+``` + +# Mutations +``` +inserted div0/button2 +removed #text after div0/button2 +div0/button2/#text0: " " => "2" +``` + + +# Render +container.querySelector("#count").click() + +```html +
+ + +
+``` + +# Mutations +``` +div0/button2/#text0: "2" => "3" +``` + + +# Render +container.querySelector("#outer").click() + +```html +
+
+``` + +# Mutations +``` +inserted div0/#text1 +removed button after div0/#text1 +removed button after div0/#text1 +removed #comment after div0/#text1 +``` + + +# Render +container.querySelector("#outer").click() + +```html +
+ + +
+``` + +# Mutations +``` +inserted div0/button1 +inserted #text +inserted div0/#comment3 +removed #text after div0/#comment3 +inserted div0/button2 +removed #text after div0/button2 +div0/button2/#text0: " " => "3" +``` + + +# Render +container.querySelector("#count").click() + +```html +
+ + +
+``` + +# Mutations +``` +div0/button2/#text0: "3" => "4" +``` \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/dom.expected/template.js b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/dom.expected/template.js new file mode 100644 index 000000000..5d4c43be0 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/dom.expected/template.js @@ -0,0 +1,52 @@ +import { on as _on, queueSource as _queueSource, data as _data, register as _register, queueEffect as _queueEffect, dynamicClosure as _dynamicClosure, registerSubscriber as _registerSubscriber, createRenderer as _createRenderer, conditional as _conditional, closure as _closure, dynamicSubscribers as _dynamicSubscribers, value as _value, inConditionalScope as _inConditionalScope, createTemplate as _createTemplate } from "@marko/runtime-tags/debug/dom"; +const _count$ifBody_effect = _register("packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_2_count", _scope => _on(_scope["#button/0"], "click", function () { + const { + _: { + _: { + count + } + } + } = _scope; + _queueSource(_scope._._, _count, count + 1); +})); +const _count$ifBody = _registerSubscriber("packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_2_count/subscriber", /* @__PURE__ */_dynamicClosure("count", (_scope, count) => { + _data(_scope["#text/1"], count); + _queueEffect(_scope, _count$ifBody_effect); +}, _scope => _scope._._)); +const _ifBody2 = _register("packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_2_renderer", /* @__PURE__ */_createRenderer("", /* get, next(1), get */" D ", void 0, [_count$ifBody])); +const _if2$ifBody = /* @__PURE__ */_conditional("#text/1"); +const _inner$ifBody_effect = _register("packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_1_inner", _scope => _on(_scope["#button/0"], "click", function () { + const { + _: { + inner + } + } = _scope; + _queueSource(_scope._, _inner, !inner); +})); +const _inner$ifBody = /* @__PURE__ */_closure("inner", (_scope, inner) => { + _queueEffect(_scope, _inner$ifBody_effect); + _if2$ifBody(_scope, inner ? _ifBody2 : null); +}, void 0, void 0, _if2$ifBody); +const _ifBody = _register("packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_1_renderer", /* @__PURE__ */_createRenderer("", /* get, over(1), replace */" b%D", void 0, [_inner$ifBody])); +const _if = /* @__PURE__ */_conditional("#text/1"); +const _count = /* @__PURE__ */_value("count", null, _dynamicSubscribers("count")); +const _inner = /* @__PURE__ */_value("inner", null, _inConditionalScope(_inner$ifBody, "#text/1")); +const _outer_effect = _register("packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_0_outer", _scope => _on(_scope["#button/0"], "click", function () { + const { + outer + } = _scope; + _queueSource(_scope, _outer, !outer); +})); +const _outer = /* @__PURE__ */_value("outer", (_scope, outer) => { + _queueEffect(_scope, _outer_effect); + _if(_scope, outer ? _ifBody : null); +}, void 0, _if); +const _setup = _scope => { + _outer(_scope, true); + _inner(_scope, true); + _count(_scope, 0); +}; +export const template = "
"; +export const walks = /* next(1), get, over(1), replace, out(1) */"D b%l"; +export const setup = _setup; +export default /* @__PURE__ */_createTemplate( /* @__PURE__ */_createRenderer(template, walks, setup), "packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko"); \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/html.expected/template.js b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/html.expected/template.js new file mode 100644 index 000000000..0faf39797 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/html.expected/template.js @@ -0,0 +1,43 @@ +import { markResumeNode as _markResumeNode, write as _write, markResumeScopeStart as _markResumeScopeStart, escapeXML as _escapeXML, serializedScope as _serializedScope, writeEffect as _writeEffect, writeScope as _writeScope, nextScopeId as _nextScopeId, createRenderer as _createRenderer, register as _register, markResumeControlSingleNodeEnd as _markResumeControlSingleNodeEnd, markResumeControlEnd as _markResumeControlEnd, createTemplate as _createTemplate } from "@marko/runtime-tags/debug/html"; +const _renderer = /* @__PURE__ */_createRenderer((input, _tagVar) => { + const _scope0_id = _nextScopeId(); + const outer = true; + const inner = true; + const count = 0; + _write(`
${_markResumeNode(_scope0_id, "#button/0")}`); + let _scope1_, _ifRenderer2; + if (outer) { + const _scope1_id = _nextScopeId(); + _write(`${_markResumeScopeStart(_scope1_id)}${_markResumeNode(_scope1_id, "#button/0")}`); + let _ifScopeId, _scope2_, _ifRenderer; + if (inner) { + const _scope2_id = _nextScopeId(); + _write(`${_markResumeNode(_scope2_id, "#button/0")}`); + _writeEffect(_scope2_id, "packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_2_count"); + _writeEffect(_scope2_id, "packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_2_count/subscriber"); + _writeScope(_scope2_id, _scope2_ = { + "_": _serializedScope(_scope1_id) + }); + _register(_ifRenderer = /* @__PURE__ */_createRenderer(() => {}), "packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_2_renderer"); + _ifScopeId = _scope2_id; + } + _write(`${_markResumeControlSingleNodeEnd(_scope1_id, "#text/1", _ifScopeId)}`); + _writeEffect(_scope1_id, "packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_1_inner"); + _writeScope(_scope1_id, _scope1_ = { + "#text/1!": _scope2_, + "#text/1(": _ifRenderer, + "_": _serializedScope(_scope0_id) + }); + _register(_ifRenderer2 = /* @__PURE__ */_createRenderer(() => {}), "packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_1_renderer"); + } + _write(`${_markResumeControlEnd(_scope0_id, "#text/1")}
`); + _writeEffect(_scope0_id, "packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko_0_outer"); + _writeScope(_scope0_id, { + "outer": outer, + "count": count, + "inner": inner, + "#text/1!": _scope1_, + "#text/1(": _ifRenderer2 + }); +}); +export default /* @__PURE__ */_createTemplate(_renderer, "packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko"); \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume-sanitized.expected.md b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume-sanitized.expected.md new file mode 100644 index 000000000..d7e1dc5c3 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume-sanitized.expected.md @@ -0,0 +1,163 @@ +# Render {} +```html +
+ +
+``` + + +# Render +container.querySelector("#count").click() + +```html +
+ +
+``` + + +# Render +container.querySelector("#count").click() + +```html +
+ +
+``` + + +# Render +container.querySelector("#inner").click() + +```html +
+
+``` + + +# Render +container.querySelector("#inner").click() + +```html +
+ +
+``` + + +# Render +container.querySelector("#count").click() + +```html +
+ +
+``` + + +# Render +container.querySelector("#outer").click() + +```html +
+
+``` + + +# Render +container.querySelector("#outer").click() + +```html +
+ +
+``` + + +# Render +container.querySelector("#count").click() + +```html +
+ +
+``` \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume.expected.md b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume.expected.md new file mode 100644 index 000000000..e8fc12a4b --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume.expected.md @@ -0,0 +1,339 @@ +# Render {} +```html + + + +
+ + + + +
+ + + +``` + +# Mutations +``` + +``` + + +# Render +container.querySelector("#count").click() + +```html + + + +
+ + + + +
+ + + +``` + +# Mutations +``` +#document/html0/body1/div0/button5/#text0: "0" => "1" +``` + + +# Render +container.querySelector("#count").click() + +```html + + + +
+ + + + +
+ + + +``` + +# Mutations +``` +#document/html0/body1/div0/button5/#text0: "1" => "2" +``` + + +# Render +container.querySelector("#inner").click() + +```html + + + +
+
+ + + +``` + +# Mutations +``` +removed #document/html0/body1/div0/#comment5 after #document/html0/body1/div0/#comment6 +inserted #document/html0/body1/div0/#comment5 +removed button after #document/html0/body1/div0/#comment5 +``` + + +# Render +container.querySelector("#inner").click() + +```html + + + +
+ + + +
+ + + +``` + +# Mutations +``` +inserted #document/html0/body1/div0/button5 +removed #comment after #document/html0/body1/div0/button5 +#document/html0/body1/div0/button5/#text0: " " => "2" +``` + + +# Render +container.querySelector("#count").click() + +```html + + + +
+ + + +
+ + + +``` + +# Mutations +``` +#document/html0/body1/div0/button5/#text0: "2" => "3" +``` + + +# Render +container.querySelector("#outer").click() + +```html + + + +
+
+ + + +``` + +# Mutations +``` +removed #document/html0/body1/div0/#comment2 after #comment +inserted #document/html0/body1/div0/#comment2 +removed #comment after #document/html0/body1/div0/#comment2 +removed button after #document/html0/body1/div0/#comment2 +removed #comment after #document/html0/body1/div0/#comment2 +removed button after #document/html0/body1/div0/#comment2 +removed #comment after #document/html0/body1/div0/#comment2 +``` + + +# Render +container.querySelector("#outer").click() + +```html + + + +
+ + +
+ + + +``` + +# Mutations +``` +inserted #document/html0/body1/div0/button2 +inserted #text +inserted #document/html0/body1/div0/#comment4 +removed #comment after #document/html0/body1/div0/#comment4 +inserted #document/html0/body1/div0/button3 +removed #text after #document/html0/body1/div0/button3 +#document/html0/body1/div0/button3/#text0: " " => "3" +``` + + +# Render +container.querySelector("#count").click() + +```html + + + +
+ + +
+ + + +``` + +# Mutations +``` +#document/html0/body1/div0/button3/#text0: "3" => "4" +``` \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/ssr-sanitized.expected.md b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/ssr-sanitized.expected.md new file mode 100644 index 000000000..538a6e576 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/ssr-sanitized.expected.md @@ -0,0 +1,16 @@ +# Render "End" +```html +
+ +
+``` \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/ssr.expected.md b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/ssr.expected.md new file mode 100644 index 000000000..ecb312874 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/ssr.expected.md @@ -0,0 +1,56 @@ +# Write +
+ + +# Render "End" +```html + + + +
+ + + + +
+ + + +``` + +# Mutations +``` +inserted #document/html0 +inserted #document/html0/head0 +inserted #document/html0/body1 +inserted #document/html0/body1/div0 +inserted #document/html0/body1/div0/button0 +inserted #document/html0/body1/div0/#comment1 +inserted #document/html0/body1/div0/#comment2 +inserted #document/html0/body1/div0/button3 +inserted #document/html0/body1/div0/#comment4 +inserted #document/html0/body1/div0/button5 +inserted #document/html0/body1/div0/button5/#text0 +inserted #document/html0/body1/div0/button5/#comment1 +inserted #document/html0/body1/div0/#comment6 +inserted #document/html0/body1/div0/#comment7 +inserted #document/html0/body1/div0/#comment8 +inserted #document/html0/body1/script1 +inserted #document/html0/body1/script1/#text0 +``` \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko new file mode 100644 index 000000000..d4a0d4d35 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/template.marko @@ -0,0 +1,14 @@ + + + +
+ + + +
\ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/test.ts b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/test.ts new file mode 100644 index 000000000..28e015bfd --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/test.ts @@ -0,0 +1,21 @@ +const clickOuter = (container: Element) => { + container.querySelector("#outer")!.click(); +}; +const clickInner = (container: Element) => { + container.querySelector("#inner")!.click(); +}; +const clickCount = (container: Element) => { + container.querySelector("#count")!.click(); +}; + +export const steps = [ + {}, + clickCount, + clickCount, + clickInner, + clickInner, + clickCount, + clickOuter, + clickOuter, + clickCount, +]; diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/html.expected/template.js b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/html.expected/template.js index de728462b..1be0152c1 100644 --- a/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/html.expected/template.js +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/html.expected/template.js @@ -1,4 +1,4 @@ -import { write as _write, escapeXML as _escapeXML, markResumeNode as _markResumeNode, serializedScope as _serializedScope, writeScope as _writeScope, nextScopeId as _nextScopeId, createRenderer as _createRenderer, register as _register, markResumeControlSingleNodeEnd as _markResumeControlSingleNodeEnd, markResumeScopeStart as _markResumeScopeStart, markResumeControlEnd as _markResumeControlEnd, createTemplate as _createTemplate } from "@marko/runtime-tags/debug/html"; +import { write as _write, markResumeScopeStart as _markResumeScopeStart, escapeXML as _escapeXML, markResumeNode as _markResumeNode, serializedScope as _serializedScope, writeScope as _writeScope, nextScopeId as _nextScopeId, createRenderer as _createRenderer, register as _register, markResumeControlSingleNodeEnd as _markResumeControlSingleNodeEnd, markResumeControlEnd as _markResumeControlEnd, createTemplate as _createTemplate } from "@marko/runtime-tags/debug/html"; const _renderer = /* @__PURE__ */_createRenderer((input, _tagVar) => { const _scope0_id = _nextScopeId(); const { @@ -10,6 +10,7 @@ const _renderer = /* @__PURE__ */_createRenderer((input, _tagVar) => { let _scope1_, _ifRenderer3; if (show) { const _scope1_id = _nextScopeId(); + _write(`${_markResumeScopeStart(_scope1_id)}`); let _ifScopeId, _scope2_, _ifRenderer; if (value1) { const _scope2_id = _nextScopeId(); @@ -31,7 +32,7 @@ const _renderer = /* @__PURE__ */_createRenderer((input, _tagVar) => { _register(_ifRenderer2 = /* @__PURE__ */_createRenderer(() => {}), "packages/translator-tags/src/__tests__/fixtures/toggle-nested/template.marko_3_renderer"); _ifScopeId2 = _scope3_id; } - _write(`${_markResumeScopeStart(_scope1_id)}${_markResumeControlSingleNodeEnd(_scope1_id, "#text/1", _ifScopeId2)}`); + _write(`${_markResumeControlSingleNodeEnd(_scope1_id, "#text/1", _ifScopeId2)}`); _writeScope(_scope1_id, _scope1_ = { "#text/0!": _scope2_, "#text/0(": _ifRenderer, diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/resume-sanitized.expected.md b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/resume-sanitized.expected.md new file mode 100644 index 000000000..c468fc924 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/resume-sanitized.expected.md @@ -0,0 +1,4 @@ +# Render {"show":false,"value1":"Hello","value2":"World"} +```html +
+``` \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/resume.expected.md b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/resume.expected.md new file mode 100644 index 000000000..39ce64504 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/resume.expected.md @@ -0,0 +1,19 @@ +# Render {"show":false,"value1":"Hello","value2":"World"} +```html + + + +
+ +
+ + + +``` + +# Mutations +``` + +``` \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/ssr-sanitized.expected.md b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/ssr-sanitized.expected.md new file mode 100644 index 000000000..cc0960696 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/ssr-sanitized.expected.md @@ -0,0 +1,4 @@ +# Render "End" +```html +
+``` \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/ssr.expected.md b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/ssr.expected.md new file mode 100644 index 000000000..2010012ff --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/ssr.expected.md @@ -0,0 +1,29 @@ +# Write +
+ + +# Render "End" +```html + + + +
+ +
+ + + +``` + +# Mutations +``` +inserted #document/html0 +inserted #document/html0/head0 +inserted #document/html0/body1 +inserted #document/html0/body1/div0 +inserted #document/html0/body1/div0/#comment0 +inserted #document/html0/body1/script1 +inserted #document/html0/body1/script1/#text0 +``` \ No newline at end of file diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested/test.ts b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/test.ts index 2e5034a48..e188ad148 100644 --- a/packages/translator-tags/src/__tests__/fixtures/toggle-nested/test.ts +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/test.ts @@ -24,6 +24,4 @@ export const steps = [ value1: "Goodbye", value2: "World", }, -]; -export const skip_ssr = true; -export const skip_resume = true; +]; \ No newline at end of file diff --git a/packages/translator-tags/src/core/condition/else-if.ts b/packages/translator-tags/src/core/condition/else-if.ts index f12e9483f..5fb36af76 100644 --- a/packages/translator-tags/src/core/condition/else-if.ts +++ b/packages/translator-tags/src/core/condition/else-if.ts @@ -1,7 +1,11 @@ import { type Tag, assertNoParams, assertNoVar } from "@marko/babel-utils"; import { types as t } from "@marko/compiler"; import customTag from "../../visitors/tag/custom-tag"; -import { exitBranchAnalyze, exitBranchTranslate } from "./if"; +import { + enterBranchTranslate, + exitBranchAnalyze, + exitBranchTranslate, +} from "./if"; export default { analyze: { @@ -43,6 +47,8 @@ export default { ); } } + + enterBranchTranslate(tag); }, exit(tag) { exitBranchTranslate(tag); diff --git a/packages/translator-tags/src/core/condition/else.ts b/packages/translator-tags/src/core/condition/else.ts index fc2d238da..12b4970fb 100644 --- a/packages/translator-tags/src/core/condition/else.ts +++ b/packages/translator-tags/src/core/condition/else.ts @@ -1,7 +1,11 @@ import { type Tag, assertNoParams, assertNoVar } from "@marko/babel-utils"; import type { types as t } from "@marko/compiler"; import customTag from "../../visitors/tag/custom-tag"; -import { exitBranchAnalyze, exitBranchTranslate } from "./if"; +import { + enterBranchTranslate, + exitBranchAnalyze, + exitBranchTranslate, +} from "./if"; export default { analyze: { @@ -38,6 +42,8 @@ export default { ); } } + + enterBranchTranslate(tag); }, exit(tag) { exitBranchTranslate(tag); diff --git a/packages/translator-tags/src/core/condition/if.ts b/packages/translator-tags/src/core/condition/if.ts index 74b66588f..07022ba8f 100644 --- a/packages/translator-tags/src/core/condition/if.ts +++ b/packages/translator-tags/src/core/condition/if.ts @@ -89,6 +89,7 @@ export default { if (isOutputHTML()) { writer.flushBefore(tag); } + enterBranchTranslate(tag); }, exit(tag) { exitBranchTranslate(tag); @@ -131,6 +132,13 @@ function getBranches(tag: t.NodePath, bodySection: Section) { return [isLast, branches] as const; } +function getRoot(tag: t.NodePath) { + if (isCoreTagName(tag, "if")) { + return tag; + } + return BRANCHES_LOOKUP.get(tag)![0].tag; +} + export function exitBranchAnalyze(tag: t.NodePath) { const tagBody = tag.get("body"); const bodySection = getOrCreateSection(tagBody); @@ -149,6 +157,21 @@ export function exitBranchAnalyze(tag: t.NodePath) { } } +export function enterBranchTranslate(tag: t.NodePath) { + const tagBody = tag.get("body"); + const bodySection = getSection(tagBody); + const rootExtra = getRoot(tag).node.extra!; + const isStateful = rootExtra.isStateful; + const singleNodeOptimization = rootExtra.singleNodeOptimization; + + if (isOutputHTML() && isStateful && !singleNodeOptimization) { + writer.writeTo(tagBody)`${callRuntime( + "markResumeScopeStart", + getScopeIdIdentifier(bodySection), + )}`; + } +} + export function exitBranchTranslate(tag: t.NodePath) { const tagBody = tag.get("body"); const section = getSection(tag); @@ -160,12 +183,6 @@ export function exitBranchTranslate(tag: t.NodePath) { if (isOutputHTML()) { if (isStateful) { - if (!singleNodeOptimization) { - writer.writePrependTo(tagBody)`${callRuntime( - "markResumeScopeStart", - getScopeIdIdentifier(bodySection), - )}`; - } setRegisterScopeBuilder(tag, (scope: t.Expression) => { return t.assignmentExpression( "=",