archive-gh-me/marko
1
0
Fork 0
mirror of https://github.com/marko-js/marko.git synced 2025-12-08 19:26:05 +00:00
Code Issues Projects Releases Wiki Activity

fix: handle await closures, delay renders in pending scopes

Browse Source
This commit is contained in:
Ryan Turnquist 2025-11-21 13:31:56 -08:00
parent 8a147a7195
commit 40413b7da9
195 changed files with 6818 additions and 863 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/open-facts-obey.md Normal file
View File

@ -0,0 +1,5 @@
---
"@marko/runtime-tags": patch
---
Handle updating closures in a pending await and delay running renders in pending scopes

40
.sizes.json
View File

@ -7,8 +7,8 @@
{
"name": "*",
"total": {
"min": 20156,
"brotli": 7726
"min": 20366,
"brotli": 7839
}
},
{
@ -18,27 +18,27 @@
"brotli": 140
},
"runtime": {
"min": 4043,
"brotli": 1820
"min": 4076,
"brotli": 1832
},
"total": {
"min": 4217,
"brotli": 1960
"min": 4250,
"brotli": 1972
}
},
{
"name": "counter 💧",
"user": {
"min": 96,
"brotli": 89
"brotli": 87
},
"runtime": {
"min": 2191,
"brotli": 1154
"min": 2209,
"brotli": 1163
},
"total": {
"min": 2287,
"brotli": 1243
"min": 2305,
"brotli": 1250
}
},
{
@ -48,27 +48,27 @@
"brotli": 398
},
"runtime": {
"min": 7099,
"brotli": 3111
"min": 7132,
"brotli": 3114
},
"total": {
"min": 7834,
"brotli": 3509
"min": 7867,
"brotli": 3512
}
},
{
"name": "comments 💧",
"user": {
"min": 130,
"brotli": 116
"brotli": 115
},
"runtime": {
"min": 2343,
"brotli": 1196
"min": 2361,
"brotli": 1204
},
"total": {
"min": 2473,
"brotli": 1312
"min": 2491,
"brotli": 1319
}
}
]

2
.sizes/comments.ssr/entry.js
View File

