mirror of https://github.com/sveltejs/svelte
fix: ensure effect_tracking correctly handles tracking reactions (#14005)
* fix: ensure effect_tracking correctly handles tracking reactions * fix: ensure effect_tracking correctly handles tracking reactionspull/14015/head
parent
777d059b10
commit
3876b302f3
@ -0,0 +1,5 @@
|
||||
---
|
||||
'svelte': patch
|
||||
---
|
||||
|
||||
fix: ensure effect_tracking correctly handles tracking reactions
|
@ -0,0 +1,19 @@
|
||||
import { flushSync } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
async test({ assert, target, logs }) {
|
||||
let btn1 = target.querySelector('button');
|
||||
|
||||
btn1?.click();
|
||||
flushSync();
|
||||
|
||||
btn1?.click();
|
||||
flushSync();
|
||||
|
||||
btn1?.click();
|
||||
flushSync();
|
||||
|
||||
assert.deepEqual(logs, ['light', 'dark', 'light']);
|
||||
}
|
||||
});
|
@ -0,0 +1,13 @@
|
||||
<script>
|
||||
import { store, themeState } from './theme.svelte.js';
|
||||
|
||||
let i = 0;
|
||||
|
||||
const increment = () => {
|
||||
store.update(() => ({ theme: ++i % 2 == 0 ? 'dark' : 'light' }));
|
||||
}
|
||||
</script>
|
||||
|
||||
<button onclick={increment}>+</button>
|
||||
|
||||
{themeState.value.theme}
|
@ -0,0 +1,18 @@
|
||||
import { fromStore, writable } from 'svelte/store';
|
||||
|
||||
export const store = writable({ theme: 'dark' });
|
||||
|
||||
class ThemeState {
|
||||
#storeState = fromStore(store);
|
||||
value = $derived(this.#storeState.current);
|
||||
|
||||
constructor() {
|
||||
$effect.root(() => {
|
||||
$effect(() => {
|
||||
console.log(this.value.theme);
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export const themeState = new ThemeState();
|
Loading…
Reference in new issue