learn.svelte.dev

learn.svelte.dev copied to clipboard

Describe the bug

Variables do not update and no reactivity-related feature works, on ios safari with software version 12.5.7.

By not working I mean nothing changes when the variables are supposed to update.

Reproduction

https://git.sr.ht/~liliace/reactive-example

This is a skeleton project from running pnpm create svelte@latest and copying the code from https://learn.svelte.dev/tutorial/reactive-assignments into src/routes/+page.svelte.

I believe it is an issue with the reactivty part and not the on:click (or at least not just on:click) because using a setInterval to update the variable also works on firefox but not on safari. My other projects using other reactivity code like input binding also have the same issue.

Logs

Unfortunately there are no error logs on mobile safari

System Info

Unfortunately cannot run this on ipod. Below is the system info hosting the local dev server:

  System:
    OS: Linux 6.8 Alpine Linux
    CPU: (12) x64 13th Gen Intel(R) Core(TM) i7-1355U
    Memory: 10.69 GB / 15.31 GB
    Container: Yes
    Shell: 5.2.26 - /bin/bash
  Binaries:
    Node: 21.7.2 - /usr/bin/node
    npm: 10.5.1 - /usr/bin/npm
    pnpm: 8.15.6 - /usr/bin/pnpm
  npmPackages:
    svelte: ^4.2.7 => 4.2.12

It is a gen 6 ipod, with software version 12.5.7, running safari.

Severity

blocking all usage of svelte

This may be difficult to reproduce and work on due to the hardware requirement. Although I probably can't contribute much on the code because of my lack of understanding of the internal code and browser differences, I can help test different changes and report the behaviour if anyone has some guesses or starting directions.

maybe u can record a video

I see that the issue is transferred from sveltejs/svelte to sveltejs/learn.svelte.dev. I'd like to clarify that although I linked the tutorial as the reproduction, this issue exists on local builds too, with any code that uses reactivity.

maybe u can record a video

Below is a screen recording of the behaviour on ipod. The button flashing is when I clicked on the button:

https://github.com/sveltejs/learn.svelte.dev/assets/38874004/6dff26ce-2403-43a7-b28d-8149b41ced65

The code for the local host is the same as the tutorial example:

<script>
	let count = 0;

	function increment() {
		count += 1;
	}
</script>

<button on:click={increment}>
	Clicked {count}
	{count === 1 ? 'time' : 'times'}
</button>

Should this issue be transferred back to sveltejs/svelte? I may have caused some confusion by linking the tutorial example as the reproduction code. The issue I mean to report is about the framework itself, causing all svelte projects with reactivity to behave unexpectedly.

I have updated the reproduction link to a custom repository to make it more clear.

Closing this and re-opning at https://github.com/sveltejs/svelte/issues/11869.