@ -1,4 +1,4 @@
// size: 130 (min) 116 (brotli)
// size: 130 (min) 115 (brotli)
const $for_content__open__script = _script("a0", ($scope) =>
_on($scope.c, "click", function () {
$for_content__open($scope, !$scope.m);

2
.sizes/counter.ssr/entry.js
View File

@ -1,4 +1,4 @@
// size: 96 (min) 89 (brotli)
// size: 96 (min) 87 (brotli)
const $clickCount__script = _script("a0", ($scope) =>
_on($scope.a, "click", function () {
$clickCount($scope, $scope.c + 1);

352
.sizes/dom.js
View File

@ -1,4 +1,4 @@
// size: 20156 (min) 7726 (brotli)
// size: 20366 (min) 7839 (brotli)
var empty = [],
rest = Symbol();
function attrTag(attrs) {
@ -76,7 +76,7 @@ function normalizeDynamicRenderer(value) {
if (value) {
if ("string" == typeof value) return value;
let normalized = value.content || value.default || value;
if ("g" in normalized) return normalized;
if ("f" in normalized) return normalized;
}
}
var decodeAccessor = (num) =>
@ -240,7 +240,6 @@ function init(runtimeId = "M") {
(
branchId,
branch,
childBranch,
endedBranches,
accessor,
singleNode,
@ -270,6 +269,8 @@ function init(runtimeId = "M") {
(branch = scopeLookup[branchId] ||= { L: branchId }),
),
(branch.F = branch),
(branch.O = render.p?.[branchId]) &&
(branch.O.m = render.m),
singleNode)
) {
for (
@ -296,8 +297,8 @@ function init(runtimeId = "M") {
? startVisit
: parent.insertBefore(new Text(), visit)));
for (; i && orphanBranches[--i].L > branchId; )
(((childBranch = orphanBranches.pop()).N = branch),
(branch.D ||= new Set()).add(childBranch));
((orphanBranches[i].N = branch),
(branch.D ||= new Set()).add(orphanBranches.pop()));
nextToken();
}
(endedBranches &&
@ -745,9 +746,9 @@ function subscribeToScopeSet(ownerScope, accessor, scope) {
));
}
function _closure(...closureSignals) {
let [{ l: ___scopeInstancesAccessor, n: ___signalIndexAccessor }] =
let [{ k: ___scopeInstancesAccessor, l: ___signalIndexAccessor }] =
closureSignals;
for (let i = closureSignals.length; i--; ) closureSignals[i].t = i;
for (let i = closureSignals.length; i--; ) closureSignals[i].q = i;
return (scope) => {
if (scope[___scopeInstancesAccessor])
for (let childScope of scope[___scopeInstancesAccessor])
@ -759,20 +760,21 @@ function _closure(...closureSignals) {
);
};
}
function _closure_get(valueAccessor, fn, getOwnerScope) {
function _closure_get(valueAccessor, fn, getOwnerScope, resumeId) {
valueAccessor = decodeAccessor(valueAccessor);
let closureSignal = (scope) => {
((scope[closureSignal.n] = closureSignal.t),
((scope[closureSignal.l] = closureSignal.q),
fn(scope),
subscribeToScopeSet(
getOwnerScope ? getOwnerScope(scope) : scope._,
closureSignal.l,
closureSignal.k,
scope,
));
};
return (
(closureSignal.l = "B" + valueAccessor),
(closureSignal.n = "C" + valueAccessor),
(closureSignal.k = "B" + valueAccessor),
(closureSignal.l = "C" + valueAccessor),
resumeId && _resume(resumeId, closureSignal),
closureSignal
);
}
@ -891,12 +893,12 @@ function _content(id, template, walks, setup, params, dynamicScopesAccessor) {
walk((branch.S = branch.K = new Text()), walks, branch);
};
return (owner) => ({
g: id,
f: id,
h: clone,
e: owner,
j: setup,
a: params,
b: dynamicScopesAccessor,
b: params,
d: dynamicScopesAccessor,
});
}
function _content_resume(
@ -919,8 +921,8 @@ function _content_closures(renderer, closureFns) {
return (owner, closureValues) => {
let instance = renderer(owner);
return (
(instance.o = closureSignals),
(instance.u = closureValues),
(instance.n = closureSignals),
(instance.t = closureValues),
instance
);
};
@ -1097,13 +1099,13 @@ function attrsInternal(scope, nodeAccessor, nextAttrs) {
function _attr_content(scope, nodeAccessor, value) {
let content = (function (value) {
let renderer = normalizeDynamicRenderer(value);
if (renderer && renderer.g) return renderer;
if (renderer && renderer.f) return renderer;
})(value),
rendererAccessor = "D" + nodeAccessor;
scope[rendererAccessor] !== (scope[rendererAccessor] = content?.g) &&
scope[rendererAccessor] !== (scope[rendererAccessor] = content?.f) &&
(setConditionalRenderer(scope, nodeAccessor, content, createAndSetupBranch),
content?.b &&
subscribeToScopeSet(content.e, content.b, scope["A" + nodeAccessor]));
content?.d &&
subscribeToScopeSet(content.e, content.d, scope["A" + nodeAccessor]));
}
function _attrs_script(scope, nodeAccessor) {
let el = scope[nodeAccessor],
@ -1181,132 +1183,127 @@ function toInsertNode(startNode, endNode) {
}
function _await_promise(nodeAccessor, params) {
let promiseAccessor = "L" + (nodeAccessor = decodeAccessor(nodeAccessor)),
branchAccessor = "A" + nodeAccessor,
rendererAccessor = "D" + nodeAccessor;
branchAccessor = "A" + nodeAccessor;
return (
_enable_catch(),
(scope, promise) => {
let awaitCounter,
renderData,
tryWithPlaceholder = findBranchWithKey(scope, "Q");
tryWithPlaceholder
? ((renderData =
self[tryWithPlaceholder.$.runtimeId]?.[
tryWithPlaceholder.$.renderId
]),
(awaitCounter = tryWithPlaceholder.O ||=
renderData?.p?.[tryWithPlaceholder.L]),
awaitCounter?.i ||
(awaitCounter = tryWithPlaceholder.O =
{
d: 1,
i: 0,
c() {
if (!--awaitCounter.i) {
let placeholderBranch = tryWithPlaceholder.P;
((tryWithPlaceholder.P = 0),
placeholderBranch &&
(placeholderBranch.S.parentNode.insertBefore(
tryWithPlaceholder.S.parentNode,
placeholderBranch.S,
),
removeAndDestroyBranch(placeholderBranch)),
queueEffect(tryWithPlaceholder, (scope2) => {
let pendingEffects2 = scope2.J;
pendingEffects2 &&
((scope2.J = []), runEffects(pendingEffects2, !0));
}));
}
},
}),
placeholderShown.add(pendingEffects),
!scope[promiseAccessor] &&
!awaitCounter.i++ &&
let awaitBranch = scope[branchAccessor],
tryBranch = findBranchWithKey(scope, "Q") || awaitBranch,
awaitCounter = tryBranch.O;
(awaitCounter?.i ||
(awaitCounter = tryBranch.O =
{
i: 0,
c() {
if (--awaitCounter.i) return 1;
if (tryBranch === scope[branchAccessor])
scope[nodeAccessor].parentNode &&
scope[nodeAccessor].replaceWith(
scope[branchAccessor].S.parentNode,
);
else {
let placeholderBranch = tryBranch.P;
placeholderBranch &&
((tryBranch.P = 0),
placeholderBranch.S.parentNode.insertBefore(
tryBranch.S.parentNode,
placeholderBranch.S,
),
removeAndDestroyBranch(placeholderBranch));
}
queueEffect(tryBranch, (scope2) => {
let pendingEffects2 = scope2.J;
pendingEffects2 &&
((scope2.J = []), runEffects(pendingEffects2, 1));
});
},
}),
placeholderShown.add(pendingEffects),
scope[promiseAccessor] ||
(awaitBranch && (awaitBranch.W ||= []),
awaitCounter.i++ ||
requestAnimationFrame(
() =>
awaitCounter.i &&
runEffects(
prepareEffects(() =>
queueRender(
tryWithPlaceholder,
tryBranch === awaitBranch ? scope : tryBranch,
() => {
(insertBranchBefore(
(tryWithPlaceholder.P = createAndSetupBranch(
scope.$,
tryWithPlaceholder.Q,
tryWithPlaceholder._,
tryWithPlaceholder.S.parentNode,
)),
tryWithPlaceholder.S.parentNode,
tryWithPlaceholder.S,
),
tempDetachBranch(tryWithPlaceholder));
tryBranch.Q
? (insertBranchBefore(
(tryBranch.P = createAndSetupBranch(
scope.$,
tryBranch.Q,
tryBranch._,
tryBranch.S.parentNode,
)),
tryBranch.S.parentNode,
tryBranch.S,
),
tempDetachBranch(tryBranch))
: awaitBranch.V ||
(awaitBranch.S.parentNode.insertBefore(
scope[nodeAccessor],
awaitBranch.S,
),
tempDetachBranch(tryBranch));
},
-1,
),
),
),
))
: scope[branchAccessor] &&
!scope[promiseAccessor] &&
(scope[branchAccessor].S.parentNode.insertBefore(
scope[nodeAccessor],
scope[branchAccessor].S,
),
tempDetachBranch(scope[branchAccessor]));
)));
let thisPromise = (scope[promiseAccessor] = promise.then(
(data) => {
thisPromise === scope[promiseAccessor] &&
if (thisPromise === scope[promiseAccessor]) {
let referenceNode = scope[nodeAccessor];
((scope[promiseAccessor] = 0),
schedule(),
queueRender(
scope,
() => {
if (
(scope[branchAccessor]
? tryWithPlaceholder ||
scope[nodeAccessor].replaceWith(
scope[branchAccessor].S.parentNode,
)
: (insertBranchBefore(
(scope[branchAccessor] = createAndSetupBranch(
scope.$,
scope[rendererAccessor],
scope,
scope[nodeAccessor].parentNode,
)),
scope[nodeAccessor].parentNode,
scope[nodeAccessor],
),
scope[nodeAccessor].remove()),
params?.(scope[branchAccessor], [data]),
awaitCounter &&
(placeholderShown.add(pendingEffects),
queueMicrotask(run),
queueRender(
scope,
() => {
((awaitBranch = scope[branchAccessor]).V &&
(pendingScopes.push(awaitBranch),
setupBranch(awaitBranch.V, awaitBranch),
(awaitBranch.V = 0),
insertBranchBefore(
awaitBranch,
scope[nodeAccessor].parentNode,
scope[nodeAccessor],
),
referenceNode.remove()),
params?.(awaitBranch, [data]));
let pendingRenders2 = awaitBranch.W;
if (
((awaitBranch.W = 0),
pendingRenders2?.forEach(queuePendingRender),
placeholderShown.add(pendingEffects),
awaitCounter.c(),
!awaitCounter.d))
) {
let fnScopes = new Map(),
effects = renderData.m();
for (let i = 0; i < pendingEffects.length; ) {
let fn = pendingEffects[i++],
scopes = fnScopes.get(fn);
(scopes || fnScopes.set(fn, (scopes = new Set())),
scopes.add(pendingEffects[i++]));
awaitCounter.m)
) {
let fnScopes = new Map(),
effects = awaitCounter.m();
for (let i = 0; i < pendingEffects.length; ) {
let fn = pendingEffects[i++],
scopes = fnScopes.get(fn);
(scopes || fnScopes.set(fn, (scopes = new Set())),
scopes.add(pendingEffects[i++]));
}
for (let i = 0; i < effects.length; ) {
let fn = effects[i++],
scope2 = effects[i++];
fnScopes.get(fn)?.has(scope2) || queueEffect(scope2, fn);
}
}
for (let i = 0; i < effects.length; ) {
let fn = effects[i++],
scope2 = effects[i++];
fnScopes.get(fn)?.has(scope2) || queueEffect(scope2, fn);
}
}
},
-1,
));
},
-1,
));
}
},
(error) => {
thisPromise === scope[promiseAccessor] &&
(awaitCounter && (awaitCounter.i = 0),
(scope[promiseAccessor] = 0),
((awaitCounter.i = scope[promiseAccessor] = 0),
schedule(),
queueRender(scope, renderCatch, -1, error));
},
@ -1315,10 +1312,16 @@ function _await_promise(nodeAccessor, params) {
);
}
function _await_content(nodeAccessor, template, walks, setup) {
let rendererAccessor = "D" + decodeAccessor(nodeAccessor),
let branchAccessor = "A" + (nodeAccessor = decodeAccessor(nodeAccessor)),
renderer = _content("", template, walks, setup)();
return (scope) => {
scope[rendererAccessor] = renderer;
(((scope[branchAccessor] = createBranch(
scope.$,
renderer,
scope,
scope[nodeAccessor].parentNode,
)).V = renderer),
pendingScopes.pop());
};
}
function _try(nodeAccessor, template, walks, setup) {
@ -1356,7 +1359,7 @@ function renderCatch(scope, error) {
tryWithCatch.E,
createAndSetupBranch,
),
tryWithCatch.E.a?.(owner["A" + tryWithCatch.C], [error]));
tryWithCatch.E.b?.(owner["A" + tryWithCatch.C], [error]));
}
}
function _if(nodeAccessor, ...branchesArgs) {
@ -1390,7 +1393,7 @@ var _dynamic_tag = function (nodeAccessor, getContent, getTagVar, inputIsArgs) {
if (
scope[rendererAccessor] !==
(scope[rendererAccessor] =
normalizedRenderer?.g || normalizedRenderer) ||
normalizedRenderer?.f || normalizedRenderer) ||
(getContent && !normalizedRenderer && !scope[childScopeAccessor])
)
if (
@ -1413,18 +1416,18 @@ var _dynamic_tag = function (nodeAccessor, getContent, getTagVar, inputIsArgs) {
content,
createAndSetupBranch,
),
content.b &&
content.d &&
subscribeToScopeSet(
content.e,
content.b,
content.d,
scope[childScopeAccessor].Aa,
));
}
} else
normalizedRenderer?.b &&
normalizedRenderer?.d &&
subscribeToScopeSet(
normalizedRenderer.e,
normalizedRenderer.b,
normalizedRenderer.d,
scope[childScopeAccessor],
);
if (normalizedRenderer) {
@ -1439,14 +1442,14 @@ var _dynamic_tag = function (nodeAccessor, getContent, getTagVar, inputIsArgs) {
(childScope.Ia || childScope.Ea) &&
queueEffect(childScope, dynamicTagScript));
else {
for (let accessor in normalizedRenderer.o)
normalizedRenderer.o[accessor](
for (let accessor in normalizedRenderer.n)
normalizedRenderer.n[accessor](
childScope,
normalizedRenderer.u[accessor],
normalizedRenderer.t[accessor],
);
if (normalizedRenderer.a)
if (normalizedRenderer.b)
if (inputIsArgs)
normalizedRenderer.a(
normalizedRenderer.b(
childScope,
normalizedRenderer._ ? args[0] : args,
);
@ -1454,7 +1457,7 @@ var _dynamic_tag = function (nodeAccessor, getContent, getTagVar, inputIsArgs) {
let inputWithContent = getContent
? { ...args, content: getContent(scope) }
: args || {};
normalizedRenderer.a(
normalizedRenderer.b(
childScope,
normalizedRenderer._ ? inputWithContent : [inputWithContent],
);
@ -1728,7 +1731,8 @@ function bySecondArg(_item, index) {
function byFirstArg(name) {
return name;
}
var rendering,
var asyncRendersLookup,
rendering,
pendingRenders = [],
pendingRendersLookup = new Map(),
caughtError = new WeakSet(),
@ -1738,48 +1742,53 @@ var rendering,
scopeKeyOffset = 1e3;
function queueRender(scope, signal, signalKey, value, scopeKey = scope.L) {
let key = scopeKey * scopeKeyOffset + signalKey,
existingRender = signalKey >= 0 && pendingRendersLookup.get(key);
if (existingRender) existingRender.q = value;
else {
let render = { f: key, k: scope, x: signal, q: value },
i = pendingRenders.push(render) - 1;
for (; i; ) {
let parentIndex = (i - 1) >> 1,
parent = pendingRenders[parentIndex];
if (key - parent.f >= 0) break;
((pendingRenders[i] = parent), (i = parentIndex));
}
(signalKey >= 0 && pendingRendersLookup.set(key, render),
(pendingRenders[i] = render));
render = signalKey >= 0 && pendingRendersLookup.get(key);
render
? (render.o = value)
: (queuePendingRender((render = { a: key, g: scope, u: signal, o: value })),
signalKey >= 0 && pendingRendersLookup.set(key, render));
}
function queuePendingRender(render) {
let i = pendingRenders.push(render) - 1;
for (; i; ) {
let parentIndex = (i - 1) >> 1,
parent = pendingRenders[parentIndex];
if (render.a - parent.a >= 0) break;
((pendingRenders[i] = parent), (i = parentIndex));
}
pendingRenders[i] = render;
}
function queueEffect(scope, fn) {
pendingEffects.push(fn, scope);
}
function run() {
let effects = pendingEffects;
asyncRendersLookup = new Map();
try {
((rendering = 1), runRenders());
} finally {
((pendingRenders = []),
(pendingRendersLookup = new Map()),
(pendingEffects = []),
(rendering = 0));
((pendingRendersLookup = asyncRendersLookup),
(asyncRendersLookup = rendering = 0),
(pendingRenders = []),
(pendingEffects = []));
}
runEffects(effects);
}
function prepareEffects(fn) {
let prevRenders = pendingRenders,
prevRendersLookup = pendingRendersLookup,
prevEffects = pendingEffects,
prevLookup = asyncRendersLookup,
preparedEffects = (pendingEffects = []);
((pendingRenders = []), (pendingRendersLookup = new Map()));
((pendingRenders = []),
(asyncRendersLookup = pendingRendersLookup),
(pendingRendersLookup = new Map()));
try {
((rendering = 1), fn(), runRenders());
} finally {
((rendering = 0),
(pendingRendersLookup = asyncRendersLookup),
(asyncRendersLookup = prevLookup),
(pendingRenders = prevRenders),
(pendingRendersLookup = prevRendersLookup),
(pendingEffects = prevEffects));
}
return preparedEffects;
@ -1794,27 +1803,27 @@ function runRenders() {
if (render !== item) {
let i = 0,
mid = pendingRenders.length >> 1,
key = (pendingRenders[0] = item).f;
key = (pendingRenders[0] = item).a;
for (; i < mid; ) {
let bestChild = 1 + (i << 1),
right = bestChild + 1;
if (
(right < pendingRenders.length &&
pendingRenders[right].f - pendingRenders[bestChild].f < 0 &&
pendingRenders[right].a - pendingRenders[bestChild].a < 0 &&
(bestChild = right),
pendingRenders[bestChild].f - key >= 0)
pendingRenders[bestChild].a - key >= 0)
)
break;
((pendingRenders[i] = pendingRenders[bestChild]), (i = bestChild));
}
pendingRenders[i] = item;
}
render.k.F?.I || runRender(render);
render.g.F?.I || runRender(render);
}
for (let scope of pendingScopes) scope.H = 0;
pendingScopes = [];
}
var runRender = (render) => render.x(render.k, render.q),
var runRender = (render) => render.u(render.g, render.o),
_enable_catch = () => {
((_enable_catch = () => {}), enableBranches());
let handlePendingTry = (fn, scope, branch) => {
@ -1843,9 +1852,18 @@ var runRender = (render) => render.x(render.k, render.q),
)(runEffects)),
(runRender = ((runRender2) => (render) => {
try {
let branch = render.g.F;
for (; branch; ) {
if (branch.W)
return (
asyncRendersLookup.set(render.a, render),
branch.W.push(render)
);
branch = branch.N;
}
runRender2(render);
} catch (error) {
renderCatch(render.k, error);
renderCatch(render.g, error);
}
})(runRender)));
};
@ -1934,7 +1952,7 @@ var classIdToBranch = new Map(),
renderer.e,
document.body,
))),
renderer.a?.(branch, renderer._ ? args[0] : args));
renderer.b?.(branch, renderer._ ? args[0] : args));
})),
created)
)
@ -1972,7 +1990,7 @@ function mount(input = {}, reference, position) {
(nextSibling = reference.nextSibling));
}
let curValue,
args = this.a,
args = this.b,
effects = prepareEffects(() => {
((branch = createBranch($global, this, void 0, parentNode)),
(branch.T = (newValue) => {

2
.sizes/name-cache.json
View File

@ -1 +1 @@
{"vars":{"props":{"$empty":"e","$rest":"t","$attrTag":"n","$attrTags":"r","$attrTagIterator":"o","$_assert_hoist":"i","$forIn":"l","$forOf":"u","$forTo":"f","$forUntil":"a","$_call":"c","$stringifyClassObject":"s","$stringifyStyleObject":"d","$toDelimitedString":"h","$isEventHandler":"p","$getEventHandlerName":"g","$normalizeDynamicRenderer":"v","$decodeAccessor":"b","$toArray":"m","$push":"S","$defaultDelegator":"y","$_on":"A","$createDelegator":"k","$handleDelegated":"C","$stripSpacesAndPunctuation":"N","$nextScopeId":"_","$createScope":"w","$skipScope":"E","$findBranchWithKey":"I","$destroyBranch":"M","$destroyNestedBranches":"x","$removeAndDestroyBranch":"F","$insertBranchBefore":"L","$tempDetachBranch":"T","$walker":"$","$walk":"O","$walkInternal":"D","$branchesEnabled":"K","$isResuming":"G","$registeredValues":"R","$enableBranches":"B","$init":"H","$_resume":"U","$_var_resume":"V","$_el":"P","$_attr_input_checked":"W","$_attr_input_checked_script":"j","$_attr_input_checkedValue":"q","$_attr_input_checkedValue_script":"J","$_attr_input_value":"Q","$_attr_input_value_script":"X","$_attr_select_value":"Z","$_attr_select_value_script":"z","$setSelectOptions":"Y","$_attr_details_or_dialog_open":"ee","$_attr_details_or_dialog_open_script":"te","$inputType":"ne","$setValueAndUpdateSelection":"re","$setCheckboxValue":"oe","$controllableDelegate":"ie","$syncControllable":"le","$handleChange":"ue","$handleFormReset":"fe","$hasValueChanged":"ae","$hasCheckboxChanged":"ce","$hasSelectChanged":"se","$hasFormElementChanged":"de","$normalizeStrProp":"he","$normalizeBoolProp":"pe","$toValueProp":"ge","$isScheduled":"ve","$channel":"be","$parsers":"me","$parseHTML":"Se","$schedule":"ye","$flushAndWaitFrame":"Ae","$triggerMacroTask":"ke","$_let":"Ce","$_const":"Ne","$_or":"_e","$_for_closure":"we","$_if_closure":"Ee","$subscribeToScopeSet":"Ie","$_closure":"Me","$_closure_get":"xe","$_child_setup":"Fe","$_var":"Le","$_return":"Te","$_return_change":"$e","$_var_change":"Oe","$tagIdsByGlobal":"De","$_id":"Ke","$_script":"Ge","$_el_read":"Re","$traverseAllHoisted":"Be","$_hoist":"He","$createBranch":"Ue","$createAndSetupBranch":"Ve","$setupBranch":"Pe","$_content":"We","$_content_resume":"je","$_content_closures":"qe","$cloneCache":"Je","$_attr":"Qe","$setAttribute":"Xe","$_attr_class":"Ze","$_attr_class_items":"ze","$_attr_class_item":"Ye","$_attr_style":"et","$_attr_style_items":"tt","$_attr_style_item":"nt","$_text":"rt","$_text_content":"ot","$_attrs":"it","$_attrs_content":"lt","$hasAttrAlias":"ut","$_attrs_partial":"ft","$_attrs_partial_content":"at","$attrsInternal":"ct","$_attr_content":"st","$_attrs_script":"dt","$_html":"ht","$normalizeAttrValue":"pt","$normalizeString":"gt","$_lifecycle":"vt","$removeChildNodes":"bt","$insertChildNodes":"mt","$toInsertNode":"St","$_await":"yt","$_try":"At","$renderCatch":"kt","$_if":"Ct","$_dynamic_tag":"Nt","$_resume_dynamic_tag":"_t","$dynamicTagScript":"wt","$setConditionalRenderer":"Et","$_for_of":"It","$_for_in":"Mt","$_for_to":"xt","$_for_until":"Ft","$loop":"Lt","$createBranchWithTagNameOrRenderer":"Tt","$bySecondArg":"$t","$byFirstArg":"Ot","$rendering":"Dt","$pendingRenders":"Kt","$pendingRendersLookup":"Gt","$caughtError":"Rt","$placeholderShown":"Bt","$pendingEffects":"Ht","$pendingScopes":"Ut","$scopeKeyOffset":"Vt","$queueRender":"Pt","$queueEffect":"Wt","$run":"jt","$prepareEffects":"qt","$runEffects":"Jt","$runRenders":"Qt","$runRender":"Xt","$_enable_catch":"Zt","$$signalReset":"zt","$$signal":"Yt","$abort":"en","$classIdToBranch":"tn","$compat":"nn","$_template":"rn","$mount":"on","$$clickCount__script":"ta","$$clickCount":"aa","$$setup":"na","$forEach":"ln","$$if_content__setup":"sa","$$if_content__comment_comments":"ca","$$if_content__id":"ia","$$for_content__id":"la","$$for_content__input_path__OR__i":"ma","$$for_content__input_path":"oa","$$for_content__i":"ua","$$for_content__open__script":"ba","$$for_content__open":"ea","$$for_content__setup":"_a","$$for_content__comment_text":"da","$$for_content__if":"fa","$$for_content__comment_comments":"ha","$$for_content__$params":"ja","$$for_content__comment":"pa","$$for":"ga","$$input_comments":"ka","$$input_path":"ra","$isInit":"un","$runResumeEffects":"fn","$_await_promise":"an","$_await_content":"cn","$$input$1":"xa","$_title":"sn","$_to_text":"dn","$_attr_nonce":"hn"}}}
{"vars":{"props":{"$empty":"e","$rest":"t","$attrTag":"n","$attrTags":"r","$attrTagIterator":"i","$_assert_hoist":"o","$forIn":"l","$forOf":"u","$forTo":"f","$forUntil":"a","$_call":"c","$stringifyClassObject":"s","$stringifyStyleObject":"d","$toDelimitedString":"h","$isEventHandler":"p","$getEventHandlerName":"g","$normalizeDynamicRenderer":"v","$decodeAccessor":"b","$toArray":"m","$push":"S","$defaultDelegator":"y","$_on":"A","$createDelegator":"N","$handleDelegated":"k","$stripSpacesAndPunctuation":"C","$nextScopeId":"_","$createScope":"w","$skipScope":"E","$findBranchWithKey":"T","$destroyBranch":"I","$destroyNestedBranches":"F","$removeAndDestroyBranch":"M","$insertBranchBefore":"x","$tempDetachBranch":"L","$walker":"$","$walk":"O","$walkInternal":"D","$branchesEnabled":"K","$isResuming":"V","$registeredValues":"G","$enableBranches":"R","$init":"B","$runResumeEffects":"H","$_resume":"U","$_var_resume":"q","$_el":"P","$_attr_input_checked":"j","$_attr_input_checked_script":"W","$_attr_input_checkedValue":"J","$_attr_input_checkedValue_script":"Q","$_attr_input_value":"X","$_attr_input_value_script":"Z","$_attr_select_value":"z","$_attr_select_value_script":"Y","$setSelectOptions":"ee","$_attr_details_or_dialog_open":"te","$_attr_details_or_dialog_open_script":"ne","$inputType":"re","$setValueAndUpdateSelection":"ie","$setCheckboxValue":"oe","$controllableDelegate":"le","$syncControllable":"ue","$handleChange":"fe","$handleFormReset":"ae","$hasValueChanged":"ce","$hasCheckboxChanged":"se","$hasSelectChanged":"de","$hasFormElementChanged":"he","$normalizeStrProp":"pe","$normalizeBoolProp":"ge","$toValueProp":"ve","$isScheduled":"be","$channel":"me","$parsers":"Se","$parseHTML":"ye","$schedule":"Ae","$flushAndWaitFrame":"Ne","$triggerMacroTask":"ke","$_let":"Ce","$_const":"_e","$_or":"we","$_for_closure":"Ee","$_if_closure":"Te","$subscribeToScopeSet":"Ie","$_closure":"Fe","$_closure_get":"Me","$_child_setup":"xe","$_var":"Le","$_return":"$e","$_return_change":"Oe","$_var_change":"De","$tagIdsByGlobal":"Ke","$_id":"Ve","$_script":"Ge","$_el_read":"Re","$traverseAllHoisted":"Be","$_hoist":"He","$createBranch":"Ue","$createAndSetupBranch":"qe","$setupBranch":"Pe","$_content":"je","$_content_resume":"We","$_content_closures":"Je","$cloneCache":"Qe","$_to_text":"Xe","$_attr":"Ze","$setAttribute":"ze","$_attr_class":"Ye","$_attr_class_items":"et","$_attr_class_item":"tt","$_attr_style":"nt","$_attr_style_items":"rt","$_attr_style_item":"it","$_text":"ot","$_text_content":"lt","$_attrs":"ut","$_attrs_content":"ft","$hasAttrAlias":"at","$_attrs_partial":"ct","$_attrs_partial_content":"st","$attrsInternal":"dt","$_attr_content":"ht","$_attrs_script":"pt","$_html":"gt","$normalizeAttrValue":"vt","$normalizeString":"bt","$_lifecycle":"mt","$removeChildNodes":"St","$insertChildNodes":"yt","$toInsertNode":"At","$_await_promise":"Nt","$_await_content":"kt","$_try":"Ct","$renderCatch":"_t","$_if":"wt","$_dynamic_tag":"Et","$_resume_dynamic_tag":"Tt","$dynamicTagScript":"It","$setConditionalRenderer":"Ft","$_for_of":"Mt","$_for_in":"xt","$_for_to":"Lt","$_for_until":"$t","$loop":"Ot","$createBranchWithTagNameOrRenderer":"Dt","$bySecondArg":"Kt","$byFirstArg":"Vt","$asyncRendersLookup":"Gt","$rendering":"Rt","$pendingRenders":"Bt","$pendingRendersLookup":"Ht","$caughtError":"Ut","$placeholderShown":"qt","$pendingEffects":"Pt","$pendingScopes":"jt","$scopeKeyOffset":"Wt","$queueRender":"Jt","$queuePendingRender":"Qt","$queueEffect":"Xt","$run":"Zt","$prepareEffects":"zt","$runEffects":"Yt","$runRenders":"en","$runRender":"tn","$_enable_catch":"nn","$$signalReset":"rn","$$signal":"on","$abort":"ln","$classIdToBranch":"un","$compat":"fn","$_template":"an","$mount":"cn","$$clickCount__script":"ta","$$clickCount":"aa","$$setup":"na","$forEach":"sn","$$if_content__setup":"sa","$$if_content__comment_comments":"ia","$$if_content__id":"ca","$$for_content__id":"la","$$for_content__input_path__OR__i":"ma","$$for_content__input_path":"oa","$$for_content__i":"ua","$$for_content__open__script":"ba","$$for_content__open":"ea","$$for_content__setup":"_a","$$for_content__comment_text":"da","$$for_content__if":"fa","$$for_content__comment_comments":"ha","$$for_content__$params":"ja","$$for_content__comment":"pa","$$for":"ra","$$input_comments":"ga","$$input_path":"ka","$_attr_nonce":"dn"}}}

8
package-lock.json generated
View File

@ -51,7 +51,7 @@
"lint-staged": "^16.2.6",
"mocha": "^11.7.5",
"mocha-autotest": "^1.1.3",
"mocha-snap": "^5.0.0",
"mocha-snap": "^5.0.1",
"prettier": "^3.6.2",
"prettier-plugin-packagejson": "^2.5.19",
"pretty-format": "^30.2.0",
@ -7706,9 +7706,9 @@
}
},
"node_modules/mocha-snap": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/mocha-snap/-/mocha-snap-5.0.0.tgz",
"integrity": "sha512-tl0iQb2zkN1pE1vzQSSnuEyR8GkB/uECMdvK5dcXPEjC316K4bzNd36TgLEXadMyQDhy0ny6FZxChm6rJAs9+Q==",
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/mocha-snap/-/mocha-snap-5.0.1.tgz",
"integrity": "sha512-uEBt7J6qDm9ACi0+RhW1VkR8ER9GqwTW3iKE/O2Q07u8jxVentb7OfpAnWRnDmbP//K517olc7VlX1GG52Lc2w==",
"dev": true,
"license": "MIT",
"dependencies": {

2
package.json
View File

@ -66,7 +66,7 @@
"lint-staged": "^16.2.6",
"mocha": "^11.7.5",
"mocha-autotest": "^1.1.3",
"mocha-snap": "^5.0.0",
"mocha-snap": "^5.0.1",
"prettier": "^3.6.2",
"prettier-plugin-packagejson": "^2.5.19",
"pretty-format": "^30.2.0",

28
packages/runtime-tags/src/__tests__/fixtures/async-deep-recursive/__snapshots__/csr-sanitized.expected.md
View File

@ -6,6 +6,16 @@
```
# Render ASYNC
```html
<div
data-level="4"
>
LOADING...
</div>
```
# Render ASYNC
```html
<div
@ -48,6 +58,24 @@
```
# Render ASYNC
```html
<div
data-level="4"
>
<div
data-level="3"
>
<div
data-level="2"
>
LOADING...
</div>
</div>
</div>
```
# Render ASYNC
```html
<div

70
packages/runtime-tags/src/__tests__/fixtures/async-deep-recursive/__snapshots__/csr.expected.md
View File

@ -17,6 +17,27 @@
INSERT #comment0, #comment1, div, #comment2, #comment3
```
# Render ASYNC
```html
<!---->
<!---->
<div
data-level="4"
>
LOADING...
</div>
<!---->
<!---->
```
# Mutations
```
INSERT div/#text
REMOVE #document-fragment/#comment0 after div/#text
REMOVE #document-fragment/#text after div/#text
REMOVE #document-fragment/#comment1 after div/#text
```
# Render ASYNC
```html
<!---->
@ -43,8 +64,8 @@ INSERT #comment0, #comment1, div, #comment2, #comment3
# Mutations
```
INSERT div/#comment1, div/#comment2, #text, div/#comment3, div/#comment4
REMOVE #text after div/#comment4
INSERT div/#comment0, div/#comment1, div/#comment2, #text, div/#comment3, div/#comment4, div/#comment5
REMOVE #text after div/#comment5
INSERT div/div
REMOVE #text after div/div
UPDATE div/div[data-level] null => "3"
@ -128,6 +149,47 @@ INSERT div/div/div/#comment0, div/div/div/#text, div/div/div/#comment1
REMOVE #text after div/div/div/#comment1
```
# Render ASYNC
```html
<!---->
<!---->
<div
data-level="4"
>
<!---->
<!---->
<!---->
<div
data-level="3"
>
<!---->
<!---->
<!---->
<div
data-level="2"
>
LOADING...
</div>
<!---->
<!---->
<!---->
</div>
<!---->
<!---->
<!---->
</div>
<!---->
<!---->
```
# Mutations
```
INSERT div/div/div/#text
REMOVE #document-fragment/#comment0 after div/div/div/#text
REMOVE #document-fragment/#text after div/div/div/#text
REMOVE #document-fragment/#comment1 after div/div/div/#text
```
# Render ASYNC
```html
<!---->
@ -174,8 +236,8 @@ REMOVE #text after div/div/div/#comment1
# Mutations
```
INSERT div/div/div/#comment1, div/div/div/#comment2, #text, div/div/div/#comment3, div/div/div/#comment4
REMOVE #text after div/div/div/#comment4
INSERT div/div/div/#comment0, div/div/div/#comment1, div/div/div/#comment2, #text, div/div/div/#comment3, div/div/div/#comment4, div/div/div/#comment5
REMOVE #text after div/div/div/#comment5
INSERT div/div/div/div
REMOVE #text after div/div/div/div
UPDATE div/div/div/div[data-level] null => "1"

5
packages/runtime-tags/src/__tests__/fixtures/async-deep-recursive/__snapshots__/dom.expected/tags/recurse.js
View File

@ -1,6 +1,7 @@
export const $template = "<!><!><!>";
export const $walks = /* over(1), replace, over(2) */"b%c";
export const $setup = () => {};
import { resolveAfter } from "../../../utils/resolve";
import * as _ from "@marko/runtime-tags/debug/dom";
_._enable_catch();
const $placeholder_content = _._content_resume("__tests__/tags/recurse.marko_4_content", "LOADING...", /* over(1) */"b");
@ -8,12 +9,12 @@ const $await_content__setup = $scope => {
$setup($scope["#childScope/0"]);
$await_content__input_level($scope);
};
const $await_content__input_level = /* @__PURE__ */_._closure_get("input_level", $scope => $input_level($scope["#childScope/0"], $scope._._._.input_level - 1), $scope => $scope._._._);
const $await_content__input_level = /* @__PURE__ */_._closure_get("input_level", $scope => $input_level($scope["#childScope/0"], $scope._._._.input_level - 1), $scope => $scope._._._, "__tests__/tags/recurse.marko_3_input_level");
const $await_content = /* @__PURE__ */_._await_content("#text/0", `<!>${$template}<!>`, /* over(1), <recurse>, over(1) */`b/${$walks}&b`, $await_content__setup);
const $try_content__await_promise = /* @__PURE__ */_._await_promise("#text/0");
const $try_content__setup = $scope => {
$await_content($scope);
$try_content__await_promise($scope, new Promise(setImmediate));
$try_content__await_promise($scope, resolveAfter(0, 1));
};
const $if_content__input_level = /* @__PURE__ */_._if_closure("#text/0", 0, $scope => _._attr($scope["#div/0"], "data-level", $scope._.input_level));
const $if_content__try = /* @__PURE__ */_._try("#text/1", "<!><!><!>", /* over(1), replace, over(2) */"b%c", $try_content__setup);

12
packages/runtime-tags/src/__tests__/fixtures/async-deep-recursive/__snapshots__/html.expected/tags/recurse.js
View File

@ -1,3 +1,4 @@
import { resolveAfter } from "../../../utils/resolve";
import * as _ from "@marko/runtime-tags/debug/html";
const $content = input => {
const $scope0_reason = _._scope_reason();
@ -10,23 +11,24 @@ const $content = input => {
_._try($scope1_id, "#text/1", _._content_resume("__tests__/tags/recurse.marko_2_content", () => {
const $scope2_id = _._scope_id();
const $scope2_reason = _._scope_reason();
_._await($scope2_id, "#text/0", new Promise(setImmediate), () => {
_._await($scope2_id, "#text/0", resolveAfter(0, 1), () => {
const $scope3_id = _._scope_id();
_._serialize_if($scope0_reason, /* input.level */0) && _._script($scope3_id, "__tests__/tags/recurse.marko_3_input_level");
const $childScope = _._peek_scope_id();
_._set_serialize_reason(_._serialize_guard($scope0_reason, /* input.level */0));
$content({
level: input.level - 1
});
_._serialize_if($scope0_reason, /* input.level */0) && _._subscribe($input_level__closures, _._scope($scope3_id, {
_._serialize_if($scope0_reason, /* input.level */0) && _._scope($scope3_id, {
_: _._scope_with_id($scope2_id),
"#childScope/0": _._serialize_if($scope0_reason, /* input.level */0) && _._existing_scope($childScope),
"ClosureSignalIndex:input_level": _._serialize_if($scope0_reason, /* input.level */0) && 0
}, "__tests__/tags/recurse.marko", "5:7"));
}, "__tests__/tags/recurse.marko", "6:7");
_._resume_branch($scope3_id);
}, _._serialize_guard($scope0_reason, /* input.level */0));
_._serialize_if($scope0_reason, /* input.level */0) && _._scope($scope2_id, {
_: _._scope_with_id($scope1_id)
}, "__tests__/tags/recurse.marko", "3:5");
}, "__tests__/tags/recurse.marko", "4:5");
}, $scope1_id), {
placeholder: _.attrTag({
content: _._content_resume("__tests__/tags/recurse.marko_4_content", () => {
@ -38,7 +40,7 @@ const $content = input => {
_._html(`</div>${_._el_resume($scope1_id, "#div/0", _._serialize_guard($scope0_reason, /* input.level */0))}`);
_._serialize_if($scope0_reason, /* input.level */0) && _._scope($scope1_id, {
_: _._scope_with_id($scope0_id)
}, "__tests__/tags/recurse.marko", "1:1");
}, "__tests__/tags/recurse.marko", "2:1");
return 0;
}
}, $scope0_id, "#text/0", _._serialize_guard($scope0_reason, /* input.level */0), _._serialize_guard($scope0_reason, /* input.level */0), _._serialize_guard($scope0_reason, /* input.level */0), 0, 1);

64
packages/runtime-tags/src/__tests__/fixtures/async-deep-recursive/__snapshots__/resume-sanitized.expected.md
View File

@ -1,5 +1,69 @@
# Render
```html
<div
data-level="4"
>
LOADING...
</div>
```
# Render FLUSH
```html
<div
data-level="4"
>
<div
data-level="3"
>
LOADING...
</div>
</div>
```
# Render FLUSH
```html
<div
data-level="4"
>
<div
data-level="3"
>
<div
data-level="2"
>
LOADING...
</div>
</div>
</div>
```
# Render FLUSH
```html
<div
data-level="4"
>
<div
data-level="3"
>
<div
data-level="2"
>
<div
data-level="1"
>
LOADING...
</div>
</div>
</div>
</div>
```
# Render FLUSH
```html
<div
data-level="4"
>

330
packages/runtime-tags/src/__tests__/fixtures/async-deep-recursive/__snapshots__/resume.expected.md
View File

@ -1,5 +1,202 @@
# Render
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<div
data-level="4"
>
<!--M_[-->
<!--M_!^4-->
LOADING...
<!--M_!4-->
<!--M_]3 #text/1 4-->
</div>
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 3, _.a = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT html/body/div/#text1
```
# Render FLUSH
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<div
data-level="4"
>
<!--M_[-->
<div
data-level="3"
>
<!--M_[-->
<!--M_!^9-->
LOADING...
<!--M_!9-->
<!--M_]8 #text/1 9-->
</div>
<!--M_]3 #text/1 4-->
</div>
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 3, _.a = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [4, _.d = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.f = {}
}], _.d["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.f), _.e));
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT t
INSERT html/body/div/div
INSERT html/body/div/div/#comment0
INSERT html/body/div/div/#comment1
INSERT html/body/div/div/#text0
INSERT html/body/div/div/#comment2
INSERT html/body/div/div/#comment3
INSERT t
INSERT t/#comment
REMOVE t after html/body/script0
REMOVE #text after #comment
REMOVE #comment after html/body/div/#comment0
REMOVE #comment after html/body/div/#comment0
INSERT html/body/div/div
REMOVE t after html/body/script0
INSERT html/body/div/div/#text1
INSERT html/body/script1
```
# Render FLUSH
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<div
data-level="4"
>
<!--M_[-->
<div
data-level="3"
>
<!--M_[-->
<div
data-level="2"
>
<!--M_[-->
<!--M_!^14-->
LOADING...
<!--M_!14-->
<!--M_]13 #text/1 14-->
</div>
<!--M_]8 #text/1 9-->
</div>
<!--M_]3 #text/1 4-->
</div>
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 3, _.a = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [4, _.d = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.f = {}
}], _.d["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.f), _.e));
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.h = [4, _.g = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.i = {}
}], _.g["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.i), _.h));
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT t
INSERT html/body/div/div/div
INSERT html/body/div/div/div/#comment0
INSERT html/body/div/div/div/#comment1
INSERT html/body/div/div/div/#text0
INSERT html/body/div/div/div/#comment2
INSERT html/body/div/div/div/#comment3
INSERT t
INSERT t/#comment
REMOVE t after html/body/script1
REMOVE #text after #comment
REMOVE #comment after html/body/div/div/#comment0
REMOVE #comment after html/body/div/div/#comment0
INSERT html/body/div/div/div
REMOVE t after html/body/script1
INSERT html/body/div/div/div/#text1
INSERT html/body/script2
```
# Render FLUSH
```html
<html>
<head>
<style
@ -25,11 +222,14 @@
data-level="1"
>
<!--M_[-->
<!--M_]16 #text/1 17-->
<!--M_!^19-->
LOADING...
<!--M_!19-->
<!--M_]18 #text/1 19-->
</div>
<!--M_]12 #text/1 13-->
<!--M_]13 #text/1 14-->
</div>
<!--M_]7 #text/1 8-->
<!--M_]8 #text/1 9-->
</div>
<!--M_]3 #text/1 4-->
</div>
@ -40,13 +240,17 @@
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.c), _.b), _ =&gt; (_.e = [3, _.d = {
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [4, _.d = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.f = {}
}], _.d["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.f), _.e)];
REORDER_RUNTIME(M._);
](_.f), _.e));
M._.w()
</script>
<script>
@ -55,7 +259,109 @@
"#PlaceholderContent": _.i = {}
}], _.g["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.i), _.h), _ =&gt; (_.k = [3, _.j = {
](_.i), _.h));
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.k = [4, _.j = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.l = {}
}], _.j["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.l), _.k));
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT t
INSERT html/body/div/div/div/div
INSERT html/body/div/div/div/div/#comment0
INSERT html/body/div/div/div/div/#comment1
INSERT html/body/div/div/div/div/#text0
INSERT html/body/div/div/div/div/#comment2
INSERT html/body/div/div/div/div/#comment3
INSERT t
INSERT t/#comment
REMOVE t after html/body/script2
REMOVE #text after #comment
REMOVE #comment after html/body/div/div/div/#comment0
REMOVE #comment after html/body/div/div/div/#comment0
INSERT html/body/div/div/div/div
REMOVE t after html/body/script2
INSERT html/body/div/div/div/div/#text1
INSERT html/body/script3
```
# Render FLUSH
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<div
data-level="4"
>
<!--M_[-->
<div
data-level="3"
>
<!--M_[-->
<div
data-level="2"
>
<!--M_[-->
<div
data-level="1"
>
<!--M_[-->
<!--M_]18 #text/1 19-->
</div>
<!--M_]13 #text/1 14-->
</div>
<!--M_]8 #text/1 9-->
</div>
<!--M_]3 #text/1 4-->
</div>
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 3, _.a = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [4, _.d = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.f = {}
}], _.d["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.f), _.e));
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.h = [4, _.g = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.i = {}
}], _.g["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.i), _.h));
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.k = [4, _.j = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.l = {}
}], _.j["#PlaceholderContent"] = _._[
@ -69,3 +375,13 @@
</body>
</html>
```
# Mutations
```
INSERT t
REMOVE t after html/body/script3
REMOVE #text after #comment
REMOVE #comment after html/body/div/div/div/div/#comment0
REMOVE #comment after html/body/div/div/div/div/#comment0
INSERT html/body/script4
```

30
packages/runtime-tags/src/__tests__/fixtures/async-deep-recursive/__snapshots__/ssr-sanitized.expected.md
View File

@ -1,3 +1,13 @@
# Render ASYNC
```html
<div
data-level="4"
>
LOADING...
</div>
```
# Render ASYNC
```html
<div
@ -12,6 +22,24 @@
```
# Render ASYNC
```html
<div
data-level="4"
>
<div
data-level="3"
>
<div
data-level="2"
>
LOADING...
</div>
</div>
</div>
```
# Render ASYNC
```html
<div
@ -34,7 +62,7 @@
```
# Render ASYNC
# Render End
```html
<div
data-level="4"

296
packages/runtime-tags/src/__tests__/fixtures/async-deep-recursive/__snapshots__/ssr.expected.md
View File

@ -1,16 +1,26 @@
# Write
```html
<div data-level=4><!--M_[--><div data-level=3><!--M_[--><!--M_!^8-->LOADING...<!--M_!8--><!--M_]7 #text/1 8--></div><!--M_]3 #text/1 4--></div><style M_>t{display:none}</style><t M_=8><!--M_#b--></t><script>WALKER_RUNTIME("M")("_");M._.r=[_=>(_.b=[0,3,_.a={"#BranchAccessor":"#text/1","#PlaceholderContent":_.c={}}],_.a["#PlaceholderContent"]=_._["__tests__/tags/recurse.marko_4_content"](_.c),_.b),_=>(_.e=[3,_.d={"#BranchAccessor":"#text/1","#PlaceholderContent":_.f={}}],_.d["#PlaceholderContent"]=_._["__tests__/tags/recurse.marko_4_content"](_.f),_.e)];REORDER_RUNTIME(M._);M._.w()</script>
<div data-level=4><!--M_[--><!--M_!^4-->LOADING...<!--M_!4--><!--M_]3 #text/1 4--></div><style M_>t{display:none}</style><t M_=4><!--M_#b--></t><script>WALKER_RUNTIME("M")("_");M._.r=[_=>(_.b=[0,3,_.a={"#BranchAccessor":"#text/1","#PlaceholderContent":_.c={}}],_.a["#PlaceholderContent"]=_._["__tests__/tags/recurse.marko_4_content"](_.c),_.b)];REORDER_RUNTIME(M._);M._.w()</script>
```
# Write
```html
<t M_=b><div data-level=2><!--M_[--><div data-level=1><!--M_[--><!--M_!^17-->LOADING...<!--M_!17--><!--M_]16 #text/1 17--></div><!--M_]12 #text/1 13--></div></t><t M_=17><!--M_#c--></t><script>M._.r.push(_=>(_.h=[4,_.g={"#BranchAccessor":"#text/1","#PlaceholderContent":_.i={}}],_.g["#PlaceholderContent"]=_._["__tests__/tags/recurse.marko_4_content"](_.i),_.h),_=>(_.k=[3,_.j={"#BranchAccessor":"#text/1","#PlaceholderContent":_.l={}}],_.j["#PlaceholderContent"]=_._["__tests__/tags/recurse.marko_4_content"](_.l),_.k));M._.w()</script>
<t M_=b><div data-level=3><!--M_[--><!--M_!^9-->LOADING...<!--M_!9--><!--M_]8 #text/1 9--></div></t><t M_=9><!--M_#c--></t><script>M._.r.push(_=>(_.e=[4,_.d={"#BranchAccessor":"#text/1","#PlaceholderContent":_.f={}}],_.d["#PlaceholderContent"]=_._["__tests__/tags/recurse.marko_4_content"](_.f),_.e));M._.w()</script>
```
# Write
```html
<t M_=c></t><script>M._.w()</script>
<t M_=c><div data-level=2><!--M_[--><!--M_!^14-->LOADING...<!--M_!14--><!--M_]13 #text/1 14--></div></t><t M_=14><!--M_#d--></t><script>M._.r.push(_=>(_.h=[4,_.g={"#BranchAccessor":"#text/1","#PlaceholderContent":_.i={}}],_.g["#PlaceholderContent"]=_._["__tests__/tags/recurse.marko_4_content"](_.i),_.h));M._.w()</script>
```
# Write
```html
<t M_=d><div data-level=1><!--M_[--><!--M_!^19-->LOADING...<!--M_!19--><!--M_]18 #text/1 19--></div></t><t M_=19><!--M_#e--></t><script>M._.r.push(_=>(_.k=[4,_.j={"#BranchAccessor":"#text/1","#PlaceholderContent":_.l={}}],_.j["#PlaceholderContent"]=_._["__tests__/tags/recurse.marko_4_content"](_.l),_.k));M._.w()</script>
```
# Write
```html
<t M_=e></t><script>M._.w()</script>
```
# Render ASYNC
@ -28,15 +38,9 @@
data-level="4"
>
<!--M_[-->
<div
data-level="3"
>
<!--M_[-->
<!--M_!^8-->
LOADING...
<!--M_!8-->
<!--M_]7 #text/1 8-->
</div>
<!--M_!^4-->
LOADING...
<!--M_!4-->
<!--M_]3 #text/1 4-->
</div>
<script>
@ -46,12 +50,7 @@
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.c), _.b), _ =&gt; (_.e = [3, _.d = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.f = {}
}], _.d["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.f), _.e)];
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
@ -66,13 +65,10 @@ INSERT html/head
INSERT html/body
INSERT html/body/div
INSERT html/body/div/#comment0
INSERT html/body/div/div
INSERT html/body/div/div/#comment0
INSERT html/body/div/div/#comment1
INSERT html/body/div/div/#text
INSERT html/body/div/div/#comment2
INSERT html/body/div/div/#comment3
INSERT html/body/div/#comment1
INSERT html/body/div/#text
INSERT html/body/div/#comment2
INSERT html/body/div/#comment3
INSERT html/head/style
INSERT html/head/style/#text
INSERT t
@ -102,22 +98,10 @@ INSERT html/body/script
data-level="3"
>
<!--M_[-->
<div
data-level="2"
>
<!--M_[-->
<div
data-level="1"
>
<!--M_[-->
<!--M_!^17-->
LOADING...
<!--M_!17-->
<!--M_]16 #text/1 17-->
</div>
<!--M_]12 #text/1 13-->
</div>
<!--M_]7 #text/1 8-->
<!--M_!^9-->
LOADING...
<!--M_!9-->
<!--M_]8 #text/1 9-->
</div>
<!--M_]3 #text/1 4-->
</div>
@ -128,27 +112,102 @@ INSERT html/body/script
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.c), _.b), _ =&gt; (_.e = [3, _.d = {
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [4, _.d = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.f = {}
}], _.d["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.f), _.e)];
](_.f), _.e));
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT t
INSERT html/body/div/div
INSERT html/body/div/div/#comment0
INSERT html/body/div/div/#comment1
INSERT html/body/div/div/#text
INSERT html/body/div/div/#comment2
INSERT html/body/div/div/#comment3
INSERT t
INSERT t/#comment
REMOVE t after html/body/script0
REMOVE #text after #comment
REMOVE #comment after html/body/div/#comment0
REMOVE #comment after html/body/div/#comment0
INSERT html/body/div/div
REMOVE t after html/body/script0
INSERT html/body/script1
```
# Render ASYNC
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<div
data-level="4"
>
<!--M_[-->
<div
data-level="3"
>
<!--M_[-->
<div
data-level="2"
>
<!--M_[-->
<!--M_!^14-->
LOADING...
<!--M_!14-->
<!--M_]13 #text/1 14-->
</div>
<!--M_]8 #text/1 9-->
</div>
<!--M_]3 #text/1 4-->
</div>
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 3, _.a = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [4, _.d = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.f = {}
}], _.d["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.f), _.e));
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.h = [4, _.g = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.i = {}
}], _.g["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.i), _.h), _ =&gt; (_.k = [3, _.j = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.l = {}
}], _.j["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.l), _.k));
](_.i), _.h));
M._.w()
</script>
</body>
@ -160,22 +219,19 @@ INSERT html/body/script
INSERT t
INSERT html/body/div/div/div
INSERT html/body/div/div/div/#comment0
INSERT html/body/div/div/div/div
INSERT html/body/div/div/div/div/#comment0
INSERT html/body/div/div/div/div/#comment1
INSERT html/body/div/div/div/div/#text
INSERT html/body/div/div/div/div/#comment2
INSERT html/body/div/div/div/div/#comment3
INSERT html/body/div/div/div/#comment1
INSERT html/body/div/div/div/#text
INSERT html/body/div/div/div/#comment2
INSERT html/body/div/div/div/#comment3
INSERT t
INSERT t/#comment
REMOVE t after html/body/script0
REMOVE t after html/body/script1
REMOVE #text after #comment
REMOVE #comment after html/body/div/div/#comment0
REMOVE #comment after html/body/div/div/#comment0
INSERT html/body/div/div/div
REMOVE t after html/body/script0
INSERT html/body/script1
REMOVE t after html/body/script1
INSERT html/body/script2
```
# Render ASYNC
@ -205,11 +261,14 @@ INSERT html/body/script1
data-level="1"
>
<!--M_[-->
<!--M_]16 #text/1 17-->
<!--M_!^19-->
LOADING...
<!--M_!19-->
<!--M_]18 #text/1 19-->
</div>
<!--M_]12 #text/1 13-->
<!--M_]13 #text/1 14-->
</div>
<!--M_]7 #text/1 8-->
<!--M_]8 #text/1 9-->
</div>
<!--M_]3 #text/1 4-->
</div>
@ -220,13 +279,17 @@ INSERT html/body/script1
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.c), _.b), _ =&gt; (_.e = [3, _.d = {
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [4, _.d = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.f = {}
}], _.d["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.f), _.e)];
REORDER_RUNTIME(M._);
](_.f), _.e));
M._.w()
</script>
<script>
@ -235,7 +298,108 @@ INSERT html/body/script1
"#PlaceholderContent": _.i = {}
}], _.g["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.i), _.h), _ =&gt; (_.k = [3, _.j = {
](_.i), _.h));
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.k = [4, _.j = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.l = {}
}], _.j["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.l), _.k));
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT t
INSERT html/body/div/div/div/div
INSERT html/body/div/div/div/div/#comment0
INSERT html/body/div/div/div/div/#comment1
INSERT html/body/div/div/div/div/#text
INSERT html/body/div/div/div/div/#comment2
INSERT html/body/div/div/div/div/#comment3
INSERT t
INSERT t/#comment
REMOVE t after html/body/script2
REMOVE #text after #comment
REMOVE #comment after html/body/div/div/div/#comment0
REMOVE #comment after html/body/div/div/div/#comment0
INSERT html/body/div/div/div/div
REMOVE t after html/body/script2
INSERT html/body/script3
```
# Render End
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<div
data-level="4"
>
<!--M_[-->
<div
data-level="3"
>
<!--M_[-->
<div
data-level="2"
>
<!--M_[-->
<div
data-level="1"
>
<!--M_[-->
<!--M_]18 #text/1 19-->
</div>
<!--M_]13 #text/1 14-->
</div>
<!--M_]8 #text/1 9-->
</div>
<!--M_]3 #text/1 4-->
</div>
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 3, _.a = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [4, _.d = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.f = {}
}], _.d["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.f), _.e));
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.h = [4, _.g = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.i = {}
}], _.g["#PlaceholderContent"] = _._[
"__tests__/tags/recurse.marko_4_content"
](_.i), _.h));
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.k = [4, _.j = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.l = {}
}], _.j["#PlaceholderContent"] = _._[
@ -253,9 +417,9 @@ INSERT html/body/script1
# Mutations
```
INSERT t
REMOVE t after html/body/script1
REMOVE t after html/body/script3
REMOVE #text after #comment
REMOVE #comment after html/body/div/div/div/div/#comment0
REMOVE #comment after html/body/div/div/div/div/#comment0
INSERT html/body/script2
INSERT html/body/script4
```

3
packages/runtime-tags/src/__tests__/fixtures/async-deep-recursive/tags/recurse.marko
View File

@ -1,6 +1,7 @@
import { resolveAfter } from "../../../utils/resolve";
if=input.level
div data-level=input.level
try
@placeholder -- LOADING...
await=new Promise(setImmediate)
await=resolveAfter(0, 1)
recurse level=input.level - 1

4
packages/runtime-tags/src/__tests__/fixtures/async-deep-recursive/test.ts
View File

@ -1,3 +1,3 @@
import { wait } from "../../utils/resolve";
import { flush, wait } from "../../utils/resolve";
export const steps = [{}, wait(4)];
export const steps = [{}, flush, flush, flush, flush, wait(5)];

23
packages/runtime-tags/src/__tests__/fixtures/async-multi-resolve-in-order-and-update/__snapshots__/csr-sanitized.expected.md
View File

@ -52,6 +52,29 @@ container.querySelector("button").click();
<button>
increment
</button>
<p>
1 * 3 = 2
</p>
<p>
2 * 3 = 4
</p>
<p>
3 * 3 = 6
</p>
<p>
4 * 3 = 8
</p>
<p>
5 * 3 = 10
</p>
```
# Render ASYNC
```html
<button>
increment
</button>
<p>
1 * 3 =
</p>

41
packages/runtime-tags/src/__tests__/fixtures/async-multi-resolve-in-order-and-update/__snapshots__/csr.expected.md
View File

@ -74,6 +74,37 @@ container.querySelector("button").click();
<button>
increment
</button>
<p>
1 * 3 = 2
</p>
<p>
2 * 3 = 4
</p>
<p>
3 * 3 = 6
</p>
<p>
4 * 3 = 8
</p>
<p>
5 * 3 = 10
</p>
```
# Mutations
```
UPDATE p0/#text1 "2" => "3"
UPDATE p1/#text1 "2" => "3"
UPDATE p2/#text1 "2" => "3"
UPDATE p3/#text1 "2" => "3"
UPDATE p4/#text1 "2" => "3"
```
# Render ASYNC
```html
<button>
increment
</button>
<p>
1 * 3 =
</p>
@ -93,11 +124,6 @@ container.querySelector("button").click();
# Mutations
```
UPDATE p0/#text1 "2" => "3"
UPDATE p1/#text1 "2" => "3"
UPDATE p2/#text1 "2" => "3"
UPDATE p3/#text1 "2" => "3"
UPDATE p4/#text1 "2" => "3"
INSERT p0/#text3
REMOVE #document-fragment/#text after p0/#text3
INSERT p1/#text3
@ -136,17 +162,12 @@ REMOVE #document-fragment/#text after p4/#text3
```
REMOVE #text after p0/#text2
INSERT p0/#text3
UPDATE p0/#text3 "2" => "3"
REMOVE #text after p4/#text2
INSERT p4/#text3
UPDATE p4/#text3 "10" => "15"
REMOVE #text after p3/#text2
INSERT p3/#text3
UPDATE p3/#text3 "8" => "12"
REMOVE #text after p2/#text2
INSERT p2/#text3
UPDATE p2/#text3 "6" => "9"
REMOVE #text after p1/#text2
INSERT p1/#text3
UPDATE p1/#text3 "4" => "6"
```

34
packages/runtime-tags/src/__tests__/fixtures/async-multi-resolve-in-order-and-update/__snapshots__/resume-sanitized.expected.md
View File

@ -3,6 +3,17 @@
<button>
increment
</button>
<p>
1 * 2 =
</p>
```
# Render FLUSH
```html
<button>
increment
</button>
<p>
1 * 2 = 2
</p>
@ -29,6 +40,29 @@ container.querySelector("button").click();
<button>
increment
</button>
<p>
1 * 3 = 2
</p>
<p>
2 * 3 = 4
</p>
<p>
3 * 3 = 6
</p>
<p>
4 * 3 = 8
</p>
<p>
5 * 3 = 10
</p>
```
# Render ASYNC
```html
<button>
increment
</button>
<p>
1 * 3 =
</p>

186
packages/runtime-tags/src/__tests__/fixtures/async-multi-resolve-in-order-and-update/__snapshots__/resume.expected.md
View File

@ -1,5 +1,33 @@
# Render
```html
<html>
<head />
<body>
<button>
increment
</button>
<!--M_*1 #button/0-->
<p>
1 *
<!---->
2
<!--M_*1 #text/1-->
=
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.a = [0,
{
n: 2
}])]
</script>
</p>
</body>
</html>
```
# Render FLUSH
```html
<html>
<head />
<body>
@ -84,12 +112,160 @@
</html>
```
# Mutations
```
INSERT html/body/p0/#comment2
INSERT html/body/p0/#text3
INSERT html/body/p0/#comment3
INSERT html/body/p0/#comment4
INSERT html/body/p1
INSERT html/body/p1/#text0
INSERT html/body/p1/#comment0
INSERT html/body/p1/#text1
INSERT html/body/p1/#comment1
INSERT html/body/p1/#text2
INSERT html/body/p1/#comment2
INSERT html/body/p1/#text3
INSERT html/body/p1/#comment3
INSERT html/body/p1/#comment4
INSERT html/body/p2
INSERT html/body/p2/#text0
INSERT html/body/p2/#comment0
INSERT html/body/p2/#text1
INSERT html/body/p2/#comment1
INSERT html/body/p2/#text2
INSERT html/body/p2/#comment2
INSERT html/body/p2/#text3
INSERT html/body/p2/#comment3
INSERT html/body/p2/#comment4
INSERT html/body/p3
INSERT html/body/p3/#text0
INSERT html/body/p3/#comment0
INSERT html/body/p3/#text1
INSERT html/body/p3/#comment1
INSERT html/body/p3/#text2
INSERT html/body/p3/#comment2
INSERT html/body/p3/#text3
INSERT html/body/p3/#comment3
INSERT html/body/p3/#comment4
INSERT html/body/p4
INSERT html/body/p4/#text0
INSERT html/body/p4/#comment0
INSERT html/body/p4/#text1
INSERT html/body/p4/#comment1
INSERT html/body/p4/#text2
INSERT html/body/p4/#comment2
INSERT html/body/p4/#text3
INSERT html/body/p4/#comment3
INSERT html/body/p4/#comment4
INSERT html/body/p0/#text4
INSERT html/body/p1/#text4
INSERT html/body/p2/#text4
INSERT html/body/p3/#text4
INSERT html/body/p4/#text4
INSERT html/body/script
```
# Render
```js
container.querySelector("button").click();
```
```html
<html>
<head />
<body>
<button>
increment
</button>
<!--M_*1 #button/0-->
<p>
1 *
<!---->
3
<!--M_*1 #text/1-->
=
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.a = [0,
{
n: 2
}])]
</script>
<!--M_[-->
2
<!--M_*2 #text/0-->
<!--M_]1 #text/2 2-->
</p>
<p>
2 *
<!---->
3
<!--M_*1 #text/3-->
=
<!--M_[-->
4
<!--M_*3 #text/0-->
<!--M_]1 #text/4 3-->
</p>
<p>
3 *
<!---->
3
<!--M_*1 #text/5-->
=
<!--M_[-->
6
<!--M_*4 #text/0-->
<!--M_]1 #text/6 4-->
</p>
<p>
4 *
<!---->
3
<!--M_*1 #text/7-->
=
<!--M_[-->
8
<!--M_*5 #text/0-->
<!--M_]1 #text/8 5-->
</p>
<p>
5 *
<!---->
3
<!--M_*1 #text/9-->
=
<!--M_[-->
10
<!--M_*6 #text/0-->
<!--M_]1 #text/10 6-->
</p>
<script>
M._.r.push(_ =&gt; (_.b = [
{}]), _ =&gt; (_.c = [
{}]), _ =&gt; (_.d = [
{}]), _ =&gt; (_.e = [
{}]), _ =&gt; (_.f = [
{}]),
"__tests__/template.marko_0_n 1"
);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
UPDATE html/body/p0/#text1 "2" => "3"
UPDATE html/body/p1/#text1 "2" => "3"
UPDATE html/body/p2/#text1 "2" => "3"
UPDATE html/body/p3/#text1 "2" => "3"
UPDATE html/body/p4/#text1 "2" => "3"
```
# Render ASYNC
```html
<html>
<head />
<body>
@ -161,11 +337,6 @@ container.querySelector("button").click();
# Mutations
```
UPDATE html/body/p0/#text1 "2" => "3"
UPDATE html/body/p1/#text1 "2" => "3"
UPDATE html/body/p2/#text1 "2" => "3"
UPDATE html/body/p3/#text1 "2" => "3"
UPDATE html/body/p4/#text1 "2" => "3"
REMOVE html/body/p0/#comment2 after #document-fragment/#text1
INSERT html/body/p0/#comment2
REMOVE #document-fragment/#comment0 after html/body/p0/#comment2
@ -283,17 +454,12 @@ REMOVE #document-fragment/#text1 after html/body/p4/#comment2
```
REMOVE #comment after html/body/p0/script
INSERT html/body/p0/#comment2, html/body/p0/#text3, html/body/p0/#comment3, html/body/p0/#text4
UPDATE html/body/p0/#text3 "2" => "3"
REMOVE #comment after html/body/p4/#text2
INSERT html/body/p4/#comment2, html/body/p4/#text3, html/body/p4/#comment3, html/body/p4/#text4
UPDATE html/body/p4/#text3 "10" => "15"
REMOVE #comment after html/body/p3/#text2
INSERT html/body/p3/#comment2, html/body/p3/#text3, html/body/p3/#comment3, html/body/p3/#text4
UPDATE html/body/p3/#text3 "8" => "12"
REMOVE #comment after html/body/p2/#text2
INSERT html/body/p2/#comment2, html/body/p2/#text3, html/body/p2/#comment3, html/body/p2/#text4
UPDATE html/body/p2/#text3 "6" => "9"
REMOVE #comment after html/body/p1/#text2
INSERT html/body/p1/#comment2, html/body/p1/#text3, html/body/p1/#comment3, html/body/p1/#text4
UPDATE html/body/p1/#text3 "4" => "6"
```

2
packages/runtime-tags/src/__tests__/fixtures/async-multi-resolve-in-order-and-update/__snapshots__/ssr-sanitized.expected.md
View File

@ -9,7 +9,7 @@
```
# Render ASYNC
# Render End
```html
<button>
increment

2
packages/runtime-tags/src/__tests__/fixtures/async-multi-resolve-in-order-and-update/__snapshots__/ssr.expected.md
View File

@ -52,7 +52,7 @@ INSERT html/body/p/#text2
INSERT html/body/p/script
```
# Render ASYNC
# Render End
```html
<html>
<head />

6
packages/runtime-tags/src/__tests__/fixtures/async-multi-resolve-in-order-and-update/test.ts
View File

@ -1,6 +1,8 @@
import { wait } from "../../utils/resolve";
import { flush, wait } from "../../utils/resolve";
export const steps = [{}, wait(6), click, wait(6)];
export const steps = [{}, flush, wait(3), click, wait(4)];
export const skip_equivalent = true; // in-order streaming
function click(container: Element) {
container.querySelector("button")!.click();

18
packages/runtime-tags/src/__tests__/fixtures/async-nested-resolve-in-order/__snapshots__/resume-sanitized.expected.md
View File

@ -1,4 +1,22 @@
# Render
```html
a
```
# Render FLUSH
```html
ab
```
# Render FLUSH
```html
abc
```
# Render FLUSH
```html
abcdefghijklm
```

46
packages/runtime-tags/src/__tests__/fixtures/async-nested-resolve-in-order/__snapshots__/resume.expected.md
View File

@ -1,5 +1,46 @@
# Render
```html
<html>
<head />
<body>
a
</body>
</html>
```
# Render FLUSH
```html
<html>
<head />
<body>
ab
</body>
</html>
```
# Mutations
```
INSERT html/body/#text1
```
# Render FLUSH
```html
<html>
<head />
<body>
abc
</body>
</html>
```
# Mutations
```
INSERT html/body/#text2
```
# Render FLUSH
```html
<html>
<head />
<body>
@ -7,3 +48,8 @@
</body>
</html>
```
# Mutations
```
INSERT html/body/#text3
```

2
packages/runtime-tags/src/__tests__/fixtures/async-nested-resolve-in-order/__snapshots__/ssr-sanitized.expected.md
View File

@ -16,7 +16,7 @@ abc
```
# Render ASYNC
# Render End
```html
abcdefghijklm
```

2
packages/runtime-tags/src/__tests__/fixtures/async-nested-resolve-in-order/__snapshots__/ssr.expected.md
View File

@ -66,7 +66,7 @@ INSERT html/body/#text1
INSERT html/body/#text2
```
# Render ASYNC
# Render End
```html
<html>
<head />

6
packages/runtime-tags/src/__tests__/fixtures/async-nested-resolve-in-order/test.ts
View File

@ -1,3 +1,5 @@
import { wait } from "../../utils/resolve";
import { flush, wait } from "../../utils/resolve";
export const steps = [{}, wait(4)];
export const steps = [{}, flush, flush, flush, wait(4)];
export const skip_equivalent = true; // in-order streaming

6
packages/runtime-tags/src/__tests__/fixtures/async-reject-then-resolve-before-and-after-isolated-boundaries/__snapshots__/resume-sanitized.expected.md
View File

@ -1,4 +1,10 @@
# Render
# Render FLUSH
# Render FLUSH
```html
<div>
Resolved A: A Value

109
packages/runtime-tags/src/__tests__/fixtures/async-reject-then-resolve-before-and-after-isolated-boundaries/__snapshots__/resume.expected.md
View File

@ -1,5 +1,84 @@
# Render
```html
<html>
<head />
<body>
<!--M_[-->
<!--M_!^b-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.d = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#CatchContent": _.e = {}
}, _.b = {
"#BranchAccessor": "#text/1"
}, _.c = {
"#BranchAccessor": "#text/2"
}], _.a["#CatchContent"] = _._[
"__tests__/template.marko_2_content"
](_.e), _.b["#CatchContent"] = _._[
"__tests__/template.marko_5_content"
](_.e), _.c["#CatchContent"] = _._[
"__tests__/template.marko_8_content"
](_.e), _.d)]
</script>
</body>
</html>
```
# Render FLUSH
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<!--M_!^b-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.d = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#CatchContent": _.e = {}
}, _.b = {
"#BranchAccessor": "#text/1"
}, _.c = {
"#BranchAccessor": "#text/2"
}], _.a["#CatchContent"] = _._[
"__tests__/template.marko_2_content"
](_.e), _.b["#CatchContent"] = _._[
"__tests__/template.marko_5_content"
](_.e), _.c["#CatchContent"] = _._[
"__tests__/template.marko_8_content"
](_.e), _.d)]
</script>
<script>
REORDER_RUNTIME(M._);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT html/head/style
INSERT html/head/style/#text
INSERT t
INSERT t/#text
REMOVE html/head/style after html/body/script0
INSERT html/head/style
REMOVE t after html/body/script0
INSERT html/body/script1
```
# Render FLUSH
```html
<html>
<head>
<style
@ -64,6 +143,36 @@
</html>
```
# Mutations
```
INSERT html/body/div0
INSERT html/body/div0/#text
INSERT html/body/#comment2
INSERT html/body/#comment3
INSERT html/body/#comment4
INSERT #comment
INSERT #comment
INSERT html/body/#comment5
INSERT html/body/#comment6
INSERT html/body/#comment7
INSERT html/body/#comment8
INSERT html/body/div1
INSERT html/body/div1/#text
INSERT html/body/button
INSERT html/body/button/#text
INSERT html/body/#comment9
INSERT html/body/#comment10
INSERT html/body/#comment11
INSERT html/body/#comment12
REMOVE #comment after html/body/#comment4
REMOVE #comment after html/body/#comment4
INSERT html/body/#text1
INSERT html/body/#text0
INSERT html/body/#text2
INSERT html/body/#text3
INSERT html/body/#text4
INSERT html/body/script2
```
# Render
```js

