Recursion with tick().then • Playground • Svelte

App.svelte
import {tick} from "svelte";
let isSmallerThan10 = true;
let count = {a:1};
$: tick().then(() => {
if (count.a) {
if (count.a < 10) {
console.error("smaller", count.a);
// this should trigger this reactive block again and enter the "else" but it doesn't
count = {a: 11};
} else {
console.error("larger", count.a);
isSmallerThan10 = false;
}
});
</script>
<p>
count is {count.a}
</p>
<p>
isSmallerThan10 is {isSmallerThan10}
</p>
▶ smaller 1
▶ larger 11
import 'svelte/internal/disclose-version';
import 'svelte/internal/flags/legacy';
import * as $ from 'svelte/internal/client';
import { tick } from "svelte";
var root = $.template(`<p> </p> <p> </p>`, 1);
export default function App($$anchor, $$props) {
$.push($$props, false);
let isSmallerThan10 = $.mutable_state(true);
let count = $.mutable_state({ a: 1 });
$.legacy_pre_effect(() => (tick, $.get(count)), () => {
tick().then(() => {
if ($.get(count).a) {
if ($.get(count).a < 10) {
console.error("smaller", $.get(count).a);
// this should trigger this reactive block again and enter the "else" but it doesn't
$.set(count, { a: 11 });
} else {
console.error("larger", $.get(count).a);
$.set(isSmallerThan10, false);
}
});
$.legacy_pre_effect_reset();
$.init();
var fragment = root();
var p = $.first_child(fragment);
var text = $.child(p);
$.reset(p);
result = svelte.compile(source, {
generate: "client" "server",
dev: false });
/* Add a <style> tag to see the CSS output */
		
			
				
					 Root {
 css: null
js: []
start: 408
end: 483
type: "Root"
fragment: Fragment {...}
 type: "Fragment"
nodes: [...] (4)
  Text {...}
 type: "Text"
start: 406
end: 408
raw: "\n\n"
data: "\n\n"
 }
 RegularElement {...}
 type: "RegularElement"
start: 408
end: 436
name: "p"
attributes: []
fragment: Fragment {...}
 type: "Fragment"
nodes: [...] (3)
  Text {...}
 type: "Text"
start: 411
end: 422
raw: "count is "
data: "count is "
 }
 ExpressionTag {...}
 type: "ExpressionTag"
start: 422
end: 431
expression: MemberExpression {...}
 type: "MemberExpression"
start: 423
end: 430
loc:  {...}
 start:  {...}
 line: 20
column: 11
 }
end:  {...}
 line: 20
column: 18
 }
 }
object: Identifier {...}
 type: "Identifier"
start: 423
end: 428
loc:  {...}
 start:  {...}
 line: 20
column: 11
 }
end:  {...}
 line: 20
column: 16
 }
 }
name: "count"
 }
property: Identifier {...}
 type: "Identifier"
start: 429
end: 430
loc:  {...}
 start:  {...}
 line: 20
column: 17
 }
end:  {...}
 line: 20
column: 18
 }
 }
name: "a"
 }
computed: false
optional: false
 }
 }
 Text {...}
 type: "Text"
start: 431
end: 432
raw: "\n"
data: "\n"
 }
 ]
 }
 }
 Text {...}
 type: "Text"
start: 436
end: 437
raw: " "
data: " "
 }
 RegularElement {...}
 type: "RegularElement"
start: 437
end: 483
name: "p"
attributes: []
fragment: Fragment {...}
 type: "Fragment"
nodes: [...] (3)
  Text {...}
 type: "Text"
start: 440
end: 461
raw: "isSmallerThan10 is "
data: "isSmallerThan10 is "
 }
 ExpressionTag {...}
 type: "ExpressionTag"
start: 461
end: 478
expression: Identifier {...}
 type: "Identifier"
start: 462
end: 477
loc:  {...}
 start:  {...}
 line: 23
column: 21
 }
end:  {...}
 line: 23
column: 36
 }
 }
name: "isSmallerThan10"
 }
 }
 Text {...}
 type: "Text"
start: 478
end: 479
raw: "\n"
data: "\n"
 }
 ]
 }
 }
 ]
 }
options: null
instance: Script {...}
 type: "Script"
start: 0
end: 406
context: "default"
content: Program {...}
 type: "Program"
start: 8
end: 397
loc:  {...}
 start:  {...}
 line: 1
