rjsf-team/react-jsonschema-form

SSR and dependencies sections cause hydration errors.

Open

#4,083 建立於 2024年2月8日

在 GitHub 查看
 (1 留言) (0 反應) (0 負責人)TypeScript (13,175 star) (2,136 fork)batch import
awaiting responsebughelp wanted

描述

Prerequisites

What theme are you using?

mui

Version

5.17.0

Current Behavior

When loading this example form using remix.run@2.60 and cloudflare pages for server side rendering, the default value of "yes" in "a" causes a Prop 'aria-controls' did not match. Server: ":R2alajar9lacn96acp:" Client: ":R4lal6ir9lacn96acp:" div error as Uncaught Error: Hydration failed because the initial UI does not match what was rendered on the server.

This causes the frontend to render incorrectly at plain HTML.

Expected Behavior

The UI renders correctly and Hydration is not broken. Ideally the dependency is evaluated before first render causing the initial state to be with the dependency visible.

Steps To Reproduce

  1. Startup a new remix, run project with mui and rjsf dependencies
  2. use the linked playground schema to create a new form.
  3. Form is broken.

codepen of github repo can be provided if required.

Environment

- OS: Windows 11
- Node: 18.17.1
- npm: 8.13.2

Anything else?

I have not tested other SSR engines or other remix engines to validate the behavior on other runtimes.

貢獻者指南