2
packages/runtime-tags/src/__tests__/fixtures/async-reject-then-resolve-before-and-after-isolated-boundaries/__snapshots__/ssr-sanitized.expected.md
View File

@ -4,7 +4,7 @@
# Render ASYNC
# Render ASYNC
# Render End
```html
<div>
Resolved A: A Value

2
packages/runtime-tags/src/__tests__/fixtures/async-reject-then-resolve-before-and-after-isolated-boundaries/__snapshots__/ssr.expected.md
View File

@ -101,7 +101,7 @@ REMOVE t after html/body/script0
INSERT html/body/script1
```
# Render ASYNC
# Render End
```html
<html>
<head>

4
packages/runtime-tags/src/__tests__/fixtures/async-reject-then-resolve-before-and-after-isolated-boundaries/test.ts
View File

@ -1,6 +1,6 @@
import { wait } from "../../utils/resolve";
import { flush, wait } from "../../utils/resolve";
export const steps = [{}, wait(4), click];
export const steps = [{}, flush, flush, wait(4), click];
function click(container: Element) {
container.querySelector("button")!.click();

6
packages/runtime-tags/src/__tests__/fixtures/async-reject-then-resolve-isolated-boundaries/__snapshots__/resume-sanitized.expected.md
View File

@ -1,4 +1,10 @@
# Render
# Render FLUSH
# Render FLUSH
```html
<div>
Resolved A: A Value