column: 0
 }
end:  {...}
 line: 17
column: 0
 }
 }
body: [...] (4)
  ImportDeclaration {...}
 type: "ImportDeclaration"
start: 10
end: 38
loc:  {...}
 start:  {...}
 line: 2
column: 1
 }
end:  {...}
 line: 2
column: 29
 }
 }
specifiers: [...] (1)
  ImportSpecifier {...}
 type: "ImportSpecifier"
start: 18
end: 22
loc:  {...}
 start:  {...}
 line: 2
column: 9
 }
end:  {...}
 line: 2
column: 13
 }
 }
imported: Identifier {...}
 type: "Identifier"
start: 18
end: 22
loc:  {...}
 start:  {...}
 line: 2
column: 9
 }
end:  {...}
 line: 2
column: 13
 }
 }
name: "tick"
 }
local: Identifier {...}
 type: "Identifier"
start: 18
end: 22
loc:  {...}
 start:  {...}
 line: 2
column: 9
 }
end:  {...}
 line: 2
column: 13
 }
 }
name: "tick"
 }
 }
 ]
source: Literal {...}
 type: "Literal"
start: 29
end: 37
loc:  {...}
 start:  {...}
 line: 2
column: 20
 }
end:  {...}
 line: 2
column: 28
 }
 }
value: "svelte"
raw: "\"svelte\""
 }
 }
 VariableDeclaration {...}
 type: "VariableDeclaration"
start: 40
end: 67
loc:  {...}
 start:  {...}
 line: 3
column: 1
 }
end:  {...}
 line: 3
column: 28
 }
 }
declarations: [...] (1)
  VariableDeclarator {...}
 type: "VariableDeclarator"
start: 44
end: 66
loc:  {...}
 start:  {...}
 line: 3
column: 5
 }
end:  {...}
 line: 3
column: 27
 }
 }
id: Identifier {...}
 type: "Identifier"
start: 44
end: 59
loc:  {...}
 start:  {...}
 line: 3
column: 5
 }
end:  {...}
 line: 3
column: 20
 }
 }
name: "isSmallerThan10"
 }
init: Literal {...}
 type: "Literal"
start: 62
end: 66
loc:  {...}
 start:  {...}
 line: 3
column: 23
 }
end:  {...}
 line: 3
column: 27
 }
 }
value: true
raw: "true"
 }
 }
 ]
kind: "let"
 }
 VariableDeclaration {...}
 type: "VariableDeclaration"
start: 69
end: 87
loc:  {...}
 start:  {...}
 line: 4
column: 1
 }
end:  {...}
 line: 4
column: 19
 }
 }
declarations: [...] (1)
  VariableDeclarator {...}
 type: "VariableDeclarator"
start: 73
end: 86
loc:  {...}
 start:  {...}
 line: 4
column: 5
 }
end:  {...}
 line: 4
column: 18
 }
 }
id: Identifier {...}
 type: "Identifier"
start: 73
end: 78
loc:  {...}
 start:  {...}
 line: 4
column: 5
 }
end:  {...}
 line: 4
column: 10
 }
 }
name: "count"
 }
init: ObjectExpression {...}
 type: "ObjectExpression"
start: 81
end: 86
loc:  {...}
 start:  {...}
 line: 4
column: 13
 }
end:  {...}
 line: 4
column: 18
 }
 }
properties: [...] (1)
  Property {...}
 type: "Property"
start: 82
end: 85
loc:  {...}
 start:  {...}
 line: 4
column: 14
 }
end:  {...}
 line: 4
column: 17
 }
 }
method: false
shorthand: false
computed: false
key: Identifier {...}
 type: "Identifier"
start: 82
end: 83
loc:  {...}
 start:  {...}
 line: 4
column: 14
 }
end:  {...}
 line: 4
column: 15
 }
 }
name: "a"
 }
value: Literal {...}
 type: "Literal"
start: 84
end: 85
loc:  {...}
 start:  {...}
 line: 4
column: 16
 }
end:  {...}
 line: 4
column: 17
 }
 }
value: 1
raw: "1"
 }
kind: "init"
 }
 ]
 }
 }
 ]
kind: "let"
 }
 LabeledStatement {...}
 type: "LabeledStatement"
start: 90
end: 396
loc:  {...}
 start:  {...}
 line: 5
column: 2
 }
