[test] Fix console warnings while executing tests with React 18 (#16386)

mui · Jan 29, 2025 · 4eacfd4 · 4eacfd4
1 parent 07201fb
commit 4eacfd4
Show file tree

Hide file tree

Showing 11 changed files with 91 additions and 10 deletions.
diff --git a/packages/x-data-grid-premium/src/tests/dataSourceAggregation.DataGridPremium.test.tsx b/packages/x-data-grid-premium/src/tests/dataSourceAggregation.DataGridPremium.test.tsx
@@ -99,12 +99,18 @@ describe('<DataGridPremium /> - Data source aggregation', () => {
 
   it('should show aggregation option in the column menu', async () => {
     const { user } = render(<TestDataSourceAggregation />);
+    await waitFor(() => {
+      expect(getRowsSpy.callCount).to.be.greaterThan(0);
+    });
     await user.click(within(getColumnHeaderCell(0)).getByLabelText('Menu'));
     expect(screen.queryByLabelText('Aggregation')).not.to.equal(null);
   });
 
   it('should not show aggregation option in the column menu when no aggregation function is defined', async () => {
     const { user } = render(<TestDataSourceAggregation aggregationFunctions={{}} />);
+    await waitFor(() => {
+      expect(getRowsSpy.callCount).to.be.greaterThan(0);
+    });
     await user.click(within(getColumnHeaderCell(0)).getByLabelText('Menu'));
     expect(screen.queryByLabelText('Aggregation')).to.equal(null);
   });
@@ -117,6 +123,9 @@ describe('<DataGridPremium /> - Data source aggregation', () => {
         }}
       />,
     );
+    await waitFor(() => {
+      expect(getRowsSpy.callCount).to.be.greaterThan(0);
+    });
     expect(getRowsSpy.args[0][0].aggregationModel).to.deep.equal({ id: 'size' });
   });
 

diff --git a/packages/x-data-grid-pro/src/components/headerFiltering/GridHeaderFilterCell.tsx b/packages/x-data-grid-pro/src/components/headerFiltering/GridHeaderFilterCell.tsx
@@ -474,7 +474,15 @@ GridHeaderFilterCell.propTypes = {
     inputRef: PropTypes.oneOfType([
       PropTypes.func,
       PropTypes.shape({
-        current: PropTypes.any.isRequired,
+        current: (props, propName) => {
+          if (props[propName] == null) {
+            return null;
+          }
+          if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
+            return new Error(`Expected prop '${propName}' to be of type Element`);
+          }
+          return null;
+        },
       }),
     ]),
     isFilterActive: PropTypes.bool,

diff --git a/packages/x-data-grid-pro/src/components/headerFiltering/GridHeaderFilterMenu.tsx b/packages/x-data-grid-pro/src/components/headerFiltering/GridHeaderFilterMenu.tsx
@@ -148,7 +148,15 @@ GridHeaderFilterMenu.propTypes = {
         inputRef: PropTypes.oneOfType([
           PropTypes.func,
           PropTypes.shape({
-            current: PropTypes.any.isRequired,
+            current: (props, propName) => {
+              if (props[propName] == null) {
+                return null;
+              }
+              if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
+                return new Error(`Expected prop '${propName}' to be of type Element`);
+              }
+              return null;
+            },
           }),
         ]),
         isFilterActive: PropTypes.bool,

diff --git a/packages/x-data-grid-pro/src/components/headerFiltering/GridHeaderFilterMenuContainer.tsx b/packages/x-data-grid-pro/src/components/headerFiltering/GridHeaderFilterMenuContainer.tsx
@@ -137,7 +137,15 @@ GridHeaderFilterMenuContainer.propTypes = {
         inputRef: PropTypes.oneOfType([
           PropTypes.func,
           PropTypes.shape({
-            current: PropTypes.any.isRequired,
+            current: (props, propName) => {
+              if (props[propName] == null) {
+                return null;
+              }
+              if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
+                return new Error(`Expected prop '${propName}' to be of type Element`);
+              }
+              return null;
+            },
           }),
         ]),
         isFilterActive: PropTypes.bool,

