diff --git a/test/e2e/fixtures/DatePicker/MobileDatePickerV6WithClearAction.tsx b/test/e2e/fixtures/DatePicker/MobileDatePickerV6WithClearAction.tsx new file mode 100644 index 000000000000..b78b026bdb6f --- /dev/null +++ b/test/e2e/fixtures/DatePicker/MobileDatePickerV6WithClearAction.tsx @@ -0,0 +1,21 @@ +import * as React from 'react'; +import dayjs from 'dayjs'; +import { MobileDatePicker } from '@mui/x-date-pickers/MobileDatePicker'; +import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; +import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; + +export default function MobileDatePickerV6WithClearAction() { + return ( + + + + ); +} diff --git a/test/e2e/index.test.ts b/test/e2e/index.test.ts index ea00f52f8c1c..5daa8064aa94 100644 --- a/test/e2e/index.test.ts +++ b/test/e2e/index.test.ts @@ -800,6 +800,19 @@ async function initializeEnvironment( '04/11/2022', ); }); + + it('should have consistent `placeholder` and `value` behavior', async () => { + await renderFixture('DatePicker/MobileDatePickerV6WithClearAction'); + + const input = page.getByRole('textbox'); + + await input.click({ position: { x: 10, y: 2 } }); + await page.getByRole('button', { name: 'Clear' }).click(); + + await input.blur(); + expect(await input.getAttribute('placeholder')).to.equal('MM/DD/YYYY'); + expect(await input.inputValue()).to.equal(''); + }); }); });