Issue number: resolves #24542

What is the current behavior?

WebKit has a quirk where IntersectionObserver callbacks are delayed until after an accelerated animation finishes if the "root" specified in the config is the browser viewport (the default behavior if "root" is not specified) This means that when presenting a datetime in a modal on iOS the calendar body appears blank until the modal animation finishes.

What is the new behavior?

• We can work around this issue by observing an element inside of the datetime component and using the datetime component itself as the root. To do this, I added an .intersection-tracker element inside of datetime. This element has a dimension of 0x0 so it should not affect component layout or functionality.

I opted to add this element instead of re-using an existing element because the existing elements are not guaranteed to always be in the DOM due to different datetime presentation styles.

Does this introduce a breaking change?

• Yes
• No

Other information

Dev build: 7.8.1-dev.11710449785.14ebd5a0

Closed