search

mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!
https://mui.com/x/
4.53k stars 1.32k forks source link

[data grid] useResizeContainer Console Error when wrapping <div> is modified #12412

Closed dmarciano closed 1 month ago

dmarciano commented 8 months ago

Steps to reproduce

Link to live example: Click the Edit in StackBlitz icon under the Predefined dimensions section of Data Grid - Layout

Steps:

  1. Modify the immediate parent <div> of the <DataGrid> component (e.g., add an extra whitespace between {{ and height

Current behavior

A useResizeContainer error is reported in the browser console: image

Expected behavior

No console error has the height and width are defined

Context

Remove/prevent false positive errors

Your environment

npx @mui/envinfo ``` System: OS: Windows 10 10.0.19045 Binaries: Node: 18.18.0 - C:\Program Files\nodejs\node.EXE npm: 10.1.0 - C:\Program Files\nodejs\npm.CMD pnpm: Not Found Browsers: Chrome: Version 120.0.6099.225 (Official Build) (64-bit) Edge: Version 120.0.2210.144 (Official build) (64-bit) npmPackages: @emotion/react: 11.11.4 @emotion/styled: 11.11.0 @mui/icons-material 5.15.12 @mui/material 5.15.12 @mui/x-data-grid 6.19.6 @mui/x-datagrid-generator 6.19.6 @types/react 18.2.64 @types/react-dom 18.2.21 react 18.2.0 react-dom 18.2.0 typescript 5.4.2 ```

Search keywords: datagrid, useResizeContainer

michelengelen commented 8 months ago

This is not reproducible in my local instance, but on Stackblitz as described by @dmarciano.

I will add this to the board, but as this is possibly only happening on Stackblitz this might have a relatively low priority. Thanks for raising this anyways @dmarciano 🙇🏼

shikha-mobibiz commented 1 month ago

Facing same issue when using DataGrid

romgrk commented 1 month ago

If this only happens in stackblitz, this would be a stackblitz bug. I notice it only happens on HMR, but not when the page first loads. This makes me think that there's an issue with how the HMR update interacts with the DOM.

If someone can reproduce the issue locally, we could look into it.

github-actions[bot] commented 1 month ago

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue. Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

[!NOTE] We value your feedback @dmarciano! How was your experience with our support team? We'd love to hear your thoughts in this brief Support Satisfaction survey. Your insights help us improve!

shikha-mobibiz commented 1 month ago

If this only happens in stackblitz, this would be a stackblitz bug. I notice it only happens on HMR, but not when the page first loads. This makes me think that there's an issue with how the HMR update interacts with the DOM.

If someone can reproduce the issue locally, we could look into it.

This is not link to stackblitz, I am also facing same issue on my local app.

romgrk commented 1 month ago

Can you provide a reproduction case? Please share it in a codesandbox.

github-actions[bot] commented 1 month ago

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue. Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

[!NOTE] We value your feedback @dmarciano! How was your experience with our support team? We'd love to hear your thoughts in this brief Support Satisfaction survey. Your insights help us improve!

romgrk commented 1 month ago

Unrelated issue, continue the discussion in the other issue you created.