search

refinedev / refine

A React Framework for building internal tools, admin panels, dashboards & B2B apps with unmatched flexibility.
https://refine.dev
MIT License
25.9k stars 1.96k forks source link

[BUG] MUI Data Grid no longer horizontally scaling (also on official examples) #6077

Open PercivalFigaro opened 3 days ago

PercivalFigaro commented 3 days ago

Describe the bug

When the browser window size is reduced, then horizontal scaling does not properly occur (table keeps full width and flows under the sidebar). A hard page refresh correctly resizes the table. Increasing window size scales the Data Grid properly, decreasing window size does not. This bug started occurring last Friday, possibly connected to a Chrome update.

Steps To Reproduce

  1. Use latest version of Google Chrome
  2. Open up any of Refine's official examples using MUI and its Data Grid
  3. Reduce the browser window size by making Chrome dev tools larger
  4. Instead of scaling, the columns of the Data Grid do not reduce in size and full table width is maintained

Expected behavior

The Data Grid should horizontally scale, not flow under the sidebar

Packages

"@mui/icons-material": "^5.8.3",
"@mui/lab": "^5.0.0-alpha.85",
"@mui/material": "^5.8.6",
"@mui/x-data-grid": "^6.6.0",
"@refinedev/cli": "^2.16.33",
"@refinedev/core": "^4.51.0",
"@refinedev/devtools": "^1.2.3",
"@refinedev/kbar": "^1.3.12",
"@refinedev/mui": "^5.17.0",
"@refinedev/react-hook-form": "^4.8.20",
"@refinedev/react-router-v6": "^4.5.11",
"@refinedev/simple-rest": "^5.0.8",

Additional Context

No response

alicanerdurmaz commented 2 days ago

Hello @PercivalFigaro, I can confirm that there are no issues with Safari, but it is not working properly on Chrome. We will look into this, thank you.

Table example: https://example.mui.admin.refine.dev/orders