solid
solid copied to clipboard
[SSR/Astro] DOM Not Updated from State by Client Updates onMount
Describe the bug
When SSRing with state and that state is updated on the client immediately/onMount, the new value is not reflected in the DOM.
Your Example Website or App
https://stackblitz.com/~/github.com/NexRX/astro-solid-nanostore
Steps to Reproduce the Bug or Issue
Using my example which demos a simple theme toggle defaulting to 'dark' mode...
- Click the toggle to change the state to 'light' mode.
- Reload the page
- Observe page reflects 'light' mode (because store subscriber is changing this) but controls show the 'dark' mode. a. Press the button to console log state which shows store actually holds 'light'
Expected behavior
When the client takes over after SSR the DOM reflect the updated state from onMount
Screenshots or Videos
Platform
- OS: Windows 11
- Browser: Chrome
- Version: 124
Additional context
- You can afterward toggle it a couple times which fixes the issues only after.
- When rendering with astro using
client:onlythe problem goes away (but not ideal) - The nanostore-persistant uses nanostore's version of onMount but I did fork and try using solid-js's onMount to the same effect