x64Bits / solid-icons

The simplest way to use icons in SolidJS
https://solid-icons.vercel.app
MIT License
284 stars 18 forks source link

SolidJS v1.8.1 Hydration error #56

Closed elijah629 closed 8 months ago

elijah629 commented 8 months ago

I recently updated to solid-js@1.8.1, but on every icon I have in my app, I get two nasty hydration errors on the client.

Error: Failed attempt to create new DOM elements during hydration. Check that the libraries you are using support hydration.
    at create (dev.js:571:13)
    at dev.js:579:63
    at untrack (dev.js:495:33)
    at Function.cloneNode (dev.js:579:13)
    at index.js:11:25
    at IconTemplate (index.js:50:3)
    at TbBrandGithub (index.js:4347:14)
    at dev.js:616:16
    at untrack (dev.js:499:12)
    at Object.fn (dev.js:612:7)
dev.js:735 Uncaught Error: Hydration Mismatch. Unable to find DOM nodes for hydration key: 1-0-0
    at getNextElement (dev.js:735:13)
    at ErrorBoundary.tsx:32:3
    at ErrorMessage (ErrorBoundary.tsx:59:79)
    at dev.js:616:16
    at untrack (dev.js:499:12)
    at Object.fn (dev.js:612:7)
    at runComputation (dev.js:777:22)
    at updateComputation (dev.js:756:3)
    at devComponent (dev.js:627:3)
    at createComponent (dev.js:1374:17) 

The TbBrandGithub in the first error message gets replaced by whatever icon I used in my app. Please fix this so I can update to the latest SolidJS version

elijah629 commented 8 months ago

Related to #55 and https://github.com/solidjs/solid/issues/1911

x64Bits commented 8 months ago

Hi @elijah629, i'm addressing this problem but I'm not able to reproduce it, could you create a small example of how this happens? i already try static, start and astro and it works without problems solid-icons@1.1.0-beta.2 and solid-js@1.8.1

elijah629 commented 8 months ago

I will make a reproduction 1 sec

elijah629 commented 8 months ago

I have made a repo

elijah629 commented 8 months ago

Install packages, npm run dev, open url, and check console. this error should be there. if there was more to the app, it would have no interactivity

x64Bits commented 8 months ago

Thank you infinitely! was able to help me determine what was going on, I'm submitting another version as a beta, It seems to me that this was one of the last problems that was happening after solid released 1.8.0, I think that today I can send 1.1.0 with all the changes and improvements.

x64Bits commented 8 months ago

Here a stackblitz with you repo working: https://stackblitz.com/edit/github-dmdtpc

x64Bits commented 8 months ago

I will assume that it is resolved with the latest update, greetings and thank you very much.