diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js index 55dd4b4739..e7a4f6059b 100644 --- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js +++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js @@ -355,6 +355,7 @@ export function validate_binding(state, binding, expression) { b.call( '$.validate_binding', b.literal(state.analysis.source.slice(binding.start, binding.end)), + binding.metadata.expression.blockers(), b.thunk( state.store_to_invalidate ? b.sequence([b.call('$.mark_store_binding'), obj]) : obj ), diff --git a/packages/svelte/src/internal/client/validate.js b/packages/svelte/src/internal/client/validate.js index ec3d805447..0daecdb480 100644 --- a/packages/svelte/src/internal/client/validate.js +++ b/packages/svelte/src/internal/client/validate.js @@ -5,6 +5,7 @@ import { FILENAME } from '../../constants.js'; import { render_effect } from './reactivity/effects.js'; import * as w from './warnings.js'; import { capture_store_binding } from './reactivity/store.js'; +import { run_after_blockers } from './reactivity/async.js'; /** * @param {() => any} collection @@ -40,44 +41,47 @@ export function validate_each_keys(collection, key_fn) { /** * @param {string} binding + * @param {Array>} blockers * @param {() => Record} get_object * @param {() => string} get_property * @param {number} line * @param {number} column */ -export function validate_binding(binding, get_object, get_property, line, column) { - var warned = false; +export function validate_binding(binding, blockers, get_object, get_property, line, column) { + run_after_blockers(blockers, () => { + var warned = false; - var filename = dev_current_component_function?.[FILENAME]; + var filename = dev_current_component_function?.[FILENAME]; - render_effect(() => { - if (warned) return; + render_effect(() => { + if (warned) return; - var [object, is_store_sub] = capture_store_binding(get_object); + var [object, is_store_sub] = capture_store_binding(get_object); - if (is_store_sub) return; + if (is_store_sub) return; - var property = get_property(); + var property = get_property(); - var ran = false; + var ran = false; - // by making the (possibly false, but it would be an extreme edge case) assumption - // that a getter has a corresponding setter, we can determine if a property is - // reactive by seeing if this effect has dependencies - var effect = render_effect(() => { - if (ran) return; + // by making the (possibly false, but it would be an extreme edge case) assumption + // that a getter has a corresponding setter, we can determine if a property is + // reactive by seeing if this effect has dependencies + var effect = render_effect(() => { + if (ran) return; - // eslint-disable-next-line @typescript-eslint/no-unused-expressions - object[property]; - }); + // eslint-disable-next-line @typescript-eslint/no-unused-expressions + object[property]; + }); - ran = true; + ran = true; - if (effect.deps === null) { - var location = `${filename}:${line}:${column}`; - w.binding_property_non_reactive(binding, location); + if (effect.deps === null) { + var location = `${filename}:${line}:${column}`; + w.binding_property_non_reactive(binding, location); - warned = true; - } + warned = true; + } + }); }); }