diff --git a/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputBoolean.tsx b/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputBoolean.tsx
@@ -138,7 +138,15 @@ GridFilterInputBoolean.propTypes = {
   inputRef: PropTypes.oneOfType([
     PropTypes.func,
     PropTypes.shape({
-      current: PropTypes.any.isRequired,
+      current: (props, propName) => {
+        if (props[propName] == null) {
+          return null;
+        }
+        if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
+          return new Error(`Expected prop '${propName}' to be of type Element`);
+        }
+        return null;
+      },
     }),
   ]),
   /**

diff --git a/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputDate.tsx b/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputDate.tsx
@@ -136,7 +136,15 @@ GridFilterInputDate.propTypes = {
   inputRef: PropTypes.oneOfType([
     PropTypes.func,
     PropTypes.shape({
-      current: PropTypes.any.isRequired,
+      current: (props, propName) => {
+        if (props[propName] == null) {
+          return null;
+        }
+        if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
+          return new Error(`Expected prop '${propName}' to be of type Element`);
+        }
+        return null;
+      },
     }),
   ]),
   /**

diff --git a/...ages/x-data-grid/src/components/panel/filterPanel/GridFilterInputMultipleSingleSelect.tsx b/...ages/x-data-grid/src/components/panel/filterPanel/GridFilterInputMultipleSingleSelect.tsx
@@ -134,7 +134,15 @@ GridFilterInputMultipleSingleSelect.propTypes = {
   inputRef: PropTypes.oneOfType([
     PropTypes.func,
     PropTypes.shape({
-      current: PropTypes.any.isRequired,
+      current: (props, propName) => {
+        if (props[propName] == null) {
+          return null;
+        }
+        if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
+          return new Error(`Expected prop '${propName}' to be of type Element`);
+        }
+        return null;
+      },
     }),
   ]),
   /**

diff --git a/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputMultipleValue.tsx b/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputMultipleValue.tsx
@@ -111,7 +111,15 @@ GridFilterInputMultipleValue.propTypes = {
   inputRef: PropTypes.oneOfType([
     PropTypes.func,
     PropTypes.shape({
-      current: PropTypes.any.isRequired,
+      current: (props, propName) => {
+        if (props[propName] == null) {
+          return null;
+        }
+        if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
+          return new Error(`Expected prop '${propName}' to be of type Element`);
+        }
+        return null;
+      },
     }),
   ]),
   /**

diff --git a/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputSingleSelect.tsx b/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputSingleSelect.tsx
@@ -174,7 +174,15 @@ GridFilterInputSingleSelect.propTypes = {
   inputRef: PropTypes.oneOfType([
     PropTypes.func,
     PropTypes.shape({
-      current: PropTypes.any.isRequired,
+      current: (props, propName) => {
+        if (props[propName] == null) {
+          return null;
+        }
+        if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
+          return new Error(`Expected prop '${propName}' to be of type Element`);
+        }
+        return null;
+      },
     }),
   ]),
   /**

diff --git a/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputValue.tsx b/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputValue.tsx
@@ -128,7 +128,15 @@ GridFilterInputValue.propTypes = {
   inputRef: PropTypes.oneOfType([
     PropTypes.func,
     PropTypes.shape({
-      current: PropTypes.any.isRequired,
+      current: (props, propName) => {
+        if (props[propName] == null) {
+          return null;
+        }
+        if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
+          return new Error(`Expected prop '${propName}' to be of type Element`);
+        }
+        return null;
+      },
     }),
   ]),
   /**

diff --git a/packages/x-data-grid/src/models/gridFilterInputComponent.ts b/packages/x-data-grid/src/models/gridFilterInputComponent.ts
@@ -18,7 +18,7 @@ export type GridFilterInputValueProps<
   applyValue: (value: GridFilterItem) => void;
   // Is any because if typed as GridApiRef a dep cycle occurs. Same happens if ApiContext is used.
   apiRef: RefObject<Api>;
-  inputRef?: React.Ref<any>;
+  inputRef?: React.Ref<HTMLElement | null>;
   focusElementRef?: React.Ref<any>;
   headerFilterMenu?: React.ReactNode;
   clearButton?: React.ReactNode | null;