helpscout / hsds-react

Help Scout Design System (HSDS) — React Component Library
MIT License
86 stars 17 forks source link

useClickOutside hook fix #1059

Closed tinkertrain closed 2 years ago

tinkertrain commented 2 years ago

Problem

There are cases when an element inside a modal is no longer there byt the time useClickOutside decides whether to execute the callback, making the check always true and so, executing the callback when it shouldn't.

Solution

Add an extra check: make sure the element clicked is visible to then execute the callback.

Added a test case in the story: https://1713afae.hsds-react.pages.dev/?path=/story/components-overlay-simplemodal--with-trigger-and-nested

  1. Open the modal
  2. Click the green button, it will get removed and the modal stays open (whereas previously it was closing it)
  3. Clicking outside the modal, closes the modal
cloudflare-pages[bot] commented 2 years ago

Deploying with  Cloudflare Pages  Cloudflare Pages

Latest commit: 3c1f9df
Status:⚡️  Build in progress...

View logs