89
packages/runtime-tags/src/__tests__/fixtures/async-reject-then-resolve-isolated-boundaries/__snapshots__/resume.expected.md
View File

@ -1,5 +1,76 @@
# Render
```html
<html>
<head />
<body>
<!--M_[-->
<!--M_!^b-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.c = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#CatchContent": _.d = {}
}, _.b = {
"#BranchAccessor": "#text/1"
}], _.a["#CatchContent"] = _._[
"__tests__/template.marko_2_content"
](_.d), _.b["#CatchContent"] = _._[
"__tests__/template.marko_5_content"
](_.d), _.c)]
</script>
</body>
</html>
```
# Render FLUSH
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<!--M_!^b-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.c = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#CatchContent": _.d = {}
}, _.b = {
"#BranchAccessor": "#text/1"
}], _.a["#CatchContent"] = _._[
"__tests__/template.marko_2_content"
](_.d), _.b["#CatchContent"] = _._[
"__tests__/template.marko_5_content"
](_.d), _.c)]
</script>
<script>
REORDER_RUNTIME(M._);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT html/head/style
INSERT html/head/style/#text
INSERT t
INSERT t/#text
REMOVE html/head/style after html/body/script0
INSERT html/head/style
REMOVE t after html/body/script0
INSERT html/body/script1
```
# Render FLUSH
```html
<html>
<head>
<style
@ -42,3 +113,21 @@
</body>
</html>
```
# Mutations
```
INSERT html/body/div
INSERT html/body/div/#text
INSERT html/body/#comment2
INSERT html/body/#comment3
INSERT html/body/#comment4
INSERT #comment
INSERT #comment
INSERT html/body/#comment5
REMOVE #comment after html/body/#comment4
REMOVE #comment after html/body/#comment4
INSERT html/body/#text1
INSERT html/body/#text0
INSERT html/body/#text2
INSERT html/body/script2
```

2
packages/runtime-tags/src/__tests__/fixtures/async-reject-then-resolve-isolated-boundaries/__snapshots__/ssr-sanitized.expected.md
View File

@ -4,7 +4,7 @@
# Render ASYNC
# Render ASYNC
# Render End
```html
<div>
Resolved A: A Value

