Skip to content
This repository was archived by the owner on Apr 28, 2025. It is now read-only.
This repository was archived by the owner on Apr 28, 2025. It is now read-only.

Remix and Cypress hydration problem #220

@triptec

Description

@triptec

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

Setup the template and run npm test:e2e:dev and run the smoke test in either chrome or electron and open the console.

Expected Behavior

That there shouldn't be any hydration probelms

Actual Behavior

The console is filled with:
react-dom.development.js:86 Warning: Expected server HTML to contain a matching <meta> in <head>. at meta at head at html at App at RemixRoute (http://localhost:3000/build/_shared/chunk-DRRZ7FOQ.js:7074:3) at RenderedRoute (http://localhost:3000/build/_shared/chunk-DRRZ7FOQ.js:4543:5) at RenderErrorBoundary (http://localhost:3000/build/_shared/chunk-DRRZ7FOQ.js:4932:9) at Routes (http://localhost:3000/build/_shared/chunk-DRRZ7FOQ.js:4803:5) at Router (http://localhost:3000/build/_shared/chunk-DRRZ7FOQ.js:4750:15) at RouterProvider (http://localhost:3000/build/_shared/chunk-DRRZ7FOQ.js:4699:5) at RemixErrorBoundary (http://localhost:3000/build/_shared/chunk-DRRZ7FOQ.js:6693:5) at RemixBrowser (http://localhost:3000/build/_shared/chunk-DRRZ7FOQ.js:8138:55) printWarning @ react-dom.development.js:86 error @ react-dom.development.js:60 warnForInsertedHydratedElement @ react-dom.development.js:10499 didNotFindHydratableInstance @ react-dom.development.js:11458 warnNonhydratedInstance @ react-dom.development.js:12385 tryToClaimNextHydratableInstance @ react-dom.development.js:12534 updateHostComponent @ react-dom.development.js:19902 beginWork @ react-dom.development.js:21618 beginWork$1 @ react-dom.development.js:27426 performUnitOfWork @ react-dom.development.js:26560 workLoopConcurrent @ react-dom.development.js:26543 renderRootConcurrent @ react-dom.development.js:26505 performConcurrentWorkOnRoot @ react-dom.development.js:25738 workLoop @ scheduler.development.js:266 flushWork @ scheduler.development.js:239 performWorkUntilDeadline @ scheduler.development.js:533 react-dom.development.js:12507 Uncaught Error: Hydration failed because the initial UI does not match what was rendered on the server. at throwOnHydrationMismatch (react-dom.development.js:12507:9) at tryToClaimNextHydratableInstance (react-dom.development.js:12535:7) at updateHostComponent (react-dom.development.js:19902:5) at beginWork (react-dom.development.js:21618:14) at HTMLUnknownElement.callCallback2 (react-dom.development.js:4164:14) at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:16) at invokeGuardedCallback (react-dom.development.js:4277:31) at beginWork$1 (react-dom.development.js:27451:7) at performUnitOfWork (react-dom.development.js:26560:12) at workLoopConcurrent (react-dom.development.js:26543:5)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions