Hydration failed because the server rendered HTML didn't match the client.
publié le , mis à jourError de next.js sur http://localhost:8080 (local dev), sur master
## Error Type
Recoverable Error
## Error Message
Hydration failed because the server rendered HTML didn't match the client. As a result this tree will be regenerated on the client. This can happen if a SSR-ed Client Component used:
- A server/client branch `if (typeof window !== 'undefined')`.
- Variable input such as `Date.now()` or `Math.random()` which changes each time it's called.
- Date formatting in a user's locale which doesn't match the server.
- External changing data without sending a snapshot of it along with the HTML.
- Invalid HTML tag nesting.
It can also happen if the client has a browser extension installed which messes with the HTML before React loaded.
https://react.dev/link/hydration-mismatch
...
<div className={"react-mo..."} style={{zIndex:2, ...}} ref={function useMotionRef.useCallback}>
<SheetHeader>
<SheetContent disableDrag={false}>
<motion.div ref={function} className={"react-mo..."} style={{flexGrow:1, ...}} drag="y" dragElastic={0} ...>
<MeasureLayout>
<div className={"react-mo..."} draggable={false} style={{flexGrow:1, ...}} ...>
<SheetScroller draggableAt="both" snap={2}>
<div ref={null} className={"react-mo..."} style={{height:"100%", ...}}>
<SheetContentWrapper>
<div className="ModalSheet..." style={{}}>
<Content visibleLog={[...]} setVisibleLog={function bound dispatchSetState} ...>
<ContentWrapper>
<section className="ContentUI_..." style={{}}>
<section>
<PlaceSearch>
<QuickBookmarks oldAllez={undefined} searchInput={undefined} locale="en" depuis={[...]}>
<Section>
+ <section className="QuickBookmarks_Section_aB1xZ6" style={{}}>
...
at section (unknown:0:0)
at QuickBookmarks (app/QuickBookmarks.tsx:61:48)
at Content (app/Content.tsx:304:8)
at ModalSheet (app/ModalSheet.tsx:116:9)
at ModalSwitch (app/ModalSwitch.tsx:27:9)
at Container (app/Container.tsx:394:5)
at Page (about://React/Server/file:///home/severo/_dev/cartes/web/.next/dev/server/chunks/ssr/%5Broot-of-the-server%5D__10ahqjz._.js?13:6248:285)
## Code Frame
59 | font-size: 80%;
60 | margin-left: 0.3rem;
> 61 | `}
| ^
62 | onClick={() => setTutorials({ ...tutorials, bookmarks: true })}
63 | >
64 | OK
Next.js version: 16.2.6 (Turbopack)
severo
même souci que https://codeberg.org/cartes/web/issues/2270#issuecomment-16061999, je pense.
laem
MMMh, celle-ci, je ne sais pas la reproduire.