2
packages/runtime-tags/src/__tests__/fixtures/async-reject-then-resolve-isolated-boundaries/__snapshots__/ssr.expected.md
View File

@ -93,7 +93,7 @@ REMOVE t after html/body/script0
INSERT html/body/script1
```
# Render ASYNC
# Render End
```html
<html>
<head>

4
packages/runtime-tags/src/__tests__/fixtures/async-reject-then-resolve-isolated-boundaries/test.ts
View File

@ -1,3 +1,3 @@
import { wait } from "../../utils/resolve";
import { flush, wait } from "../../utils/resolve";
export const steps = [{}, wait(4)];
export const steps = [{}, flush, flush, wait(4)];

32
packages/runtime-tags/src/__tests__/fixtures/async-reorder-nested-batched-resolve/__snapshots__/csr-sanitized.expected.md
View File

@ -16,17 +16,6 @@ LOADING A1
```
# Render ASYNC
```html
<div
class="a"
level="1"
>
LOADING A2
</div>
```
# Render ASYNC
```html
<div
@ -76,27 +65,6 @@ LOADING A1
```
# Render ASYNC
```html
<div
class="a"
level="1"
>
<div
class="a"
level="2"
>
<div
class="b"
level="3"
>
LOADING B2
</div>
</div>
</div>
```
# Render ASYNC
```html
<div

