diff --git a/test/utils/pickers-utils.tsx b/test/utils/pickers-utils.tsx index ca6adf802b183..39c6fbf3bc256 100644 --- a/test/utils/pickers-utils.tsx +++ b/test/utils/pickers-utils.tsx @@ -3,10 +3,41 @@ import { createRenderer, screen, RenderOptions, userEvent } from '@mui/monorepo/ import { CreateRendererOptions } from '@mui/monorepo/test/utils/createRenderer'; import { TransitionProps } from '@mui/material/transitions'; import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns'; +import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; +import { AdapterLuxon } from '@mui/x-date-pickers/AdapterLuxon'; +import { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment'; import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; -// TODO make possible to pass here any utils using cli -export class AdapterClassToUse extends AdapterDateFns { } +// Add parameter `--date-adapter luxon` to use AdapterLuxon for running tests +// adapter available : date-fns (default one), day-js, luxon, moment +const argv = require('yargs/yargs')(process.argv.slice(2)).argv; + +const availableAdapters = ['date-fns', 'day-js', 'luxon', 'moment']; + +const adapter = + argv['date-adapter'] && availableAdapters.includes(argv['date-adapter']) + ? argv['date-adapter'] + : 'date-fns'; + +let AdapterClassToExtend; +switch (adapter) { + case 'day-js': + AdapterClassToExtend = AdapterDayjs; + break; + + case 'luxon': + AdapterClassToExtend = AdapterDayjs; + break; + + case 'moment': + AdapterClassToExtend = AdapterLuxon; + break; + + default: + AdapterClassToExtend = AdapterMoment; + break; +} +export class AdapterClassToUse extends AdapterClassToExtend {} export const adapterToUse = new AdapterDateFns(); @@ -55,14 +86,14 @@ export function createPickerRenderer({ type OpenPickerParams = | { - type: 'date' | 'date-time' | 'time'; - variant: 'mobile' | 'desktop'; - } + type: 'date' | 'date-time' | 'time'; + variant: 'mobile' | 'desktop'; + } | { - type: 'date-range'; - variant: 'mobile' | 'desktop'; - initialFocus: 'start' | 'end'; - }; + type: 'date-range'; + variant: 'mobile' | 'desktop'; + initialFocus: 'start' | 'end'; + }; export const openPicker = (params: OpenPickerParams) => { if (params.type === 'date-range') { @@ -115,28 +146,28 @@ export const withPickerControls = ( Component: React.ComponentType, ) => - >(defaultProps: DefaultProps) => { + >(defaultProps: DefaultProps) => { + return ( + props: Omit & + Partial & { + initialValue: TValue; + onChange?: any; + }, + ) => { + const { initialValue, onChange, ...other } = props; + + const [value, setValue] = React.useState(initialValue); + + const handleChange = React.useCallback( + (newValue: TValue, keyboardInputValue?: string) => { + setValue(newValue); + onChange?.(newValue, keyboardInputValue); + }, + [onChange], + ); + return ( - props: Omit & - Partial & { - initialValue: TValue; - onChange?: any; - }, - ) => { - const { initialValue, onChange, ...other } = props; - - const [value, setValue] = React.useState(initialValue); - - const handleChange = React.useCallback( - (newValue: TValue, keyboardInputValue?: string) => { - setValue(newValue); - onChange?.(newValue, keyboardInputValue); - }, - [onChange], - ); - - return ( - - ); - }; + + ); }; + };