end:  {...}
 line: 16
column: 4
 }
 }
body: ExpressionStatement {...}
 type: "ExpressionStatement"
start: 93
end: 396
loc:  {...}
 start:  {...}
 line: 5
column: 5
 }
end:  {...}
 line: 16
column: 4
 }
 }
expression: CallExpression {...}
 type: "CallExpression"
start: 93
end: 395
loc:  {...}
 start:  {...}
 line: 5
column: 5
 }
end:  {...}
 line: 16
column: 3
 }
 }
callee: MemberExpression {...}
 type: "MemberExpression"
start: 93
end: 104
loc:  {...}
 start:  {...}
 line: 5
column: 5
 }
end:  {...}
 line: 5
column: 16
 }
 }
object: CallExpression {...}
 type: "CallExpression"
start: 93
end: 99
loc:  {...}
 start:  {...}
 line: 5
column: 5
 }
end:  {...}
 line: 5
column: 11
 }
 }
callee: Identifier {...}
 type: "Identifier"
start: 93
end: 97
loc:  {...}
 start:  {...}
 line: 5
column: 5
 }
end:  {...}
 line: 5
column: 9
 }
 }
name: "tick"
 }
arguments: []
optional: false
 }
property: Identifier {...}
 type: "Identifier"
start: 100
end: 104
loc:  {...}
 start:  {...}
 line: 5
column: 12
 }
end:  {...}
 line: 5
column: 16
 }
 }
name: "then"
 }
computed: false
optional: false
 }
arguments: [...] (1)
  ArrowFunctionExpression {...}
 type: "ArrowFunctionExpression"
start: 105
end: 394
loc:  {...}
 start:  {...}
 line: 5
column: 17
 }
end:  {...}
 line: 16
column: 2
 }
 }
id: null
expression: false
generator: false
async: false
params: []
body: BlockStatement {...}
 type: "BlockStatement"
start: 111
end: 394
loc:  {...}
 start:  {...}
 line: 5
column: 23
 }
end:  {...}
 line: 16
column: 2
 }
 }
body: [...] (1)
  IfStatement {...}
 type: "IfStatement"
start: 116
end: 391
loc:  {...}
 start:  {...}
 line: 6
column: 3
 }
end:  {...}
 line: 15
column: 3
 }
 }
test: MemberExpression {...}
 type: "MemberExpression"
start: 120
end: 127
loc:  {...}
 start:  {...}
 line: 6
column: 7
 }
end:  {...}
 line: 6
column: 14
 }
 }
object: Identifier {...}
 type: "Identifier"
start: 120
end: 125
loc:  {...}
 start:  {...}
 line: 6
column: 7
 }
end:  {...}
 line: 6
column: 12
 }
 }
name: "count"
 }
property: Identifier {...}
 type: "Identifier"
start: 126
end: 127
loc:  {...}
 start:  {...}
 line: 6
column: 13
 }
end:  {...}
 line: 6
column: 14
 }
 }
name: "a"
 }
computed: false
optional: false
 }
consequent: BlockStatement {...}
 type: "BlockStatement"
start: 129
end: 391
loc:  {...}
 start:  {...}
 line: 6
column: 16
 }
end:  {...}
 line: 15
column: 3
 }
 }
body: [...] (1)
  IfStatement {...}
 type: "IfStatement"
start: 134
end: 387
loc:  {...}
 start:  {...}
 line: 7
column: 3
 }
end:  {...}
 line: 14
column: 4
 }
 }
test: BinaryExpression {...}
 type: "BinaryExpression"
start: 138
end: 150
loc:  {...}
 start:  {...}
 line: 7
column: 7
 }
end:  {...}
 line: 7
column: 19
 }
 }
left: MemberExpression {...}
 type: "MemberExpression"
start: 138
end: 145
loc:  {...}
 start:  {...}
 line: 7
column: 7
 }
end:  {...}
 line: 7
column: 14
 }
 }
object: Identifier {...}
 type: "Identifier"
start: 138
end: 143
loc:  {...}
 start:  {...}
 line: 7
column: 7
 }
end:  {...}
 line: 7
column: 12
 }
 }
name: "count"
 }
property: Identifier {...}
 type: "Identifier"
start: 144
end: 145
loc:  {...}
 start:  {...}
 line: 7
column: 13
 }
end:  {...}
 line: 7