68
packages/runtime-tags/src/__tests__/fixtures/async-reorder-nested-batched-resolve/__snapshots__/csr.expected.md
View File

@ -49,28 +49,6 @@ INSERT div/#comment0, div/#text, div/#comment1
REMOVE #text after div/#comment1
```
# Render ASYNC
```html
<!---->
<!---->
<div
class="a"
level="1"
>
LOADING A2
</div>
<!---->
<!---->
```
# Mutations
```
INSERT div/#text
REMOVE #document-fragment/#comment0 after div/#text
REMOVE #document-fragment/#text after div/#text
REMOVE #document-fragment/#comment1 after div/#text
```
# Render ASYNC
```html
<!---->
@ -95,8 +73,9 @@ REMOVE #document-fragment/#comment1 after div/#text
# Mutations
```
INSERT div/#comment0, div/div, div/#comment1
REMOVE #text after div/#comment1
INSERT div/div
REMOVE #text after div/div
UPDATE div/div[class] null => "a"
INSERT div/div/#comment0, div/div/#text, div/div/#comment1
REMOVE #text after div/div/#comment1
```
@ -167,42 +146,6 @@ INSERT div/div/div/#comment0, div/div/div/#text, div/div/div/#comment1
REMOVE #text after div/div/div/#comment1
```
# Render ASYNC
```html
<!---->
<!---->
<div
class="a"
level="1"
>
<!---->
<div
class="a"
level="2"
>
<!---->
<div
class="b"
level="3"
>
LOADING B2
</div>
<!---->
</div>
<!---->
</div>
<!---->
<!---->
```
# Mutations
```
INSERT div/div/div/#text
REMOVE #document-fragment/#comment0 after div/div/div/#text
REMOVE #document-fragment/#text after div/div/div/#text
REMOVE #document-fragment/#comment1 after div/div/div/#text
```
# Render ASYNC
```html
<!---->
@ -238,6 +181,7 @@ REMOVE #document-fragment/#comment1 after div/div/div/#text
# Mutations
```
INSERT div/div/div/#comment0, div/div/div/div, div/div/div/#comment1
REMOVE #text after div/div/div/#comment1
INSERT div/div/div/div
REMOVE #text after div/div/div/div
UPDATE div/div/div/div[class] null => "b"
```

6
packages/runtime-tags/src/__tests__/fixtures/async-reorder-nested-batched-resolve/__snapshots__/dom.expected/template.hydrate.js
View File

@ -1,6 +1,6 @@
// size: 182 (min) 82 (brotli)
// size: 182 (min) 83 (brotli)
(_._enable_catch(),
_._content_resume("a0", "LOADING B2", "b"),
_._content_resume("a1", "LOADING B1", "b"),
_._content_resume("a2", "LOADING A2", "b"),
_._content_resume("a3", "LOADING A1", "b"));
_._content_resume("a4", "LOADING A2", "b"),
_._content_resume("a5", "LOADING A1", "b"));

8
packages/runtime-tags/src/__tests__/fixtures/async-reorder-nested-batched-resolve/__snapshots__/dom.expected/template.js
View File

@ -13,7 +13,7 @@ const $try_content4__setup = $scope => {
$await_content4($scope);
$try_content4__promiseB($scope);
};
const $try_content4__promiseB = /* @__PURE__ */_._closure_get("promiseB", $scope => $try_content4__await_promise($scope, $scope._._._.promiseB), $scope => $scope._._._);
const $try_content4__promiseB = /* @__PURE__ */_._closure_get("promiseB", $scope => $try_content4__await_promise($scope, $scope._._._.promiseB), $scope => $scope._._._, "__tests__/template.marko_9_promiseB");
const $await_content3__value = /* @__PURE__ */_._const("value", $scope => _._attr_class($scope["#div/0"], $scope.value));
const $await_content3__try = /* @__PURE__ */_._try("#text/1", "<!><!><!>", /* over(1), replace, over(2) */"b%c", $try_content4__setup);
const $await_content3__setup = $scope => {
@ -30,7 +30,7 @@ const $try_content3__setup = $scope => {
$await_content3($scope);
$try_content3__promiseB($scope);
};
const $try_content3__promiseB = /* @__PURE__ */_._closure_get("promiseB", $scope => $try_content3__await_promise($scope, $scope._.promiseB));
const $try_content3__promiseB = /* @__PURE__ */_._closure_get("promiseB", $scope => $try_content3__await_promise($scope, $scope._.promiseB), 0, "__tests__/template.marko_7_promiseB");
const $await_content2__value = /* @__PURE__ */_._const("value", $scope => _._attr_class($scope["#div/0"], $scope.value));
const $await_content2__promiseB = /* @__PURE__ */_._const("promiseB");
const $await_content2__try = /* @__PURE__ */_._try("#text/1", "<!><!><!>", /* over(1), replace, over(2) */"b%c", $try_content3__setup);
@ -51,7 +51,7 @@ const $try_content2__setup = $scope => {
$await_content2($scope);
$try_content2__promiseA($scope);
};
const $try_content2__promiseA = /* @__PURE__ */_._closure_get("promiseA", $scope => $try_content2__await_promise($scope, $scope._._._.promiseA), $scope => $scope._._._);
const $try_content2__promiseA = /* @__PURE__ */_._closure_get("promiseA", $scope => $try_content2__await_promise($scope, $scope._._._.promiseA), $scope => $scope._._._, "__tests__/template.marko_3_promiseA");
const $await_content__value = /* @__PURE__ */_._const("value", $scope => _._attr_class($scope["#div/0"], $scope.value));
const $await_content__try = /* @__PURE__ */_._try("#text/1", "<!><!><!>", /* over(1), replace, over(2) */"b%c", $try_content2__setup);
const $await_content__setup = $scope => {
@ -68,7 +68,7 @@ const $try_content__setup = $scope => {
$await_content($scope);
$try_content__promiseA($scope);
};
const $try_content__promiseA = /* @__PURE__ */_._closure_get("promiseA", $scope => $try_content__await_promise($scope, $scope._.promiseA));
const $try_content__promiseA = /* @__PURE__ */_._closure_get("promiseA", $scope => $try_content__await_promise($scope, $scope._.promiseA), 0, "__tests__/template.marko_1_promiseA");
const $promiseA = /* @__PURE__ */_._const("promiseA");
const $try = /* @__PURE__ */_._try("#text/0", "<!><!><!>", /* over(1), replace, over(2) */"b%c", $try_content__setup);
export function $setup($scope) {

22
packages/runtime-tags/src/__tests__/fixtures/async-reorder-nested-batched-resolve/__snapshots__/resume-sanitized.expected.md
View File

@ -1,5 +1,27 @@
# Render
```html
LOADING A1
```
# Render FLUSH
```html
<div
class="a"
level="1"
>
<div
class="a"
level="2"
>
LOADING B1
</div>
</div>
```
# Render FLUSH
```html
<div
class="a"
level="1"

136
packages/runtime-tags/src/__tests__/fixtures/async-reorder-nested-batched-resolve/__snapshots__/resume.expected.md
View File

@ -1,5 +1,125 @@
# Render
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<!--M_!^2-->
LOADING A1
<!--M_!2-->
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_4_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT html/body/#text1
```
# Render FLUSH
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<div
class="a"
level="1"
>
<!--M_[-->
<div
class="a"
level="2"
>
<!--M_[-->
<!--M_!^7-->
LOADING B1
<!--M_!7-->
<!--M_]6 #text/1 7-->
</div>
<!--M_]4 #text/1 5-->
</div>
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_4_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [2, _.d = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.f = {}
}], _.d["#PlaceholderContent"] = _._[
"__tests__/template.marko_5_content"
](_.f), _.e), _ =&gt; (_.h = [1, _.g = {
"#BranchAccessor": "#text/1",
"#PlaceholderContent": _.i = {}
}], _.g["#PlaceholderContent"] = _._[
"__tests__/template.marko_10_content"
](_.i), _.h));
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT t
INSERT html/body/div
INSERT html/body/div/#comment0
INSERT html/body/div/div
INSERT html/body/div/div/#comment0
INSERT html/body/div/div/#comment1
INSERT html/body/div/div/#text0
INSERT html/body/div/div/#comment2
INSERT html/body/div/div/#comment3
INSERT html/body/div/#comment1
INSERT t
INSERT t/#comment
REMOVE t after html/body/script0
REMOVE #text after #comment
REMOVE #comment after html/body/#comment0
REMOVE #comment after html/body/#comment0
INSERT html/body/div
REMOVE t after html/body/script0
INSERT html/body/div/div/#text1
INSERT html/body/div/#text
INSERT html/body/script1
```
# Render FLUSH
```html
<html>
<head>
<style
@ -73,3 +193,19 @@
</body>
</html>
```
# Mutations
```
INSERT t
INSERT html/body/div/div/div
INSERT html/body/div/div/div/#comment0
INSERT html/body/div/div/div/div
INSERT html/body/div/div/div/#comment1
REMOVE t after html/body/script1
REMOVE #text after #comment
REMOVE #comment after html/body/div/div/#comment0
REMOVE #comment after html/body/div/div/#comment0
INSERT html/body/div/div/div
INSERT html/body/div/div/div/#text
INSERT html/body/script2
```

2
packages/runtime-tags/src/__tests__/fixtures/async-reorder-nested-batched-resolve/__snapshots__/ssr-sanitized.expected.md
View File

@ -20,7 +20,7 @@ LOADING A1
```
# Render ASYNC
# Render End
```html
<div
class="a"

2
packages/runtime-tags/src/__tests__/fixtures/async-reorder-nested-batched-resolve/__snapshots__/ssr.expected.md
View File

@ -146,7 +146,7 @@ REMOVE t after html/body/script0
INSERT html/body/script1
```
# Render ASYNC
# Render End
```html
<html>
<head>

4
packages/runtime-tags/src/__tests__/fixtures/async-reorder-nested-batched-resolve/test.ts
View File

@ -1,3 +1,3 @@
import { wait } from "../../utils/resolve";
import { flush, wait } from "../../utils/resolve";
export const steps = [{}, wait(4)];
export const steps = [{}, flush, flush, wait(4)];

12
packages/runtime-tags/src/__tests__/fixtures/async-resolve-in-order/__snapshots__/resume-sanitized.expected.md
View File

@ -1,4 +1,16 @@
# Render
```html
a
```
# Render FLUSH
```html
abc
```
# Render FLUSH
```html
abcde
```

31
packages/runtime-tags/src/__tests__/fixtures/async-resolve-in-order/__snapshots__/resume.expected.md
View File

@ -1,5 +1,31 @@
# Render
```html
<html>
<head />
<body>
a
</body>
</html>
```
# Render FLUSH
```html
<html>
<head />
<body>
abc
</body>
</html>
```
# Mutations
```
INSERT html/body/#text1
```
# Render FLUSH
```html
<html>
<head />
<body>
@ -7,3 +33,8 @@
</body>
</html>
```
# Mutations
```
INSERT html/body/#text2
```

2
packages/runtime-tags/src/__tests__/fixtures/async-resolve-in-order/__snapshots__/ssr-sanitized.expected.md
View File

@ -10,7 +10,7 @@ abc
```
# Render ASYNC
# Render End
```html
abcde
```

2
packages/runtime-tags/src/__tests__/fixtures/async-resolve-in-order/__snapshots__/ssr.expected.md
View File

@ -46,7 +46,7 @@ INSERT html/body/#text
INSERT html/body/#text1
```
# Render ASYNC
# Render End
```html
<html>
<head />

6
packages/runtime-tags/src/__tests__/fixtures/async-resolve-in-order/test.ts
View File

@ -1,3 +1,5 @@
import { wait } from "../../utils/resolve";
import { flush, wait } from "../../utils/resolve";
export const steps = [{}, wait(3)];
export const steps = [{}, flush, flush, wait(3)];
export const skip_equivalent = true; // in-order streaming

6
packages/runtime-tags/src/__tests__/fixtures/async-resolve-out-of-order/__snapshots__/resume-sanitized.expected.md
View File

@ -1,4 +1,10 @@
# Render
```html
a
```
# Render FLUSH
```html
abcde
```

16
packages/runtime-tags/src/__tests__/fixtures/async-resolve-out-of-order/__snapshots__/resume.expected.md
View File

@ -1,5 +1,16 @@
# Render
```html
<html>
<head />
<body>
a
</body>
</html>
```
# Render FLUSH
```html
<html>
<head />
<body>
@ -7,3 +18,8 @@
</body>
</html>
```
# Mutations
```
INSERT html/body/#text1
```

2
packages/runtime-tags/src/__tests__/fixtures/async-resolve-out-of-order/__snapshots__/ssr-sanitized.expected.md
View File

@ -4,7 +4,7 @@ a
```
# Render ASYNC
# Render End
```html
abcde
```

2
packages/runtime-tags/src/__tests__/fixtures/async-resolve-out-of-order/__snapshots__/ssr.expected.md
View File

@ -26,7 +26,7 @@ INSERT html/body
INSERT html/body/#text
```
# Render ASYNC
# Render End
```html
<html>
<head />

6
packages/runtime-tags/src/__tests__/fixtures/async-resolve-out-of-order/test.ts
View File

@ -1,3 +1,5 @@
import { wait } from "../../utils/resolve";
import { flush, wait } from "../../utils/resolve";
export const steps = [{}, wait(3)];
export const steps = [{}, flush, wait(3)];
export const skip_equivalent = true; // in-order streaming

9
packages/runtime-tags/src/__tests__/fixtures/async-state/__snapshots__/resume-sanitized.expected.md
View File

@ -3,6 +3,15 @@
<button>
inc
</button>
LOADING...
```
# Render FLUSH
```html
<button>
inc
</button>
0
```

61
packages/runtime-tags/src/__tests__/fixtures/async-state/__snapshots__/resume.expected.md
View File

@ -1,5 +1,51 @@
# Render
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<button>
inc
</button>
<!--M_*1 #button/0-->
<!--M_[-->
<!--M_!^2-->
LOADING...
<!--M_!2-->
<!--M_]1 #text/1 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.c = [0, _.a = {
clickCount: 0,
"ClosureScopes:clickCount": _.d = new Set
}, _.b = {
_: _.a,
"ClosureSignalIndex:clickCount": 0,
"#BranchAccessor": "#text/1"
}], _.b["#PlaceholderContent"] = _._[
"__tests__/template.marko_2_content"
](_.a), (_.d).add(_.b), _.c),
"__tests__/template.marko_0_clickCount 1"
];
REORDER_RUNTIME(M._);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT html/body/#text1
```
# Render FLUSH
```html
<html>
<head>
<style
@ -45,6 +91,21 @@
</html>
```
# Mutations
```
INSERT t
INSERT html/body/#comment2
INSERT html/body/#text0
INSERT html/body/#comment3
INSERT html/body/#comment4
REMOVE t after html/body/script0
REMOVE #text after #comment
REMOVE #comment after html/body/#comment1
REMOVE #comment after html/body/#comment1
INSERT html/body/#comment2, html/body/#text0, html/body/#comment3, html/body/#comment4
INSERT html/body/#text1
INSERT html/body/script1
```
# Render
```js

