[pickers] Move multi input range field validation tests to the descri…

…be test file (#14501)

packages/x-date-pickers-pro/src/MultiInputDateRangeField/tests/describes.MultiInputDateRangeField.test.tsx

@@ -1,10 +1,15 @@
 import * as React from 'react';
 import { MultiInputDateRangeField } from '@mui/x-date-pickers-pro/MultiInputDateRangeField';
-import { createPickerRenderer } from 'test/utils/pickers';
+import {
+  adapterToUse,
+  createPickerRenderer,
+  describeRangeValidation,
+  setValueOnFieldInput,
+} from 'test/utils/pickers';
 import { describeConformance } from 'test/utils/describeConformance';
 
 describe('<MultiInputDateRangeField />', () => {
-  const { render } = createPickerRenderer();
+  const { render, clock } = createPickerRenderer({ clock: 'fake' });
 
   describeConformance(<MultiInputDateRangeField enableAccessibleFieldDOMStructure />, () => ({
     classes: {} as any,
@@ -14,4 +19,14 @@ describe('<MultiInputDateRangeField />', () => {
     refInstanceof: window.HTMLDivElement,
     skip: ['themeVariants', 'componentProp', 'componentsProp'],
   }));
+
+  describeRangeValidation(MultiInputDateRangeField, () => ({
+    render,
+    clock,
+    componentFamily: 'field',
+    views: ['year', 'month', 'day'],
+    setValue: (value, { setEndDate } = {}) => {
+      setValueOnFieldInput(adapterToUse.format(value, 'keyboardDate'), setEndDate ? 1 : 0);
+    },
+  }));
 });

packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/tests/describes.MultiInputDateTimeRangeField.test.tsx

@@ -1,10 +1,15 @@
 import * as React from 'react';
 import { MultiInputDateTimeRangeField } from '@mui/x-date-pickers-pro/MultiInputDateTimeRangeField';
-import { createPickerRenderer } from 'test/utils/pickers';
+import {
+  adapterToUse,
+  createPickerRenderer,
+  describeRangeValidation,
+  setValueOnFieldInput,
+} from 'test/utils/pickers';
 import { describeConformance } from 'test/utils/describeConformance';
 
 describe('<MultiInputDateTimeRangeField />', () => {
-  const { render } = createPickerRenderer();
+  const { render, clock } = createPickerRenderer({ clock: 'fake' });
 
   describeConformance(<MultiInputDateTimeRangeField enableAccessibleFieldDOMStructure />, () => ({
     classes: {} as any,
@@ -14,4 +19,14 @@ describe('<MultiInputDateTimeRangeField />', () => {
     refInstanceof: window.HTMLDivElement,
     skip: ['componentProp', 'componentsProp', 'themeVariants'],
   }));
+
+  describeRangeValidation(MultiInputDateTimeRangeField, () => ({
+    render,
+    clock,
+    componentFamily: 'field',
+    views: ['year', 'month', 'day', 'hours', 'minutes'],
+    setValue: (value, { setEndDate } = {}) => {
+      setValueOnFieldInput(adapterToUse.format(value, 'keyboardDateTime'), setEndDate ? 1 : 0);
+    },
+  }));
 });

packages/x-date-pickers-pro/src/MultiInputTimeRangeField/tests/describes.MultiInputTimeRangeField.test.tsx

@@ -1,10 +1,15 @@
 import * as React from 'react';
 import { MultiInputTimeRangeField } from '@mui/x-date-pickers-pro/MultiInputTimeRangeField';
-import { createPickerRenderer } from 'test/utils/pickers';
+import {
+  adapterToUse,
+  createPickerRenderer,
+  describeRangeValidation,
+  setValueOnFieldInput,
+} from 'test/utils/pickers';
 import { describeConformance } from 'test/utils/describeConformance';
 
 describe('<MultiInputTimeRangeField />', () => {
-  const { render } = createPickerRenderer();
+  const { render, clock } = createPickerRenderer({ clock: 'fake' });
 
   describeConformance(<MultiInputTimeRangeField enableAccessibleFieldDOMStructure />, () => ({
     classes: {} as any,
@@ -14,4 +19,14 @@ describe('<MultiInputTimeRangeField />', () => {
     refInstanceof: window.HTMLDivElement,
     skip: ['themeVariants', 'componentProp', 'componentsProp'],
   }));
+
+  describeRangeValidation(MultiInputTimeRangeField, () => ({
+    render,
+    clock,
+    componentFamily: 'field',
+    views: ['hours', 'minutes'],
+    setValue: (value, { setEndDate } = {}) => {
+      setValueOnFieldInput(adapterToUse.format(value, 'fullTime'), setEndDate ? 1 : 0);
+    },
+  }));
 });