column: 14
 }
 }
name: "a"
 }
computed: false
optional: false
 }
operator: "<"
right: Literal {...}
 type: "Literal"
start: 148
end: 150
loc:  {...}
 start:  {...}
 line: 7
column: 17
 }
end:  {...}
 line: 7
column: 19
 }
 }
value: 10
raw: "10"
 }
 }
consequent: BlockStatement {...}
 type: "BlockStatement"
start: 152
end: 308
loc:  {...}
 start:  {...}
 line: 7
column: 21
 }
end:  {...}
 line: 11
column: 4
 }
 }
body: [...] (2)
  ExpressionStatement {...}
 type: "ExpressionStatement"
start: 158
end: 192
loc:  {...}
 start:  {...}
 line: 8
column: 4
 }
end:  {...}
 line: 8
column: 38
 }
 }
expression: CallExpression {...}
 type: "CallExpression"
start: 158
end: 191
loc:  {...}
 start:  {...}
 line: 8
column: 4
 }
end:  {...}
 line: 8
column: 37
 }
 }
callee: MemberExpression {...}
 type: "MemberExpression"
start: 158
end: 171
loc:  {...}
 start:  {...}
 line: 8
column: 4
 }
end:  {...}
 line: 8
column: 17
 }
 }
object: Identifier {...}
 type: "Identifier"
start: 158
end: 165
loc:  {...}
 start:  {...}
 line: 8
column: 4
 }
end:  {...}
 line: 8
column: 11
 }
 }
name: "console"
 }
property: Identifier {...}
 type: "Identifier"
start: 166
end: 171
loc:  {...}
 start:  {...}
 line: 8
column: 12
 }
end:  {...}
 line: 8
column: 17
 }
 }
name: "error"
 }
computed: false
optional: false
 }
arguments: [...] (2)
  Literal {...}
 type: "Literal"
start: 172
end: 181
loc:  {...}
 start:  {...}
 line: 8
column: 18
 }
end:  {...}
 line: 8
column: 27
 }
 }
value: "smaller"
raw: "\"smaller\""
 }
 MemberExpression {...}
 type: "MemberExpression"
start: 183
end: 190
loc:  {...}
 start:  {...}
 line: 8
column: 29
 }
end:  {...}
 line: 8
column: 36
 }
 }
object: Identifier {...}
 type: "Identifier"
start: 183
end: 188
loc:  {...}
 start:  {...}
 line: 8
column: 29
 }
end:  {...}
 line: 8
column: 34
 }
 }
name: "count"
 }
property: Identifier {...}
 type: "Identifier"
start: 189
end: 190
loc:  {...}
 start:  {...}
 line: 8
column: 35
 }
end:  {...}
 line: 8
column: 36
 }
 }
name: "a"
 }
computed: false
optional: false
 }
 ]
optional: false
 }
 }
 ExpressionStatement {...}
 type: "ExpressionStatement"
start: 286
end: 302
loc:  {...}
 start:  {...}
 line: 10
column: 4
 }
end:  {...}
 line: 10
column: 20
 }
 }
expression: AssignmentExpression {...}
 type: "AssignmentExpression"
start: 286
end: 301
loc:  {...}
 start:  {...}
 line: 10
column: 4
 }
end:  {...}
 line: 10
column: 19
 }
 }
operator: "="
left: Identifier {...}
 type: "Identifier"
start: 286
end: 291
loc:  {...}
 start:  {...}
 line: 10
column: 4
 }
end:  {...}
 line: 10
column: 9
 }
 }
name: "count"
 }
right: ObjectExpression {...}
 type: "ObjectExpression"
start: 294
end: 301
loc:  {...}
 start:  {...}
 line: 10
column: 12
 }
end:  {...}
 line: 10
column: 19
 }
 }
properties: [...] (1)
  Property {...}
 type: "Property"
start: 295
end: 300
loc:  {...}
 start:  {...}
 line: 10
column: 13
 }
end:  {...}
 line: 10
column: 18
 }
 }
method: false
shorthand: false
computed: false
key: Identifier {...}
 type: "Identifier"
start: 295
end: 296
loc:  {...}
 start:  {...}
 line: 10
column: 13
 }
end:  {...}
 line: 10
column: 14
 }
 }
name: "a"
 }
value: Literal {...}
 type: "Literal"
start: 298
end: 300
loc:  {...}
 start:  {...}
 line: 10
