Fix click leaking through to DOM element underneath
See comment, although this is quite hack - I'm torn on whether this is worth it for the bugfix. Upgrading react-aria doesn't fix it either (and also breaks everything in React strict mode). Fixes https://github.com/vector-im/element-call/issues/762
This commit is contained in:
parent
46e429c37b
commit
098be75415
1 changed files with 13 additions and 0 deletions
|
@ -73,6 +73,19 @@ function Option<T>({ item, state, className }: OptionProps<T>) {
|
||||||
ref
|
ref
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// Hack: remove the onPointerUp event handler and re-wire it to
|
||||||
|
// onClick. Chrome Android triggers a click event after the onpointerup
|
||||||
|
// event which leaks through to elements underneath the z-indexed select
|
||||||
|
// popover. preventDefault / stopPropagation don't have any effect, even
|
||||||
|
// adding just a dummy onClick handler still doesn't work, but it's fine
|
||||||
|
// if we handle just onClick.
|
||||||
|
// https://github.com/vector-im/element-call/issues/762
|
||||||
|
const origPointerUp = optionProps.onPointerUp;
|
||||||
|
delete optionProps.onPointerUp;
|
||||||
|
optionProps.onClick = (e) => {
|
||||||
|
origPointerUp(e as unknown as React.PointerEvent<HTMLElement>);
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<li
|
<li
|
||||||
{...optionProps}
|
{...optionProps}
|
||||||
|
|
Loading…
Add table
Reference in a new issue