Html content are wrapping with span element as parent element

[Ajitpatil92002]

Html content are wrapping with span element as parent element

Error: Hydration failed because the initial UI does not match what was rendered on the server.

Warning: Expected server HTML to contain a matching

in .

See more info here: https://nextjs.org/docs/messages/react-hydration-error

Component Stack p Element ./node_modules/interweave/esm/bundle-7aab7250.js (315:3) span Element ./node_modules/interweave/esm/bundle-7aab7250.js (315:3) Markup ./node_modules/interweave/esm/index.js (652:5) Interweave ./node_modules/interweave/esm/index.js (695:5) div div Card ./src/components/Card.jsx (19:11) div section Call Stack throwOnHydrationMismatch node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (6779:0) tryToClaimNextHydratableInstance node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (6818:0) updateHostComponent$1 node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (15516:0) beginWork$1 node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (17351:0) HTMLUnknownElement.callCallback node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (19437:0) Object.invokeGuardedCallbackImpl node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (19486:0) invokeGuardedCallback node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (19561:0) beginWork node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (25672:0) performUnitOfWork node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (24501:0) workLoopConcurrent node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (24487:0) renderRootConcurrent node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (24443:0) performConcurrentWorkOnRoot node_modules\next\dist\compiled\react-dom\cjs\react-dom.development.js (23321:0) workLoop node_modules\next\dist\compiled\scheduler\cjs\scheduler.development.js (261:0) flushWork node_modules\next\dist\compiled\scheduler\cjs\scheduler.development.js (230:0) MessagePort.performWorkUntilDeadline node_modules\next\dist\compiled\scheduler\cjs\scheduler.development.js (537:0)

[sarbazx]

Hi @Ajitpatil92002 did able to fix this? I'm also getting this error.

[milesj]

Interweave always wraps with an element. Just change the wrapping tag: <Interweave tagName="div" />

[sarbazx]

what about SSR?

[milesj]

It should be the same. React rendering on the server or client is still just rendering.