[data grid] Column resizing not working with special characters in column names #12954
Labels
bug 🐛
Something doesn't work
component: data grid
This is the name of the generic UI component, not the React module!
feature: Column resize
Steps to reproduce
Link to live example: (required)
Forked from here: https://mui.com/x/react-data-grid/
Steps:
"
character in the field name.Current behavior
Not documented, no warning or error on the invalid column names.
Expected behavior
querySelector(`[data-field="${colDef.field}"]`)
should bequerySelector(`[data-field="${colDef.field.replace('"', '\\"')}"]`)
There could be some more cases
https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector#escaping_special_characters
Context
We have a very complex column management system, some columns contain very specific configuration of the data which is evaulated by the backend, e.g:
sales_statistics.$alias/order_created_date="this_week",warehouse="1,3"/quantity
Your environment
npx @mui/envinfo
Search keywords: Column resize querySelector DomException escape
Search keywords:
The text was updated successfully, but these errors were encountered: