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/
3.9k stars 1.19k forks source link

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

Open dmarciano opened 3 months ago

dmarciano commented 3 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 3 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 🙇🏼