diff --git a/packages/x-data-grid-pro/src/hooks/features/columnResize/useGridColumnResize.tsx b/packages/x-data-grid-pro/src/hooks/features/columnResize/useGridColumnResize.tsx
index f182fe415d1cc..fe478a27eec57 100644
--- a/packages/x-data-grid-pro/src/hooks/features/columnResize/useGridColumnResize.tsx
+++ b/packages/x-data-grid-pro/src/hooks/features/columnResize/useGridColumnResize.tsx
@@ -284,7 +284,7 @@ export const useGridColumnResize = (
   const logger = useGridLogger(apiRef, 'useGridColumnResize');
 
   const colDefRef = React.useRef<GridStateColDef>();
-  const previousMouseClickEvent = React.useRef<Event>();
+  const previousMouseClickEvent = React.useRef<MouseEvent>();
   const columnHeaderElementRef = React.useRef<HTMLDivElement>();
   const headerFilterElementRef = React.useRef<HTMLDivElement>();
   const groupHeaderElementsRef = React.useRef<Element[]>([]);
diff --git a/packages/x-data-grid-pro/src/tests/columns.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/columns.DataGridPro.test.tsx
index 3df62530ae2f8..2ee7c96fb546b 100644
--- a/packages/x-data-grid-pro/src/tests/columns.DataGridPro.test.tsx
+++ b/packages/x-data-grid-pro/src/tests/columns.DataGridPro.test.tsx
@@ -168,7 +168,7 @@ describe('<DataGridPro /> - Columns', () => {
         />,
       );
       const separator = document.querySelector(`.${gridClasses['columnSeparator--resizable']}`)!;
-      fireEvent.mouseDown(separator, new MouseEvent('mouseDown', { clientX: 100 }));
+      fireEvent.mouseDown(separator, new MouseEvent('mousedown', { clientX: 100 }));
       fireEvent.mouseMove(separator, new MouseEvent('mousemove', { clientX: 110, buttons: 1 }));
       fireEvent.mouseUp(separator, new MouseEvent('mouseup'));
       expect(getColumnHeaderCell(0)).toHaveInlineStyle({ width: '110px' });