$state() does not update when Set changes (Set.add / Set.delete)

[therealPaulPlay]

Describe the bug

Previously with Svelte 4, a let variable could be a Set and still be reactive, it was just necessary to re-assign its value. Now in Svelte 5, that does not work anymore.

Reproduction

here is a minimal example:

<script>
	// Create a reactive variable using a Set
	let setVariable = $state(new Set());

	// Interval to add to the set every 2 seconds
	let counter = 0;
	
	setInterval(() => {
		counter++;
		setVariable.add("hello" + counter);
		console.log(setVariable); // Log the set contents to see changes

		setVariable = setVariable; // Even this does not make it reactive
	}, 2000);
</script>

<h1>Hello {setVariable.size}!</h1>
<p>Check the console to see the contents of the set!</p>

The DOM does not update at all, even when I reassign the value. This worked in Svelte 4.

Logs

The logs show that the Set itself updates.

System Info

Firefox

Severity

blocking an upgrade

[leonidaz]

You can use the new reactive SvelteSet

Playground example for a SvelteSet

<script>
	import { SvelteSet } from 'svelte/reactivity';
	
	// Create a reactive variable using a reactive SvelteSet
	let setVariable = new SvelteSet(); 

	// Interval to add to the set every second
	let counter = 0;
	
	setInterval(() => {
		counter++;
		setVariable.add("hello" + counter);
		console.log(setVariable); // Log the set contents to see changes
	}, 1000);
</script>

<h1>Hello {setVariable.size}!</h1>

[therealPaulPlay]

Thank you, I see! Not a bug then, would be awesome if there was a compiler message or a hint from the Svelte Extension that mentions this, whenever it's used for a reactive variable, though :-)

[trueadm]

@therealPaulPlay This has come up before. We don't want to provide a warning/error for this because there are also genuine cases where you might want a Map/Set to be in state, but not be reactive.

[therealPaulPlay]

Alright, closing then.

[eventualbuddha]

@therealPaulPlay This has come up before. We don't want to provide a warning/error for this because there are also genuine cases where you might want a Map/Set to be in state, but not be reactive.

I wanted to let you know that this took a while for me to figure out. I assumed I was doing something else wrong since I don't know Svelte & runes very well. This being the way it is was unexpected to me because Array is reactive without opting in specifically. I'm guessing this option was already discussed as well, but maybe a better default would be that Set and Map are reactive but you can import versions that are not?