add mergeSlotProps tests

Author: siriwatknp

packages/mui-material/src/Accordion/Accordion.spec.tsx

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { expectType } from '@mui/types';
+import { mergeSlotProps } from '@mui/material/utils';
 import Accordion, { AccordionProps } from '@mui/material/Accordion';
 
 function testOnChange() {
@@ -58,7 +59,7 @@ const AccordionComponentTest = () => {
 </Accordion>;
 
 function Custom(props: AccordionProps) {
-  const { slotProps, ...dialogProps } = props;
+  const { slotProps, ...other } = props;
   return (
     <Accordion
       slotProps={{
@@ -76,7 +77,26 @@ function Custom(props: AccordionProps) {
           };
         },
       }}
-      {...dialogProps}
+      {...other}
+    >
+      test
+    </Accordion>
+  );
+}
+
+function Custom2(props: AccordionProps) {
+  const { slotProps, ...other } = props;
+  return (
+    <Accordion
+      slotProps={{
+        ...slotProps,
+        transition: mergeSlotProps(slotProps?.transition, {
+          onExited: (node) => {
+            expectType<HTMLElement, typeof node>(node);
+          },
+        }),
+      }}
+      {...other}
     >
       test
     </Accordion>

packages/mui-material/src/Dialog/Dialog.spec.tsx

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { expectType } from '@mui/types';
+import { mergeSlotProps } from '@mui/material/utils';
 import Dialog, { DialogProps } from '@mui/material/Dialog';
 import { PaperProps } from '@mui/material/Paper';
 
@@ -19,7 +20,7 @@ function Test() {
 }
 
 function Custom(props: DialogProps) {
-  const { slotProps, ...dialogProps } = props;
+  const { slotProps, ...other } = props;
   return (
     <Dialog
       slotProps={{
@@ -37,7 +38,26 @@ function Custom(props: DialogProps) {
           };
         },
       }}
-      {...dialogProps}
+      {...other}
+    >
+      test
+    </Dialog>
+  );
+}
+
+function Custom2(props: DialogProps) {
+  const { slotProps, ...other } = props;
+  return (
+    <Dialog
+      slotProps={{
+        ...slotProps,
+        transition: mergeSlotProps(slotProps?.transition, {
+          onExited: (node) => {
+            expectType<HTMLElement, typeof node>(node);
+          },
+        }),
+      }}
+      {...other}
     >
       test
     </Dialog>

packages/mui-material/src/Popover/Popover.spec.tsx

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { expectType } from '@mui/types';
+import { mergeSlotProps } from '@mui/material/utils';
 import { Popover, PaperProps, PopoverProps } from '@mui/material';
 
 const paperProps: PaperProps<'span'> = {
@@ -27,7 +28,7 @@ function Test() {
 />;
 
 function Custom(props: PopoverProps) {
-  const { slotProps, ...dialogProps } = props;
+  const { slotProps, ...other } = props;
   return (
     <Popover
       slotProps={{
@@ -45,7 +46,26 @@ function Custom(props: PopoverProps) {
           };
         },
       }}
-      {...dialogProps}
+      {...other}
+    >
+      test
+    </Popover>
+  );
+}
+
+function Custom2(props: PopoverProps) {
+  const { slotProps, ...other } = props;
+  return (
+    <Popover
+      slotProps={{
+        ...slotProps,
+        transition: mergeSlotProps(slotProps?.transition, {
+          onExited: (node) => {
+            expectType<HTMLElement, typeof node>(node);
+          },
+        }),
+      }}
+      {...other}
     >
       test
     </Popover>

packages/mui-material/src/Snackbar/Snackbar.spec.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { mergeSlotProps } from '@mui/material/utils';
 import Snackbar, { SnackbarProps } from '@mui/material/Snackbar';
 import { expectType } from '@mui/types';
 
@@ -38,7 +39,7 @@ import { expectType } from '@mui/types';
 />;
 
 function Custom(props: SnackbarProps) {
-  const { slotProps, ...dialogProps } = props;
+  const { slotProps, ...other } = props;
   return (
     <Snackbar
       slotProps={{
@@ -56,7 +57,24 @@ function Custom(props: SnackbarProps) {
           };
         },
       }}
-      {...dialogProps}
+      {...other}
+    />
+  );
+}
+
+function Custom2(props: SnackbarProps) {
+  const { slotProps, ...other } = props;
+  return (
+    <Snackbar
+      slotProps={{
+        ...slotProps,
+        transition: mergeSlotProps(slotProps?.transition, {
+          onExited: (node) => {
+            expectType<HTMLElement, typeof node>(node);
+          },
+        }),
+      }}
+      {...other}
     />
   );
 }

packages/mui-material/src/StepContent/StepContent.spec.tsx

@@ -1,4 +1,6 @@
 import * as React from 'react';
+import { expectType } from '@mui/types';
+import { mergeSlotProps } from '@mui/material/utils';
 import StepContent, { StepContentProps } from '@mui/material/StepContent';
 import Fade from '@mui/material/Fade';
 import Collapse from '@mui/material/Collapse';
@@ -13,7 +15,7 @@ import Zoom from '@mui/material/Zoom';
 <StepContent TransitionComponent={Zoom}>Step Content</StepContent>;
 
 function Custom(props: StepContentProps) {
-  const { slotProps, ...dialogProps } = props;
+  const { slotProps, ...other } = props;
   return (
     <StepContent
       slotProps={{
@@ -31,7 +33,26 @@ function Custom(props: StepContentProps) {
           };
         },
       }}
-      {...dialogProps}
+      {...other}
+    >
+      test
+    </StepContent>
+  );
+}
+
+function Custom2(props: StepContentProps) {
+  const { slotProps, ...other } = props;
+  return (
+    <StepContent
+      slotProps={{
+        ...slotProps,
+        transition: mergeSlotProps(slotProps?.transition, {
+          onExited: (node) => {
+            expectType<HTMLElement, typeof node>(node);
+          },
+        }),
+      }}
+      {...other}
     >
       test
     </StepContent>

packages/mui-material/src/Tooltip/Tooltip.spec.tsx

@@ -1,4 +1,6 @@
 import * as React from 'react';
+import { expectType } from '@mui/types';
+import { mergeSlotProps } from '@mui/material/utils';
 import Tooltip, { TooltipProps } from '@mui/material/Tooltip';
 
 <Tooltip title="Hello">
@@ -53,7 +55,7 @@ const SlotComponentRef = React.forwardRef<HTMLDivElement>((props, ref) => {
 </Tooltip>;
 
 function Custom(props: TooltipProps) {
-  const { slotProps, ...dialogProps } = props;
+  const { slotProps, ...other } = props;
   return (
     <Tooltip
       slotProps={{
@@ -71,7 +73,24 @@ function Custom(props: TooltipProps) {
           };
         },
       }}
-      {...dialogProps}
+      {...other}
+    />
+  );
+}
+
+function Custom2(props: TooltipProps) {
+  const { slotProps, ...other } = props;
+  return (
+    <Tooltip
+      slotProps={{
+        ...slotProps,
+        transition: mergeSlotProps(slotProps?.transition, {
+          onExited: (node) => {
+            expectType<HTMLElement, typeof node>(node);
+          },
+        }),
+      }}
+      {...other}
     />
   );
 }