'KeyboardDatePicker readOnly true race condition

KeyboardDatePicker from "@material-ui/pickers": "^3.3.10" exhibits a race condition for the readOnly property. In 3 out of 10 automated cypress.io tests, the following click action made the date picker modal appear even though logging proves that readOnly was set to true:

cy.get('.MuiInputAdornment-root > .MuiButtonBase-root > .MuiIconButton-label > .MuiSvgIcon-root').click();

Since material-ui-pickers is no longer supported, it seems like my only options are:

  1. Redesign my UI such that it renders some other read-only widget instead of rendering a KeyboardDatePicker.
  2. Attempt to fix it by upgrading to mui v5. I haven't investigated how to migrate KeyboardDatePicker but I guess I need to upgrade anyway. Hope it solves the problem.

Does anyone see any other options or have any insight on whether #2 would solve the problem and how?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source