tick() doesn't seem to work

[FirstProphet]

Describe the bug

The code below is supposed to change the clientHeight of the div when the button is pressed and then console.log the original and the new height. According to the svelte documentation, you can "use tick to ensure that the UI is updated before continuing". But it doesn't work and still console.logs the original height. If you replace the tick function call in line 14 with my crude customTick function, it seems to work fine.

Reproduction

<script>
	import { tick } from 'svelte';
	const contents = ['Hello World', 'Hello<br />World'];
	let currentContent = $state(0);
	let clientHeight = $state();

	function customTick() {
		return new Promise((resolve, reject) => setTimeout(resolve, 1));
	}
	
	function changeContent() {
		console.log(`Client Height Before Change: ${clientHeight}px`);
		currentContent = (currentContent + 1) % 2;
		tick().then(() => console.log(`Client Height After Change: ${clientHeight}px`)); // Doesn't work
	}
</script>

<button onclick={changeContent}>Change Content</button>
<br /><br />
<div bind:clientHeight style="border: 1px solid red;">{@html contents[currentContent]}</div>

Svelte Playground

Logs

No response

System Info

I used the playground on svelte.dev

Severity

annoyance