Skip to content

Commit 16f502a

Browse files
committedJan 15, 2025·

File tree

12 files changed

+69
-41
lines changed

12 files changed

+69
-41
lines changed
 

Diff for: ‎packages/svelte/src/internal/client/dom/blocks/await.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import {
1313
set_dev_current_component_function
1414
} from '../../runtime.js';
1515
import { hydrate_next, hydrate_node, hydrating } from '../hydration.js';
16-
import { queue_micro_task } from '../task.js';
16+
import { queue_after_micro_task } from '../task.js';
1717
import { UNINITIALIZED } from '../../../../constants.js';
1818

1919
const PENDING = 0;
@@ -148,7 +148,7 @@ export function await_block(node, get_input, pending_fn, then_fn, catch_fn) {
148148
} else {
149149
// Wait a microtask before checking if we should show the pending state as
150150
// the promise might have resolved by the next microtask.
151-
queue_micro_task(() => {
151+
queue_after_micro_task(() => {
152152
if (!resolved) update(PENDING, true);
153153
});
154154
}

Diff for: ‎packages/svelte/src/internal/client/dom/blocks/boundary.js

+4-4
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ import {
2727
set_hydrate_node
2828
} from '../hydration.js';
2929
import { get_next_sibling } from '../operations.js';
30-
import { queue_micro_task } from '../task.js';
30+
import { queue_before_micro_task } from '../task.js';
3131

3232
const SUSPEND_INCREMENT = Symbol();
3333
const SUSPEND_DECREMENT = Symbol();
@@ -107,7 +107,7 @@ export function boundary(node, props, boundary_fn) {
107107
}
108108

109109
if (suspend_count++ === 0) {
110-
queue_micro_task(() => {
110+
queue_before_micro_task(() => {
111111
if (suspended_effect) {
112112
return;
113113
}
@@ -151,7 +151,7 @@ export function boundary(node, props, boundary_fn) {
151151
}
152152

153153
if (--suspend_count === 0) {
154-
queue_micro_task(() => {
154+
queue_before_micro_task(() => {
155155
if (!suspended_effect) {
156156
return;
157157
}
@@ -199,7 +199,7 @@ export function boundary(node, props, boundary_fn) {
199199
}
200200

201201
if (failed) {
202-
queue_micro_task(() => {
202+
queue_before_micro_task(() => {
203203
render_snippet(() => {
204204
failed(
205205
anchor,

Diff for: ‎packages/svelte/src/internal/client/dom/blocks/each.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ import {
3434
import { source, mutable_source, internal_set } from '../../reactivity/sources.js';
3535
import { array_from, is_array } from '../../../shared/utils.js';
3636
import { INERT } from '../../constants.js';
37-
import { queue_micro_task } from '../task.js';
37+
import { queue_after_micro_task } from '../task.js';
3838
import { active_effect, active_reaction, get } from '../../runtime.js';
3939
import { DEV } from 'esm-env';
4040
import { derived_safe_equal } from '../../reactivity/deriveds.js';
@@ -470,7 +470,7 @@ function reconcile(array, state, anchor, render_fn, flags, is_inert, get_key, ge
470470
}
471471

472472
if (is_animated) {
473-
queue_micro_task(() => {
473+
queue_after_micro_task(() => {
474474
if (to_animate === undefined) return;
475475
for (item of to_animate) {
476476
item.a?.apply();

Diff for: ‎packages/svelte/src/internal/client/dom/css.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
import { DEV } from 'esm-env';
2-
import { queue_micro_task } from './task.js';
2+
import { queue_after_micro_task } from './task.js';
33
import { register_style } from '../dev/css.js';
44

55
/**
66
* @param {Node} anchor
77
* @param {{ hash: string, code: string }} css
88
*/
99
export function append_styles(anchor, css) {
10-
// Use `queue_micro_task` to ensure `anchor` is in the DOM, otherwise getRootNode() will yield wrong results
11-
queue_micro_task(() => {
10+
// Use `queue_after_micro_task` to ensure `anchor` is in the DOM, otherwise getRootNode() will yield wrong results
11+
queue_after_micro_task(() => {
1212
var root = anchor.getRootNode();
1313

1414
var target = /** @type {ShadowRoot} */ (root).host

Diff for: ‎packages/svelte/src/internal/client/dom/elements/bindings/input.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { render_effect, teardown } from '../../../reactivity/effects.js';
33
import { listen_to_event_and_reset_event } from './shared.js';
44
import * as e from '../../../errors.js';
55
import { is } from '../../../proxy.js';
6-
import { queue_micro_task } from '../../task.js';
6+
import { queue_after_micro_task } from '../../task.js';
77
import { hydrating } from '../../hydration.js';
88
import { is_runes, untrack } from '../../../runtime.js';
99

@@ -158,14 +158,14 @@ export function bind_group(inputs, group_index, input, get, set = get) {
158158
if (!pending.has(binding_group)) {
159159
pending.add(binding_group);
160160

161-
queue_micro_task(() => {
161+
queue_after_micro_task(() => {
162162
// necessary to maintain binding group order in all insertion scenarios
163163
binding_group.sort((a, b) => (a.compareDocumentPosition(b) === 4 ? -1 : 1));
164164
pending.delete(binding_group);
165165
});
166166
}
167167

168-
queue_micro_task(() => {
168+
queue_after_micro_task(() => {
169169
if (hydration_mismatch) {
170170
var value;
171171

Diff for: ‎packages/svelte/src/internal/client/dom/elements/bindings/this.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { STATE_SYMBOL } from '../../../constants.js';
22
import { effect, render_effect } from '../../../reactivity/effects.js';
33
import { untrack } from '../../../runtime.js';
4-
import { queue_micro_task } from '../../task.js';
4+
import { queue_after_micro_task } from '../../task.js';
55

66
/**
77
* @param {any} bound_value
@@ -49,7 +49,7 @@ export function bind_this(element_or_component = {}, update, get_value, get_part
4949

5050
return () => {
5151
// We cannot use effects in the teardown phase, we we use a microtask instead.
52-
queue_micro_task(() => {
52+
queue_after_micro_task(() => {
5353
if (parts && is_bound_this(get_value(...parts), element_or_component)) {
5454
update(null, ...parts);
5555
}

Diff for: ‎packages/svelte/src/internal/client/dom/elements/events.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
import { teardown } from '../../reactivity/effects.js';
33
import { define_property, is_array } from '../../../shared/utils.js';
44
import { hydrating } from '../hydration.js';
5-
import { queue_micro_task } from '../task.js';
5+
import { queue_after_micro_task } from '../task.js';
66
import { FILENAME } from '../../../../constants.js';
77
import * as w from '../../warnings.js';
88
import {
@@ -77,7 +77,7 @@ export function create_event(event_name, dom, handler, options) {
7777
event_name.startsWith('touch') ||
7878
event_name === 'wheel'
7979
) {
80-
queue_micro_task(() => {
80+
queue_after_micro_task(() => {
8181
dom.addEventListener(event_name, target_handler, options);
8282
});
8383
} else {

Diff for: ‎packages/svelte/src/internal/client/dom/elements/misc.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { hydrating } from '../hydration.js';
22
import { clear_text_content, get_first_child } from '../operations.js';
3-
import { queue_micro_task } from '../task.js';
3+
import { queue_after_micro_task } from '../task.js';
44

55
/**
66
* @param {HTMLElement} dom
@@ -12,7 +12,7 @@ export function autofocus(dom, value) {
1212
const body = document.body;
1313
dom.autofocus = true;
1414

15-
queue_micro_task(() => {
15+
queue_after_micro_task(() => {
1616
if (document.activeElement === body) {
1717
dom.focus();
1818
}

Diff for: ‎packages/svelte/src/internal/client/dom/elements/transitions.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import { should_intro } from '../../render.js';
1313
import { current_each_item } from '../blocks/each.js';
1414
import { TRANSITION_GLOBAL, TRANSITION_IN, TRANSITION_OUT } from '../../../../constants.js';
1515
import { BLOCK_EFFECT, EFFECT_RAN, EFFECT_TRANSPARENT } from '../../constants.js';
16-
import { queue_micro_task } from '../task.js';
16+
import { queue_after_micro_task } from '../task.js';
1717

1818
/**
1919
* @param {Element} element
@@ -326,7 +326,7 @@ function animate(element, options, counterpart, t2, on_finish) {
326326
var a;
327327
var aborted = false;
328328

329-
queue_micro_task(() => {
329+
queue_after_micro_task(() => {
330330
if (aborted) return;
331331
var o = options({ direction: is_intro ? 'in' : 'out' });
332332
a = animate(element, o, counterpart, t2, on_finish);

Diff for: ‎packages/svelte/src/internal/client/dom/task.js

+38-12
Original file line numberDiff line numberDiff line change
@@ -10,33 +10,59 @@ let is_micro_task_queued = false;
1010
let is_idle_task_queued = false;
1111

1212
/** @type {Array<() => void>} */
13-
let current_queued_micro_tasks = [];
13+
let queued_before_microtasks = [];
1414
/** @type {Array<() => void>} */
15-
let current_queued_idle_tasks = [];
15+
let queued_after_microtasks = [];
16+
/** @type {Array<() => void>} */
17+
let queued_idle_tasks = [];
1618

17-
function process_micro_tasks() {
18-
is_micro_task_queued = false;
19-
const tasks = current_queued_micro_tasks.slice();
20-
current_queued_micro_tasks = [];
19+
export function flush_before_micro_tasks() {
20+
const tasks = queued_before_microtasks.slice();
21+
queued_before_microtasks = [];
22+
run_all(tasks);
23+
}
24+
25+
function flush_after_micro_tasks() {
26+
const tasks = queued_after_microtasks.slice();
27+
queued_after_microtasks = [];
2128
run_all(tasks);
2229
}
2330

31+
function process_micro_tasks() {
32+
if (is_micro_task_queued) {
33+
is_micro_task_queued = false;
34+
flush_before_micro_tasks();
35+
flush_after_micro_tasks();
36+
}
37+
}
38+
2439
function process_idle_tasks() {
2540
is_idle_task_queued = false;
26-
const tasks = current_queued_idle_tasks.slice();
27-
current_queued_idle_tasks = [];
41+
const tasks = queued_idle_tasks.slice();
42+
queued_idle_tasks = [];
2843
run_all(tasks);
2944
}
3045

3146
/**
3247
* @param {() => void} fn
3348
*/
34-
export function queue_micro_task(fn) {
49+
export function queue_before_micro_task(fn) {
50+
if (!is_micro_task_queued) {
51+
is_micro_task_queued = true;
52+
queueMicrotask(process_micro_tasks);
53+
}
54+
queued_before_microtasks.push(fn);
55+
}
56+
57+
/**
58+
* @param {() => void} fn
59+
*/
60+
export function queue_after_micro_task(fn) {
3561
if (!is_micro_task_queued) {
3662
is_micro_task_queued = true;
3763
queueMicrotask(process_micro_tasks);
3864
}
39-
current_queued_micro_tasks.push(fn);
65+
queued_after_microtasks.push(fn);
4066
}
4167

4268
/**
@@ -47,13 +73,13 @@ export function queue_idle_task(fn) {
4773
is_idle_task_queued = true;
4874
request_idle_callback(process_idle_tasks);
4975
}
50-
current_queued_idle_tasks.push(fn);
76+
queued_idle_tasks.push(fn);
5177
}
5278

5379
/**
5480
* Synchronously run any queued tasks.
5581
*/
56-
export function flush_tasks() {
82+
export function flush_after_tasks() {
5783
if (is_micro_task_queued) {
5884
process_micro_tasks();
5985
}

Diff for: ‎packages/svelte/src/internal/client/runtime.js

+7-5
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ import {
2727
DISCONNECTED,
2828
BOUNDARY_EFFECT
2929
} from './constants.js';
30-
import { flush_tasks } from './dom/task.js';
30+
import { flush_after_tasks, flush_before_micro_tasks } from './dom/task.js';
3131
import { add_owner } from './dev/ownership.js';
3232
import { internal_set, set, source } from './reactivity/sources.js';
3333
import { destroy_derived, execute_derived, update_derived } from './reactivity/deriveds.js';
@@ -737,11 +737,12 @@ function flush_queued_effects(effects) {
737737
}
738738
}
739739

740-
function process_deferred() {
740+
function flushed_deferred() {
741741
is_micro_task_queued = false;
742742
if (flush_count > 1001) {
743743
return;
744744
}
745+
// flush_before_process_microtasks();
745746
const previous_queued_root_effects = queued_root_effects;
746747
queued_root_effects = [];
747748
flush_queued_root_effects(previous_queued_root_effects);
@@ -763,7 +764,7 @@ export function schedule_effect(signal) {
763764
if (scheduler_mode === FLUSH_MICROTASK) {
764765
if (!is_micro_task_queued) {
765766
is_micro_task_queued = true;
766-
queueMicrotask(process_deferred);
767+
queueMicrotask(flushed_deferred);
767768
}
768769
}
769770

@@ -776,7 +777,7 @@ export function schedule_effect(signal) {
776777
var flags = effect.f;
777778

778779
if ((flags & (ROOT_EFFECT | BRANCH_EFFECT)) !== 0) {
779-
if ((flags & CLEAN) === 0) return
780+
if ((flags & CLEAN) === 0) return;
780781
effect.f ^= CLEAN;
781782
}
782783
}
@@ -878,11 +879,12 @@ export function flush_sync(fn) {
878879
queued_root_effects = root_effects;
879880
is_micro_task_queued = false;
880881

882+
flush_before_micro_tasks();
881883
flush_queued_root_effects(previous_queued_root_effects);
882884

883885
var result = fn?.();
884886

885-
flush_tasks();
887+
flush_after_tasks();
886888
if (queued_root_effects.length > 0 || root_effects.length > 0) {
887889
flush_sync();
888890
}

Diff for: ‎packages/svelte/tests/animation-helpers.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { flushSync } from 'svelte';
22
import { raf as svelte_raf } from 'svelte/internal/client';
3-
import { queue_micro_task } from '../src/internal/client/dom/task.js';
3+
import { queue_after_micro_task } from '../src/internal/client/dom/task.js';
44

55
export const raf = {
66
animations: new Set(),
@@ -132,7 +132,7 @@ class Animation {
132132
/** @param {() => {}} fn */
133133
set onfinish(fn) {
134134
if (this.#duration === 0) {
135-
queue_micro_task(fn);
135+
queue_after_micro_task(fn);
136136
} else {
137137
this.#onfinish = () => {
138138
fn();

0 commit comments

Comments
 (0)
Please sign in to comment.