fix: address bug in before/after update

fix: address bug in before/after update
pull/9448/head
Dominic Gannaway 3 years ago
parent cf63220a0e
commit ffa28666f6

@ -963,7 +963,11 @@ export function set_signal_value(signal, value) {
// If we have afterUpdates locally on the component, but we're within a render effect
// then we will need to manually invoke the beforeUpdate/afterUpdate logic.
// TODO: should we put this being a is_runes check and only run it in non-runes mode?
if (current_effect === null && current_queued_pre_and_render_effects.length === 0) {
if (
current_effect === null &&
current_queued_pre_and_render_effects.filter((e) => e.context === component_context)
.length === 0
) {
const update_callbacks = component_context?.update_callbacks;
if (update_callbacks != null) {
update_callbacks.before.forEach(/** @param {any} c */ (c) => c());

@ -0,0 +1,7 @@
<script>
const {count, increment} = $props();
</script>
<button onclick={increment}>
{count}
</button>

@ -0,0 +1,15 @@
import { flushSync } from 'svelte';
import { test } from '../../test';
export default test({
html: '<button>0</button>',
async test({ assert, target, component }) {
const [btn] = target.querySelectorAll('button');
flushSync(() => {
btn.click();
});
assert.deepEqual(component.log, ['beforeUpdate', 'afterUpdate']);
assert.htmlEqual(target.innerHTML, `<button>1</button>`);
}
});

@ -0,0 +1,22 @@
<script>
import Child from './Child.svelte'
import {afterUpdate, beforeUpdate} from 'svelte';
const {log = []} = $props();
let count = $state(0);
const increment = () => {
count++;
}
beforeUpdate(() => {
log.push('beforeUpdate');
});
afterUpdate(() => {
log.push('afterUpdate');
});
</script>
<Child count={count} increment={increment} />
Loading…
Cancel
Save