search

davidtheclark / react-aria-modal

A fully accessible React modal built according WAI-ARIA Authoring Practices
http://davidtheclark.github.io/react-aria-modal/demo/
MIT License
1.04k stars 96 forks source link

Modal getting closed when user tries to scroll the modal #74

Closed nahme2 closed 5 years ago

nahme2 commented 5 years ago

When I am trying to scroll the modal the modal gets closed immediately. After debugging the code I found that the script which actually closes the modal in general scenarios. checkUnderlayClick = event => { if (this.dialogNode && this.dialogNode.contains(event.target)) return; this.exit(); }; Here the main problem is clicking on scrollbar is same as clicking outside the modal content or backdrop area. Actually the code should be changed as follow to solve the issue checkUnderlayClick = event => { if (this.dialogNode && this.dialogNode.contains(event.target) || event .pageX > event.target.clientWidth || event.pageY > event.target.clientHeight) return; this.exit(); }; This basically test if we are clicking outside the target that includes scrollbar.

nahme2 commented 5 years ago

Have opened a PR for the above issue please review and comment on that. https://github.com/davidtheclark/react-aria-modal/pull/75

davidtheclark commented 5 years ago

Closed by #75.