If the layout of an <input type="date"> element changes while its modal (the "datepicker") is open, this can in certain circumstances cause the modal to be closed.
The following snippet gives an example. If you open the modal and move the selected date around with the arrow keys, the layout will change to display: flex when you select a date from 01 to 19. And during the switch to flex (or back to non-flex) the modal is closed. By contrast, if you scroll through the months, the modal remains open even as input field shifts up or down (hidden behind the modal).
body.c0,body.c1 { display: flex;}input { margin-top: 9em;}<input type="date" value="2025-09-28" oninput="document.body.className = 'c'+ this.value[8]; this.style.marginTop = this.value.substring(5,7) +'em';">This behavior can be observed on Chrome (on Windows), but not on Firefox, where the oninput event handler does not run while the modal is open.
Admittedly this is an artificial example, but I encountered such a behavior in the wild where the layout changes were caused by a combination of @container rules and flex layout. Apparently, switching to display: flex requires extensive re-layouting that browsers prefer not to perform while the modal is open.
This may be just a fun fact, but I wonder which kinds of layout change allow the modal to remain open and which not, and whether the answer depends on the browser. I do not assume there is a cross-browser specification for the behavior of such modals.