2
packages/runtime-tags/src/__tests__/fixtures/async-state/__snapshots__/ssr-sanitized.expected.md
View File

@ -7,7 +7,7 @@ LOADING...
```
# Render ASYNC
# Render End
```html
<button>
inc

2
packages/runtime-tags/src/__tests__/fixtures/async-state/__snapshots__/ssr.expected.md
View File

@ -72,7 +72,7 @@ REMOVE t after html/body/#comment4
INSERT html/body/script
```
# Render ASYNC
# Render End
```html
<html>
<head>

4
packages/runtime-tags/src/__tests__/fixtures/async-state/test.ts
View File

@ -1,6 +1,6 @@
import { wait } from "../../utils/resolve";
import { flush, wait } from "../../utils/resolve";
export const steps = [{}, wait(1), click, wait(1), click, wait(1)];
export const steps = [{}, flush, wait(1), click, wait(1), click, wait(1)];
function click(container: Element) {
container.querySelector("button")!.click();

13
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/__snapshots__/.name-cache.json Normal file
View File

@ -0,0 +1,13 @@
{
"vars": {
"props": {
"$_": "t",
"$init": "o",
"$$if_content__value": "a",
"$$if_content__setup": "e",
"$$if": "m",
"$$value__script": "r",
"$$value": "i"
}
}
}

68
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/__snapshots__/csr-sanitized.expected.md Normal file
View File

@ -0,0 +1,68 @@
# Render
```html
<button>
1
</button>
<span>
1
</span>
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
2
</button>
<span>
2
</span>
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
3
</button>
<span>
3
</span>
```
# Render ASYNC
```html
<button>
3
</button>
<span>
Hello
</span>
<span>
3
</span>
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
4
</button>
<span>
Hello
</span>
<span>
4
</span>
```

98
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/__snapshots__/csr.expected.md Normal file
View File

@ -0,0 +1,98 @@
# Render
```html
<button>
1
</button>
<span>
1
</span>
<!---->
```
# Mutations
```
INSERT button, #text, span, #comment
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
2
</button>
<span>
2
</span>
<!---->
```
# Mutations
```
UPDATE button/#text "1" => "2"
UPDATE span/#text "1" => "2"
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
3
</button>
<span>
3
</span>
<!---->
```
# Mutations
```
UPDATE button/#text "2" => "3"
UPDATE span/#text "2" => "3"
```
# Render ASYNC
```html
<button>
3
</button>
<span>
Hello
</span>
<span>
3
</span>
<!---->
```
# Mutations
```
INSERT span0
REMOVE #text after span0
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
4
</button>
<span>
Hello
</span>
<span>
4
</span>
<!---->
```
# Mutations
```
UPDATE button/#text "3" => "4"
UPDATE span1/#text "3" => "4"
```

18
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/__snapshots__/dom.expected/template.hydrate.js Normal file
View File

@ -0,0 +1,18 @@
// size: 213 (min) 153 (brotli)
const $if_content__value = _._if_closure(3, 0, ($scope) =>
_._text($scope.a, $scope._.e),
),
$if_content__setup = $if_content__value,
$if = _._if(3, "<span> </span>", "D l", $if_content__setup),
$value__script = _._script("a0", ($scope) =>
_._on($scope.a, "click", function () {
$value($scope, $scope.e + 1);
}),
),
$value = _._let(4, ($scope) => {
(_._text($scope.b, $scope.e),
$if($scope, $scope.e ? 0 : 1),
$if_content__value($scope),
$value__script($scope));
});
init();

24
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/__snapshots__/dom.expected/template.js Normal file
View File

@ -0,0 +1,24 @@
export const $template = "<button> </button><!><!><!>";
export const $walks = /* get, next(1), get, out(1), replace, over(1), replace, over(2) */" D l%b%c";
import { resolveAfter } from "../../utils/resolve";
import * as _ from "@marko/runtime-tags/debug/dom";
const $if_content__value = /* @__PURE__ */_._if_closure("#text/3", 0, $scope => _._text($scope["#text/0"], $scope._.value));
const $if_content__setup = $if_content__value;
const $if = /* @__PURE__ */_._if("#text/3", "<span> </span>", /* next(1), get, out(1) */"D l", $if_content__setup);
const $value__script = _._script("__tests__/template.marko_0_value", $scope => _._on($scope["#button/0"], "click", function () {
$value($scope, $scope.value + 1);
}));
const $value = /* @__PURE__ */_._let("value/4", $scope => {
_._text($scope["#text/1"], $scope.value);
$if($scope, $scope.value ? 0 : 1);
$if_content__value($scope);
$value__script($scope);
});
const $await_content = /* @__PURE__ */_._await_content("#text/2", "<span>Hello</span>", /* over(1) */"b");
const $await_promise = /* @__PURE__ */_._await_promise("#text/2");
export function $setup($scope) {
$await_content($scope);
$value($scope, 1);
$await_promise($scope, resolveAfter(0, 3));
}
export default /* @__PURE__ */_._template("__tests__/template.marko", $template, $walks, $setup);

28
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/__snapshots__/html.expected/template.js Normal file
View File

@ -0,0 +1,28 @@
import { resolveAfter } from "../../utils/resolve";
import * as _ from "@marko/runtime-tags/debug/html";
export default _._template("__tests__/template.marko", input => {
const $scope0_id = _._scope_id();
let value = 1;
_._html(`<button>${_._escape(value)}${_._el_resume($scope0_id, "#text/1")}</button>${_._el_resume($scope0_id, "#button/0")}`);
_._await($scope0_id, "#text/2", resolveAfter(0, 3), () => {
const $scope2_id = _._scope_id();
_._html("<span>Hello</span>");
}, 0);
_._if(() => {
if (value) {
const $scope1_id = _._scope_id();
_._html(`<span>${_._escape(value)}${_._el_resume($scope1_id, "#text/0")}</span>`);
_._scope($scope1_id, {
_: _._scope_with_id($scope0_id)
}, "__tests__/template.marko", "6:1");
return 0;
}
}, $scope0_id, "#text/3", 1, /* value */1, /* value */1, 0, 1);
_._script($scope0_id, "__tests__/template.marko_0_value");
_._scope($scope0_id, {
value
}, "__tests__/template.marko", 0, {
value: "2:5"
});
_._resume_branch($scope0_id);
});

59
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/__snapshots__/resume-sanitized.expected.md Normal file
View File

@ -0,0 +1,59 @@
# Render
```html
<button>
1
</button>
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
1
</button>
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
1
</button>
```
# Render FLUSH
```html
<button>
1
</button>
<span>
Hello
</span>
<span>
1
</span>
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
2
</button>
<span>
Hello
</span>
<span>
2
</span>
```

172
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/__snapshots__/resume.expected.md Normal file
View File

@ -0,0 +1,172 @@
# Render
```html
<html>
<head />
<body>
<button>
1
<!--M_*1 #text/1-->
</button>
<!--M_*1 #button/0-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, _.a = {
value: 1
},
{
_: _.a
}])]
</script>
</body>
</html>
```
# Render
```js
container.querySelector("button").click();
```
```html
<html>
<head />
<body>
<button>
1
<!--M_*1 #text/1-->
</button>
<!--M_*1 #button/0-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, _.a = {
value: 1
},
{
_: _.a
}])]
</script>
</body>
</html>
```
# Render
```js
container.querySelector("button").click();
```
```html
<html>
<head />
<body>
<button>
1
<!--M_*1 #text/1-->
</button>
<!--M_*1 #button/0-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, _.a = {
value: 1
},
{
_: _.a
}])]
</script>
</body>
</html>
```
# Render FLUSH
```html
<html>
<head />
<body>
<button>
1
<!--M_*1 #text/1-->
</button>
<!--M_*1 #button/0-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, _.a = {
value: 1
},
{
_: _.a
}])]
</script>
<span>
Hello
</span>
<span>
1
<!--M_*2 #text/0-->
</span>
<!--M_|1 #text/3 2-->
<script>
M._.r.push(
"__tests__/template.marko_0_value 1"
);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT html/body/span0
INSERT html/body/span0/#text
INSERT html/body/span1
INSERT html/body/span1/#text
INSERT html/body/span1/#comment
INSERT html/body/#comment1
INSERT html/body/script1
```
# Render
```js
container.querySelector("button").click();
```
```html
<html>
<head />
<body>
<button>
2
<!--M_*1 #text/1-->
</button>
<!--M_*1 #button/0-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, _.a = {
value: 1
},
{
_: _.a
}])]
</script>
<span>
Hello
</span>
<span>
2
</span>
<!--M_|1 #text/3 2-->
<script>
M._.r.push(
"__tests__/template.marko_0_value 1"
);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
UPDATE html/body/button/#text "1" => "2"
INSERT html/body/span1
REMOVE span after html/body/span1
UPDATE html/body/span1/#text " " => "2"
```

20
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/__snapshots__/ssr-sanitized.expected.md Normal file
View File

@ -0,0 +1,20 @@
# Render ASYNC
```html
<button>
1
</button>
```
# Render End
```html
<button>
1
</button>
<span>
Hello
</span>
<span>
1
</span>
```

92
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/__snapshots__/ssr.expected.md Normal file
View File

@ -0,0 +1,92 @@
# Write
```html
<button>1<!--M_*1 #text/1--></button><!--M_*1 #button/0--><script>WALKER_RUNTIME("M")("_");M._.r=[_=>(_.b=[0,_.a={value:1},{_:_.a}])]</script>
```
# Write
```html
<span>Hello</span><span>1<!--M_*2 #text/0--></span><!--M_|1 #text/3 2--><script>M._.r.push("__tests__/template.marko_0_value 1");M._.w()</script>
```
# Render ASYNC
```html
<html>
<head />
<body>
<button>
1
<!--M_*1 #text/1-->
</button>
<!--M_*1 #button/0-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, _.a = {
value: 1
},
{
_: _.a
}])]
</script>
</body>
</html>
```
# Mutations
```
INSERT html
INSERT html/head
INSERT html/body
INSERT html/body/button
INSERT html/body/button/#text
INSERT html/body/button/#comment
INSERT html/body/#comment
INSERT html/body/script
```
# Render End
```html
<html>
<head />
<body>
<button>
1
<!--M_*1 #text/1-->
</button>
<!--M_*1 #button/0-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, _.a = {
value: 1
},
{
_: _.a
}])]
</script>
<span>
Hello
</span>
<span>
1
<!--M_*2 #text/0-->
</span>
<!--M_|1 #text/3 2-->
<script>
M._.r.push(
"__tests__/template.marko_0_value 1"
);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT html/body/span0
INSERT html/body/span0/#text
INSERT html/body/span1
INSERT html/body/span1/#text
INSERT html/body/span1/#comment
INSERT html/body/#comment1
INSERT html/body/script1
```

7
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/template.marko Normal file
View File

@ -0,0 +1,7 @@
import { resolveAfter } from "../../utils/resolve";
let/value=1
button onClick() { value++ } -- ${value}
await=resolveAfter(0, 3)
span -- Hello
if=value
span -- ${value}

18
packages/runtime-tags/src/__tests__/fixtures/await-closure-in-order/test.ts Normal file
View File

@ -0,0 +1,18 @@
import { flush, wait } from "../../utils/resolve";
export const steps = [
{},
wait(1),
click,
wait(1),
click,
wait(1),
flush,
click,
];
export const skip_equivalent = true; // in-order streaming
function click(container: Element) {
container.querySelector("button")!.click();
}

12
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/__snapshots__/.name-cache.json Normal file
View File

@ -0,0 +1,12 @@
{
"vars": {
"props": {
"$_": "_",
"$init": "t",
"$$await_content__value": "e",
"$$value__closure": "o",
"$$value__script": "r",
"$$value": "a"
}
}
}

15
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/__snapshots__/csr-sanitized.expected.md Normal file
View File

@ -0,0 +1,15 @@
# Render
# Render ASYNC
```html
loading...
```
# Render ASYNC
```html
<span>
1
</span>
```

45
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/__snapshots__/csr.expected.md Normal file
View File

@ -0,0 +1,45 @@
# Render
```html
<!---->
<!---->
<!---->
<!---->
```
# Mutations
```
INSERT #comment0, #comment1, #text, #comment2, #comment3
```
# Render ASYNC
```html
<!---->
loading...
<!---->
```
# Mutations
```
INSERT #text
REMOVE #document-fragment/#comment0 after #text
REMOVE #document-fragment/#text after #text
REMOVE #document-fragment/#comment1 after #text
```
# Render ASYNC
```html
<!---->
<!---->
<span>
1
</span>
<!---->
<!---->
```
# Mutations
```
INSERT #comment1, span, #comment2
REMOVE #text after #comment2
UPDATE span/#text " " => "1"
```

2
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/__snapshots__/dom.expected/template.hydrate.js Normal file
View File

@ -0,0 +1,2 @@
// size: 59 (min) 58 (brotli)
(_._enable_catch(), _._content_resume("a0", "loading...", "b"));

25
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/__snapshots__/dom.expected/template.js Normal file
View File

@ -0,0 +1,25 @@
export const $template = "<!><!><!>";
export const $walks = /* over(1), replace, over(2) */"b%c";
import { resolveAfter } from "../../utils/resolve";
import * as _ from "@marko/runtime-tags/debug/dom";
_._enable_catch();
const $placeholder_content = _._content_resume("__tests__/template.marko_3_content", "loading...", /* over(1) */"b");
const $await_content__value = /* @__PURE__ */_._closure_get("value", $scope => _._text($scope["#text/0"], $scope._._.value), $scope => $scope._._, "__tests__/template.marko_2_value");
const $await_content__setup = $await_content__value;
const $await_content = /* @__PURE__ */_._await_content("#text/0", "<span> </span>", /* next(1), get, out(1) */"D l", $await_content__setup);
const $try_content__await_promise = /* @__PURE__ */_._await_promise("#text/0");
const $try_content__setup = $scope => {
$await_content($scope);
$try_content__await_promise($scope, resolveAfter(0, 1));
};
const $value = /* @__PURE__ */_._let("value/1");
const $try = /* @__PURE__ */_._try("#text/0", "<!><!><!>", /* over(1), replace, over(2) */"b%c", $try_content__setup);
export function $setup($scope) {
$value($scope, 1);
$try($scope, {
placeholder: _.attrTag({
content: $placeholder_content($scope)
})
});
}
export default /* @__PURE__ */_._template("__tests__/template.marko", $template, $walks, $setup);

22
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/__snapshots__/html.expected/template.js Normal file
View File

@ -0,0 +1,22 @@
import { resolveAfter } from "../../utils/resolve";
import * as _ from "@marko/runtime-tags/debug/html";
export default _._template("__tests__/template.marko", input => {
const $scope0_id = _._scope_id();
let value = 1;
_._try($scope0_id, "#text/0", _._content_resume("__tests__/template.marko_1_content", () => {
const $scope1_id = _._scope_id();
_._await($scope1_id, "#text/0", resolveAfter(0, 1), () => {
const $scope2_id = _._scope_id();
_._html(`<span>${_._escape(value)}</span>`);
_._resume_branch($scope2_id);
}, 0);
}, $scope0_id), {
placeholder: _.attrTag({
content: _._content_resume("__tests__/template.marko_3_content", () => {
const $scope3_id = _._scope_id();
_._html("loading...");
}, $scope0_id)
})
});
_._resume_branch($scope0_id);
});

12
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/__snapshots__/resume-sanitized.expected.md Normal file
View File

@ -0,0 +1,12 @@
# Render
```html
loading...
```
# Render FLUSH
```html
<span>
1
</span>
```

82
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/__snapshots__/resume.expected.md Normal file
View File

@ -0,0 +1,82 @@
# Render
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<!--M_!^2-->
loading...
<!--M_!2-->
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_3_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT html/body/#text1
```
# Render FLUSH
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<span>
1
</span>
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_3_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT t
INSERT html/body/span
INSERT html/body/span/#text
REMOVE t after html/body/script0
REMOVE #text after #comment
REMOVE #comment after html/body/#comment0
REMOVE #comment after html/body/#comment0
INSERT html/body/span
INSERT html/body/script1
```

12
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/__snapshots__/ssr-sanitized.expected.md Normal file
View File

@ -0,0 +1,12 @@
# Render ASYNC
```html
loading...
```
# Render End
```html
<span>
1
</span>
```

107
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/__snapshots__/ssr.expected.md Normal file
View File

@ -0,0 +1,107 @@
# Write
```html
<!--M_[--><!--M_!^2-->loading...<!--M_!2--><!--M_]1 #text/0 2--><style M_>t{display:none}</style><t M_=2><!--M_#b--></t><script>WALKER_RUNTIME("M")("_");M._.r=[_=>(_.b=[0,1,_.a={"#BranchAccessor":"#text/0","#PlaceholderContent":_.c={}}],_.a["#PlaceholderContent"]=_._["__tests__/template.marko_3_content"](_.c),_.b)];REORDER_RUNTIME(M._);M._.w()</script>
```
# Write
```html
<t M_=b><span>1</span></t><script>M._.w()</script>
```
# Render ASYNC
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<!--M_!^2-->
loading...
<!--M_!2-->
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_3_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT html
INSERT html/head
INSERT html/body
INSERT html/body/#comment0
INSERT html/body/#comment1
INSERT html/body/#text
INSERT html/body/#comment2
INSERT html/body/#comment3
INSERT html/head/style
INSERT html/head/style/#text
INSERT t
INSERT t/#comment
REMOVE html/head/style after html/body/#comment3
INSERT html/head/style
REMOVE t after html/body/#comment3
INSERT html/body/script
```
# Render End
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<span>
1
</span>
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_3_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT t
INSERT html/body/span
INSERT html/body/span/#text
REMOVE t after html/body/script0
REMOVE #text after #comment
REMOVE #comment after html/body/#comment0
REMOVE #comment after html/body/#comment0
INSERT html/body/span
INSERT html/body/script1
```

6
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/template.marko Normal file
View File

@ -0,0 +1,6 @@
import { resolveAfter } from "../../utils/resolve";
let/value=1
try
@placeholder -- loading...
await=resolveAfter(0, 1)
span -- ${value}

3
packages/runtime-tags/src/__tests__/fixtures/await-closure-inert/test.ts Normal file
View File

@ -0,0 +1,3 @@
import { flush, wait } from "../../utils/resolve";
export const steps = [{}, flush, wait(1)];

13
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/__snapshots__/.name-cache.json Normal file
View File

@ -0,0 +1,13 @@
{
"vars": {
"props": {
"$_": "t",
"$init": "a",
"$$if_content__value": "o",
"$$if_content__setup": "_",
"$$await_content__if": "n",
"$$await_content__value__script": "e",
"$$await_content__value": "m"
}
}
}

46
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/__snapshots__/csr-sanitized.expected.md Normal file
View File

@ -0,0 +1,46 @@
# Render
# Render ASYNC
```html
loading...
```
# Render ASYNC
```html
<button>
1
</button>
<span>
1
</span>
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
2
</button>
<span>
2
</span>
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
3
</button>
<span>
3
</span>
```

100
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/__snapshots__/csr.expected.md Normal file
View File

@ -0,0 +1,100 @@
# Render
```html
<!---->
<!---->
<!---->
<!---->
```
# Mutations
```
INSERT #comment0, #comment1, #text, #comment2, #comment3
```
# Render ASYNC
```html
<!---->
loading...
<!---->
```
# Mutations
```
INSERT #text
REMOVE #document-fragment/#comment0 after #text
REMOVE #document-fragment/#text after #text
REMOVE #document-fragment/#comment1 after #text
```
# Render ASYNC
```html
<!---->
<!---->
<button>
1
</button>
<span>
1
</span>
<!---->
<!---->
<!---->
```
# Mutations
```
INSERT #comment1, button, #text, #comment2, #comment3
REMOVE #text after #comment3
UPDATE button/#text " " => "1"
INSERT span
REMOVE #text after span
UPDATE span/#text " " => "1"
```
# Render
```js
container.querySelector("button").click();
```
```html
<!---->
<!---->
<button>
2
</button>
<span>
2
</span>
<!---->
<!---->
<!---->
```
# Mutations
```
UPDATE button/#text "1" => "2"
UPDATE span/#text "1" => "2"
```
# Render
```js
container.querySelector("button").click();
```
```html
<!---->
<!---->
<button>
3
</button>
<span>
3
</span>
<!---->
<!---->
<!---->
```
# Mutations
```
UPDATE button/#text "2" => "3"
UPDATE span/#text "2" => "3"
```

19
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/__snapshots__/dom.expected/template.hydrate.js Normal file
View File

@ -0,0 +1,19 @@
// size: 274 (min) 180 (brotli)
_._enable_catch();
const $if_content__value = _._if_closure(2, 0, ($scope) =>
_._text($scope.a, $scope._.d),
),
$if_content__setup = $if_content__value,
$await_content__if = _._if(2, "<span> </span>", "D l", $if_content__setup),
$await_content__value__script = _._script("a0", ($scope) =>
_._on($scope.a, "click", function () {
$await_content__value($scope, $scope.d + 1);
}),
),
$await_content__value = _._let(3, ($scope) => {
(_._text($scope.b, $scope.d),
$await_content__if($scope, $scope.d > 0 ? 0 : 1),
$if_content__value($scope),
$await_content__value__script($scope));
});
(_._content_resume("a1", "loading...", "b"), init());

37
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/__snapshots__/dom.expected/template.js Normal file
View File

@ -0,0 +1,37 @@
export const $template = "<!><!><!>";
export const $walks = /* over(1), replace, over(2) */"b%c";
import { resolveAfter } from "../../utils/resolve";
import * as _ from "@marko/runtime-tags/debug/dom";
_._enable_catch();
const $if_content__value = /* @__PURE__ */_._if_closure("#text/2", 0, $scope => _._text($scope["#text/0"], $scope._.value));
const $if_content__setup = $if_content__value;
const $await_content__if = /* @__PURE__ */_._if("#text/2", "<span> </span>", /* next(1), get, out(1) */"D l", $if_content__setup);
const $await_content__value__script = _._script("__tests__/template.marko_3_value", $scope => _._on($scope["#button/0"], "click", function () {
$await_content__value($scope, $scope.value + 1);
}));
const $await_content__value = /* @__PURE__ */_._let("value/3", $scope => {
debugger;
_._text($scope["#text/1"], $scope.value);
$await_content__if($scope, $scope.value > 0 ? 0 : 1);
$if_content__value($scope);
$await_content__value__script($scope);
});
const $await_content__setup = $scope => {
$await_content__value($scope, 1);
};
const $placeholder_content = _._content_resume("__tests__/template.marko_2_content", "loading...", /* over(1) */"b");
const $await_content = /* @__PURE__ */_._await_content("#text/0", "<button> </button><!><!>", /* get, next(1), get, out(1), replace, over(2) */" D l%c", $await_content__setup);
const $try_content__await_promise = /* @__PURE__ */_._await_promise("#text/0");
const $try_content__setup = $scope => {
$await_content($scope);
$try_content__await_promise($scope, resolveAfter(0, 1));
};
const $try = /* @__PURE__ */_._try("#text/0", "<!><!><!>", /* over(1), replace, over(2) */"b%c", $try_content__setup);
export function $setup($scope) {
$try($scope, {
placeholder: _.attrTag({
content: $placeholder_content($scope)
})
});
}
export default /* @__PURE__ */_._template("__tests__/template.marko", $template, $walks, $setup);

38
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/__snapshots__/html.expected/template.js Normal file
View File

@ -0,0 +1,38 @@
import { resolveAfter } from "../../utils/resolve";
import * as _ from "@marko/runtime-tags/debug/html";
export default _._template("__tests__/template.marko", input => {
const $scope0_id = _._scope_id();
_._try($scope0_id, "#text/0", _._content_resume("__tests__/template.marko_1_content", () => {
const $scope1_id = _._scope_id();
_._await($scope1_id, "#text/0", resolveAfter(0, 1), () => {
const $scope3_id = _._scope_id();
let value = 1;
debugger;
_._html(`<button>${_._escape(value)}${_._el_resume($scope3_id, "#text/1")}</button>${_._el_resume($scope3_id, "#button/0")}`);
_._if(() => {
if (value > 0) {
const $scope4_id = _._scope_id();
_._html(`<span>${_._escape(value)}${_._el_resume($scope4_id, "#text/0")}</span>`);
_._scope($scope4_id, {
_: _._scope_with_id($scope3_id)
}, "__tests__/template.marko", "8:5");
return 0;
}
}, $scope3_id, "#text/2", 1, /* value */1, /* value */1, 0, 1);
_._script($scope3_id, "__tests__/template.marko_3_value");
_._scope($scope3_id, {
value
}, "__tests__/template.marko", "4:3", {
value: "5:9"
});
_._resume_branch($scope3_id);
});
}, $scope0_id), {
placeholder: _.attrTag({
content: _._content_resume("__tests__/template.marko_2_content", () => {
const $scope2_id = _._scope_id();
_._html("loading...");
}, $scope0_id)
})
});
});

43
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/__snapshots__/resume-sanitized.expected.md Normal file
View File

@ -0,0 +1,43 @@
# Render
```html
loading...
```
# Render FLUSH
```html
<button>
1
</button>
<span>
1
</span>
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
2
</button>
<span>
2
</span>
```
# Render
```js
container.querySelector("button").click();
```
```html
<button>
3
</button>
<span>
3
</span>
```

240
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/__snapshots__/resume.expected.md Normal file
View File

@ -0,0 +1,240 @@
# Render
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<!--M_!^2-->
loading...
<!--M_!2-->
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_2_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT html/body/#text1
```
# Render FLUSH
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<!--M_[-->
<button>
1
<!--M_*4 #text/1-->
</button>
<!--M_*4 #button/0-->
<span>
1
<!--M_*5 #text/0-->
</span>
<!--M_|4 #text/2 5-->
<!--M_]2 #text/0 4-->
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_2_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [1, _.d = {
value: 1
},
{
_: _.d
}]));
M._.j.b = _ =&gt;
{
_.push(
"__tests__/template.marko_3_value 4"
)
};
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT t
INSERT html/body/#comment1
INSERT html/body/button
INSERT html/body/button/#text
INSERT html/body/button/#comment
INSERT html/body/#comment2
INSERT html/body/span
INSERT html/body/span/#text
INSERT html/body/span/#comment
INSERT html/body/#comment3
INSERT html/body/#comment4
REMOVE t after html/body/script0
REMOVE #text after #comment
REMOVE #comment after html/body/#comment0
REMOVE #comment after html/body/#comment0
INSERT html/body/#comment1, html/body/button, html/body/#comment2, html/body/span, html/body/#comment3, html/body/#comment4
INSERT html/body/#text0
INSERT html/body/script1
```
# Render
```js
container.querySelector("button").click();
```
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<!--M_[-->
<button>
2
<!--M_*4 #text/1-->
</button>
<!--M_*4 #button/0-->
<span>
2
</span>
<!--M_|4 #text/2 5-->
<!--M_]2 #text/0 4-->
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_2_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [1, _.d = {
value: 1
},
{
_: _.d
}]));
M._.j.b = _ =&gt;
{
_.push(
"__tests__/template.marko_3_value 4"
)
};
M._.w()
</script>
</body>
</html>
```
# Mutations
```
UPDATE html/body/button/#text "1" => "2"
INSERT html/body/span
REMOVE span after html/body/span
UPDATE html/body/span/#text " " => "2"
```
# Render
```js
container.querySelector("button").click();
```
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<!--M_[-->
<button>
3
<!--M_*4 #text/1-->
</button>
<!--M_*4 #button/0-->
<span>
3
</span>
<!--M_|4 #text/2 5-->
<!--M_]2 #text/0 4-->
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_2_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [1, _.d = {
value: 1
},
{
_: _.d
}]));
M._.j.b = _ =&gt;
{
_.push(
"__tests__/template.marko_3_value 4"
)
};
M._.w()
</script>
</body>
</html>
```
# Mutations
```
UPDATE html/body/button/#text "2" => "3"
UPDATE html/body/span/#text "2" => "3"
```