column: 16
 }
end:  {...}
 line: 10
column: 18
 }
 }
value: 11
raw: "11"
 }
kind: "init"
 }
 ]
 }
 }
leadingComments: [...] (1)
  Line {...}
 type: "Line"
value: " this should trigger this reactive block again and enter the \"else\" but it doesn't"
start: 197
end: 281
 }
 ]
 }
 ]
 }
alternate: BlockStatement {...}
 type: "BlockStatement"
start: 314
end: 387
loc:  {...}
 start:  {...}
 line: 11
column: 10
 }
end:  {...}
 line: 14
column: 4
 }
 }
body: [...] (2)
  ExpressionStatement {...}
 type: "ExpressionStatement"
start: 320
end: 353
loc:  {...}
 start:  {...}
 line: 12
column: 4
 }
end:  {...}
 line: 12
column: 37
 }
 }
expression: CallExpression {...}
 type: "CallExpression"
start: 320
end: 352
loc:  {...}
 start:  {...}
 line: 12
column: 4
 }
end:  {...}
 line: 12
column: 36
 }
 }
callee: MemberExpression {...}
 type: "MemberExpression"
start: 320
end: 333
loc:  {...}
 start:  {...}
 line: 12
column: 4
 }
end:  {...}
 line: 12
column: 17
 }
 }
object: Identifier {...}
 type: "Identifier"
start: 320
end: 327
loc:  {...}
 start:  {...}
 line: 12
column: 4
 }
end:  {...}
 line: 12
column: 11
 }
 }
name: "console"
 }
property: Identifier {...}
 type: "Identifier"
start: 328
end: 333
loc:  {...}
 start:  {...}
 line: 12
column: 12
 }
end:  {...}
 line: 12
column: 17
 }
 }
name: "error"
 }
computed: false
optional: false
 }
arguments: [...] (2)
  Literal {...}
 type: "Literal"
start: 334
end: 342
loc:  {...}
 start:  {...}
 line: 12
column: 18
 }
end:  {...}
 line: 12
column: 26
 }
 }
value: "larger"
raw: "\"larger\""
 }
 MemberExpression {...}
 type: "MemberExpression"
start: 344
end: 351
loc:  {...}
 start:  {...}
 line: 12
column: 28
 }
end:  {...}
 line: 12
column: 35
 }
 }
object: Identifier {...}
 type: "Identifier"
start: 344
end: 349
loc:  {...}
 start:  {...}
 line: 12
column: 28
 }
end:  {...}
 line: 12
column: 33
 }
 }
name: "count"
 }
property: Identifier {...}
 type: "Identifier"
start: 350
end: 351
loc:  {...}
 start:  {...}
 line: 12
column: 34
 }
end:  {...}
 line: 12
column: 35
 }
 }
name: "a"
 }
computed: false
optional: false
 }
 ]
optional: false
 }
 }
 ExpressionStatement {...}
 type: "ExpressionStatement"
start: 358
end: 382
loc:  {...}
 start:  {...}
 line: 13
column: 4
 }
end:  {...}
 line: 13
column: 28
 }
 }
expression: AssignmentExpression {...}
 type: "AssignmentExpression"
start: 358
end: 381
loc:  {...}
 start:  {...}
 line: 13
column: 4
 }
end:  {...}
 line: 13
column: 27
 }
 }
operator: "="
left: Identifier {...}
 type: "Identifier"
start: 358
end: 373
loc:  {...}
 start:  {...}
 line: 13
column: 4
 }
end:  {...}
 line: 13
column: 19
 }
 }
name: "isSmallerThan10"
 }
right: Literal {...}
 type: "Literal"
start: 376
end: 381
loc:  {...}
 start:  {...}
 line: 13
column: 22
 }
end:  {...}
 line: 13
column: 27
 }
 }
value: false
raw: "false"
 }
 }
 }
 ]
 }
 }
 ]
 }
alternate: null
 }
 ]
 }
 }
 ]
optional: false
 }
 }
label: Identifier {...}
 type: "Identifier"
start: 90
end: 91
loc:  {...}
 start:  {...}
 line: 5
column: 2
 }
end:  {...}
 line: 5
column: 3
 }
 }
name: "$"
 }
 }
 ]
sourceType: "module"
 }
attributes: []
 }
 }
The AST is not public API and may change at any point in time
modern