findDOMNode is deprecated in StrictMode

[mocsy]

Describe the bug

Due to #1744 I use

    "@jsonforms/material-renderers": "^3.0.0-alpha.1",
    "@jsonforms/react": "^3.0.0-alpha.1",

I encountered the following at runtime in the browser:

Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Transition2 which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-find-node
div
Paper2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:9366:21
WithStyles2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:7155:29
Transition2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:8224:34
Grow2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17545:23
Unstable_TrapFocus@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:13970:19
div
Portal2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:13703:23
Modal2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:14173:19
Popover2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:19747:20
WithStyles2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:7155:29
Menu2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:20238:30
WithStyles2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:7155:29
SelectInput2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:22947:23
div
InputBase2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:16098:29
WithStyles2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:7155:29
Input2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:18530:30
WithStyles2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:7155:29
Select2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:23288:30
WithStyles2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:7155:29
node_modules/@jsonforms/material-renderers/lib/mui-controls/MuiSelect.js/exports.MuiSelect<@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:34837:18
div
FormControl2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:16564:23
WithStyles2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:7155:29
HiddenJs@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17840:19
WithWidth@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17788:30
Hidden@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17990:31
MaterialInputControl2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:35331:42
node_modules/@jsonforms/react/lib/JsonFormsContext.js/withContextToEnumProps/<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:15855:19
node_modules/@jsonforms/react/lib/JsonFormsContext.js/exports.withJsonFormsContext/<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:15756:27
node_modules/@jsonforms/react/lib/JsonForms.js/TestAndRender<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:16010:11
JsonFormsDispatchRenderer2@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:15987:28
node_modules/@jsonforms/react/lib/JsonForms.js/exports.JsonFormsDispatch<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:16039:58
div
Grid2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17145:33
WithStyles2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:7155:29
div
Grid2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17145:33
WithStyles2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:7155:29
HiddenJs@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17840:19
WithWidth@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17788:30
Hidden@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17990:31
node_modules/@jsonforms/material-renderers/lib/util/layout.js/exports.MaterialLayoutRenderer<@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:39391:21
node_modules/@jsonforms/material-renderers/lib/layouts/MaterialHorizontalLayout.js/exports.MaterialHorizontalLayoutRenderer@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:39967:22
node_modules/@jsonforms/react/lib/JsonFormsContext.js/withContextToLayoutProps/<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:15770:19
node_modules/@jsonforms/react/lib/JsonFormsContext.js/exports.withJsonFormsContext/<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:15756:27
node_modules/@jsonforms/react/lib/JsonForms.js/TestAndRender<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:16010:11
JsonFormsDispatchRenderer2@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:15987:28
node_modules/@jsonforms/react/lib/JsonForms.js/exports.JsonFormsDispatch<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:16039:58
div
Grid2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17145:33
WithStyles2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:7155:29
div
Grid2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17145:33
WithStyles2@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:7155:29
HiddenJs@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17840:19
WithWidth@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17788:30
Hidden@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:17990:31
node_modules/@jsonforms/material-renderers/lib/util/layout.js/exports.MaterialLayoutRenderer<@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:39391:21
node_modules/@jsonforms/material-renderers/lib/layouts/MaterialVerticalLayout.js/exports.MaterialVerticalLayoutRenderer@http://localhost:3000/node_modules/.vite/@jsonforms_material-renderers.js?v=f7c5e371:39995:22
node_modules/@jsonforms/react/lib/JsonFormsContext.js/withContextToLayoutProps/<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:15770:19
node_modules/@jsonforms/react/lib/JsonFormsContext.js/exports.withJsonFormsContext/<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:15756:27
node_modules/@jsonforms/react/lib/JsonForms.js/TestAndRender<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:16010:11
JsonFormsDispatchRenderer2@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:15987:28
node_modules/@jsonforms/react/lib/JsonForms.js/exports.JsonFormsDispatch<@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:16039:58
node_modules/@jsonforms/react/lib/JsonFormsContext.js/exports.JsonFormsStateProvider@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:15645:22
node_modules/@jsonforms/react/lib/JsonForms.js/exports.JsonForms@http://localhost:3000/node_modules/.vite/chunk-B6MLHCOI.js?v=f7c5e371:16047:17
User
App@http://localhost:3000/src/App.bs.js?t=1635102371337:13:33 react-dom.development.js:67:29

Expected behavior

No issues at runtime.
(I know it's beta, but I guess it may help you to know)

Steps to reproduce the issue

1. Go to 'https://github.com/eclipsesource/jsonforms-react-seed'
2. Copy json data
3. Copy this

            <JsonForms
              schema={schema}
              uischema={uischema}
              data={jsonformsData}
              renderers={renderers}
            />

4. Setup project around that code with vite issues with vitejs #1744
5. Use react in strict mode https://reactjs.org/docs/strict-mode.html
6. Click on drop-down at runtime

Screenshots

No response

In which browser are you experiencing the issue?

Firefox Developer 94.0b9 (64-bit)

Framework

React

RendererSet

Material

Additional context

No response

[sdirix]

Hi! This will probably be fixed with out React Material update coming soon. We'll test this case too.

[sdirix]

Hi @mocsy, can you retry with the latest 3.0.0-beta.0 releases? They contain the Material v5 update among other changes.

[mocsy]

Thanks, Stefan @sdirix.

I had to install $ npm i @emotion/styled $ npm i @emotion/react due to the error:

node_modules/@mui/styled-engine/index.js:6:21: error: Could not resolve "@emotion/styled" (mark it as external to exclude it from the bundle)
node_modules/@mui/styled-engine/index.js:26:45: error: Could not resolve "@emotion/react" (mark it as external to exclude it from the bundle)

After that it started working fine without the original error.