15
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/__snapshots__/ssr-sanitized.expected.md Normal file
View File

@ -0,0 +1,15 @@
# Render ASYNC
```html
loading...
```
# Render End
```html
<button>
1
</button>
<span>
1
</span>
```

136
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/__snapshots__/ssr.expected.md Normal file
View File

@ -0,0 +1,136 @@
# Write
```html
<!--M_[--><!--M_!^2-->loading...<!--M_!2--><!--M_]1 #text/0 2--><style M_>t{display:none}</style><t M_=2><!--M_#b--></t><script>WALKER_RUNTIME("M")("_");M._.r=[_=>(_.b=[0,1,_.a={"#BranchAccessor":"#text/0","#PlaceholderContent":_.c={}}],_.a["#PlaceholderContent"]=_._["__tests__/template.marko_2_content"](_.c),_.b)];REORDER_RUNTIME(M._);M._.w()</script>
```
# Write
```html
<t M_=b><!--M_[--><button>1<!--M_*4 #text/1--></button><!--M_*4 #button/0--><span>1<!--M_*5 #text/0--></span><!--M_|4 #text/2 5--><!--M_]2 #text/0 4--></t><script>M._.r.push(_=>(_.e=[1,_.d={value:1},{_:_.d}]));M._.j.b=_=>{_.push("__tests__/template.marko_3_value 4")};M._.w()</script>
```
# Render ASYNC
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<!--M_!^2-->
loading...
<!--M_!2-->
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_2_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT html
INSERT html/head
INSERT html/body
INSERT html/body/#comment0
INSERT html/body/#comment1
INSERT html/body/#text
INSERT html/body/#comment2
INSERT html/body/#comment3
INSERT html/head/style
INSERT html/head/style/#text
INSERT t
INSERT t/#comment
REMOVE html/head/style after html/body/#comment3
INSERT html/head/style
REMOVE t after html/body/#comment3
INSERT html/body/script
```
# Render End
```html
<html>
<head>
<style
m_=""
>
t{display:none}
</style>
</head>
<body>
<!--M_[-->
<!--M_[-->
<button>
1
<!--M_*4 #text/1-->
</button>
<!--M_*4 #button/0-->
<span>
1
<!--M_*5 #text/0-->
</span>
<!--M_|4 #text/2 5-->
<!--M_]2 #text/0 4-->
<!--M_]1 #text/0 2-->
<script>
WALKER_RUNTIME("M")("_");
M._.r = [_ =&gt; (_.b = [0, 1, _.a = {
"#BranchAccessor": "#text/0",
"#PlaceholderContent": _.c = {}
}], _.a["#PlaceholderContent"] = _._[
"__tests__/template.marko_2_content"
](_.c), _.b)];
REORDER_RUNTIME(M._);
M._.w()
</script>
<script>
M._.r.push(_ =&gt; (_.e = [1, _.d = {
value: 1
},
{
_: _.d
}]));
M._.j.b = _ =&gt;
{
_.push(
"__tests__/template.marko_3_value 4"
)
};
M._.w()
</script>
</body>
</html>
```
# Mutations
```
INSERT t
INSERT html/body/#comment1
INSERT html/body/button
INSERT html/body/button/#text
INSERT html/body/button/#comment
INSERT html/body/#comment2
INSERT html/body/span
INSERT html/body/span/#text
INSERT html/body/span/#comment
INSERT html/body/#comment3
INSERT html/body/#comment4
REMOVE t after html/body/script0
REMOVE #text after #comment
REMOVE #comment after html/body/#comment0
REMOVE #comment after html/body/#comment0
INSERT html/body/#comment1, html/body/button, html/body/#comment2, html/body/span, html/body/#comment3, html/body/#comment4
INSERT html/body/script1
```

9
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/template.marko Normal file
View File

@ -0,0 +1,9 @@
import { resolveAfter } from "../../utils/resolve";
try
@placeholder -- loading...
await=resolveAfter(0, 1)
let/value=1
debug=value
button onClick() { value++ } -- ${value}
if=(value > 0)
span -- ${value}

7
packages/runtime-tags/src/__tests__/fixtures/await-closure-within/test.ts Normal file
View File

@ -0,0 +1,7 @@
import { flush, wait } from "../../utils/resolve";
export const steps = [{}, flush, wait(2), click, wait(1), click];
function click(container: Element) {
container.querySelector("button")!.click();
}

Some files were not shown because too many files have changed in this diff Show More