Hi, I am getting a hydration error and I am hella confused on why. I dont see any incorrect tsx here
I am trying to make a table but for some reason im getting a hydration error on this one page
15 Replies
You're just hard coding these timestamps for now, right?
03:04:05 GMT
I'm assuming you are since this isn't html output this is actual source code
I don't see anything that immediately jumps out at me. You're not doing any kinda render null
on the server, render ...
on the client type stuff
is this whole Links
component conditionally rendered?i had an issue yesterday where if you're improperly nesting html tags it will yell at you about hydration
for example, i think i accidentally put a div inside of a p tag
not sure if that's what youre doing, but that caused me like 1hr of debugging yesterday in case it helps
oh lol
i didn't know about that one
that's good to be aware of
Its just a [;ace holder fot the time being
im just templating the frontend before I put in any business logic
No its the page actually
WHich is why im hella confused
I dont see anything wrong here
After having coffee I found the problem
Apparently you cannot put a div in a taable footer
good to know
Does anyone know why? Seems very odd
only found it after digging through console sadly next didnt print out the error
I am not sure
It seems logical enough for it to be able to get put in the table footer it still rendered it on the page is just that next did not like it at all
huh
tried a quick google / github search and can't find where validateDOMNesting is defined to see what the source is doing
does it work if you nest the div inside a
<tr>
?
so
<tfoot><tr><div> ... </div></tr></tfoot>
Oh let me see
Wasnt thinking of that because before I just added a button or somthing to the table footer never tried a div
Doesnt work
maybe tr and then td ?
^ That worked hmm
Yeah that idea came from looking at the spec for table elements
I’ve honestly never written a table so I don’t know anything about them
But the spec mentioned that the footer of a table is expected to contain rows
And if rows need
td
then that makes senseOh ok did not know that but it makes sense why it would
For reference
https://html.spec.whatwg.org/multipage/tables.html#the-tfoot-element
This is what led me down that path