Materialize: Dropdown Broken on iPhone (and Safari in general)

[F1LT3R]

Possibly a duplicate of https://github.com/Dogfalo/materialize/issues/6449

The DropDown list in iPhone and Safari in general do not work with the mouse or tapping on the phone, but do work with keyboard navigation. Usually the wrong option is selected.

Video for reference:

[pwcreative]

This is a known issue, the current workaround is to serve this patched select.js file after materialize.js (and before your initialisation js).

https://github.com/Dogfalo/materialize/blob/v1-dev/js/select.js

[StaticBR]

I have just debugged this issues on the Dropdown Menu Component .

The Issue is that IO13 Safari propagate TouchEnd Events before the Click event is propagated.

So if you have a click listener within an drop down, it is not correctly triggerd, because the Dropwdown is getting closed by the TouchEnd event. After that the click event is at a different position or does not longer exist.
Removing the touch event listener solved this issue for me.

[doughballs]

I have just debugged this issues on the Dropdown Menu Component .
The Issue is that IO13 Safari propagate TouchEnd Events before the Click event is propagated.
So if you have a click listener within an drop down, it is not correctly triggerd, because the Dropwdown is getting closed by the TouchEnd event. After that the click event is at a different position or does not longer exist.
Removing the touch event listener solved this issue for me.

Awesome - can you provide a code sample just to be really clear to anyone else coming here for a solution? Thanks!

[StaticBR]

Okay its pretty simple see the attached Patch file:
patch_ios13_bug.txt

[AnchorageMuseum]

Have these changes been applied to the current version? It looks like it's there, but I'm still having the same issue.

[doughballs]

@AnchorageMuseum you need to serve the patched JS file.